MAT-125 (summer)

MAT-125 Online, Web Design Fundamentals

Syllabus Contents

To jump to a section of this syllabus, select from the links below. Note: These links are only for convenience; students are required to read the entire syllabus.

The Basics
Meeting Times + Places |  Instructor Contact  |  Prerequisites | Administrative Deadlines and Drops |  Pass/No-Pass Grading Status Holidays | Course Objectives | Student Learning Outcomes | Technical Help | Students with Disabilities | Other Miracosta Student Resources

Course Requirements
Required Textbooks and Software | Completion of Work | Course Timeline | Discussion Boards | Critiques

Grading and Assignments
Grading Policy | Class Participation Grading Breakdown + Assignments

Class Orientation Videos

The Basics

Meeting Times and Place

  • Summer Session (8 weeks total), from June 15 – August 6, 2015
  • Class Meeting Place: ONLINE ONLY
  • Class Sessions: Weekly via Blackboard announcements and discussion boards
  • Office Hours: By appointment via Blackboard Collaborate online conferencing tool. In-person appointments will not be available for this course.


Leigh Cotnoir,

Instructor Contact

Regular effective contact and interaction with the instructor will be maintained through weekly instructor-prepared electronic lectures and updates to the class website, weekly email announcements, active online discussion and question and answer forums, timely instructor feedback on student work, weekly online office hours (by appointment), synchronous web conferencing or screen-sharing sessions (by appointment), and through responding to student emails, phone calls, and/or other questions or postings in a timely manner. Students can reasonably expect to hear back from the instructor within 1-3 days (excluding weekends and holidays) for most inquiries. If the instructor expects to be absent and unable to post materials and/or respond to email or discussion forums in excess of three or four days, she will notify the class and make other accommodations. If you have concerns about instructor contact or any other regard, please refer to the section on Students Rights in the MiraCosta College catalog (



IMPORTANT Administrative Deadlines!

The following dates apply to this 8-WEEK CLASS deadline schedule! These are not necessarily for other courses you are taking!

  • 6/19/15, Friday : Last day to drop without W and to receive a full refund

NOTE: the instructor of this class WILL NOT agree to a late appeal for a grade change, removal of a W, or to help get a refund if the student fails to abide by the above deadlines. You have been warned.

Regarding Administrative Drops

While students are not graded on attendance in this class, participation is included in the grade. If a student is not regularly participating and turning in assignments, s/he will be subject to an administrative drop by the instructor for lack of participation. This behavior pattern is equivalent to missing too many classes in an on-ground course. If the instructor deems that a student’s lack of participation will so severely impact the student’s ability to pass the course, she reserves the right to drop you within the acceptable instructor drop period. Please know that a student’s financial aid status has no bearing on the instructor’s decision. Students receiving aid based on number of enrolled units can potentially lose their that aid if an instructor drop puts them below their stated aid threshold.

Pass/No-Pass Grading Status

All students have the have the right to switch your grading status to Pass/No-Pass before the stated deadline above. That means that your grade point average will not be affected, and it will not have a negative impact on your transcript should changing circumstances prevent you from doing as well as you wanted. This option might be good for people who are on the fence about taking the course because they already have a heavy school and/or employment workload, and are worried about their GPA being negatively affected. You can still take the course without the fear/stress of falling behind and needing to drop later.

While Miracosta’s Media Arts & Technologies department accepts “Pass” grading outcomes toward their degrees/certificates, some other institutions and degree plans will allow P/NP electives as transfer units If you are counting on receiving credit for the class in another degree/certificate program, it is imperative that you check with your advisor to be sure it will count. You also need to ensure that P/NP status will not affect your aid package if you receive a form of financial aid.

IMPORTANT: It is the student’s responsibility to change this grading status with the enrollment office BEFORE the stated deadline above. The instructor cannot do this for students.


  • 7/3 : Independence Day

Course Objectives

This course introduces the fundamentals of building Web pages including HTML programming, CSS, effective images/backgrounds, interface design, and SFTP protocols for uploading Web sites. Students also learn the management techniques for personal Web pages, browser and platform issues, as well as the basics of network protocols.

At the end of this course a student will be able to:

  1. execute intermediate-level HTML programming skills, including debugging techniques;
  2. implement practical image editing techniques for web display;
  3. repurpose content from other media to web delivery;
  4. implement fundamental design principles into user interface designs;
  5. upload, update and maintain a basic web site;
  6. evaluate various web browser differences and functionalities;
  7. implement fundamental skills in file management and server techniques.

Students will be expected to achieve these goals through assignments, demonstrations, lectures, and critiques. It is important to learn from both instructors and peers to better understand the context and originality of your own work. Participation is critical in learning new techniques, approaches, and ideas in design.

Student Learning Outcomes

The Miracosta faculty believe that students who complete one or more certificates or degrees are systematic, critical, creative thinkers and clear communicators who are intellectually curious, technically proficient, professional, and aesthetically literate. To that end, the faculty have identified seven Student Learning Outcomes (SLO’s) that apply directly to the high-level skills you are expected to possess for the professional workforce:

  • Technical Skills
  • Application of Discipline Skills
  • Critical Thinking and Problem Solving
  • Communication
  • Professional Behavior
  • Aesthetic Literacy and Appreciation
  • Global Awareness and Responsible Citizenship

Specifically, when you have completed this course, you should be able to:

  • Apply HTML and CSS coding techniques to construct and format web pages using modern web standards.
  • Demonstrate and employ effective and efficient web-server skills and techniques.
  • Arrange, assemble and construct a web-based project and deliver in appropriate format.

Need Technical Help or Advice?
While I will do my best to help students out in all areas, I will not be acting as technician during this course. Your system is your responsibility. I cannot troubleshoot your system problems.

Students With Disabilities

If you have specific physical, psychological or learning disabilities and require accommodations, please let me know early in the semester so that your learning needs may be appropriately met. You will also need to provide documentation of your disability to Disabled Students Programs & Services at 760-795-6658.

Other Important Student Resource Links:

Course Requirements

Required Textbooks:

Learning Web Design: A Beginners Guide to HTML, CSS, JavaScript, and Web Graphics Fourth Ed.Edition
Fourth Ed.
Author(s): Jennifer Niederst Robbins
ISBN10: 1449319270
ISBN13: 9781449319274
O’Reilly Press

(PLEASE NOTE: exercise lessons in the book are for practice only and are not graded materials in the class. This book has been selected primarily for its readings, which will be the basis of several graded discussion boards.)

Software and Computer

Because this is an online course, students are expected to have access to a computer that meets the minimum requirements of Miracosta’s browser-ready guidelines. Furthermore, it is the instructor’s recommendation that students also have decent speakers or a headset to listen to video lectures and tutorials, as well as access to high-speed internet (cable, DSL, or better connection). Students on dial-up modems might experience some problems getting the content delivered in a timely or useful manner.

Software that you need is as follows:

  • A Simple, Free Code Editor (recommendations below)
    • RECOMMENDED FOR ALL USERS: Komodo Edit free editor (Mac and PC)
    • Other (Mac Users): Sublime
    • Other (PC Users): Notepad++
    • Special Note: If you already have Dreamweaver and want to use it, you may. The instructor will not be teaching this course as a Dreamweaver course, but you are free to use it as a code editor. It does, admittedly, have very good color coding and “Find-and-Replace” features. The instructor will not be supporting Dreamweaver troubleshooting, though.
  • Free SFTP Program for Connecting to the Server (recommendations below)
  • Design Software (recommendations below)
    • Adobe Photoshop (STRONG recommendation!)
    • Adobe Illustrator (OPTIONAL. Great tool if you know how to use it!)
  • Browsers (only one required, but several are recommended for testing)

Here is what the instructor recommends NOT USING:

  • Notepad (PCs)
  • TextEdit (Macs)
  • Why??? They have no syntax color coding features, which makes it VERY hard to troubleshoot errors. Also, TextEdit can actually store formatting info in its files, which will really confuse you and mess you up.

Completion of Work

You are required to check into the class each Monday to see what you are responsible for doing each week. You will look in the Blackboard “Weekly Schedule!” link to find the current week’s folder. Weekly folders will be made available at the start of each week. Each weekly folder is divided up into sections of: Assignments, Lectures/Tutorials, and Readings/Browsings. Most assignments will be much easier if you do your readings and lectures first (or concurrently)!

You will be expected to complete ALL assignments. Incomplete assignments will be evaluated as-is when turned in. Late work can only be turned in up to one full week late after the original due date (with a grade reduction). As the course progresses, students can expect to spend, at a minimum, approximately 20 hours a week working on this course’s content to be successful since this is a compressed summer course.

Course Timeline

In addition to having clearly structured “Weekly Schedule” folders and a “Due Dates” page in Blackboard, students can also look at the instructor’s teaching website at any time for this information in the event Blackboard is down or scheduled for maintenance when you are working. This timeline has two “schedules” that help you organize your production time for assignments:

  • Assignment Prep “Schedule”
    • This  “schedule” outlines everything you need to do at a glance to succeed for each assignment. It outlines links to demos, readings, and other course materials students need to complete each assignment.
  • Chronological Timeline
    • This is an at-a-glance chronological course timetable organized by weeks. Each week outlines what activities students should be doing to keep up, as well as listing dues dates for both assignments and progressive deadlines.

You can visit the online course schedule page now to get an idea of how it is organized.

For a simple list of deadlines, visit the assignment deadlines page.

Discussion Boards

You will be expected to participate in Discussion Boards almost every week, and sometimes more than once a week. In a normal classroom environment student-to-student interaction is just as important as student-to-teacher interaction; this is also true in an online learning environment. Because students will not be participating in any group projects for this course, the Discussion Boards are intended to encourage students to communicate with and help one another—just as they would in an on-ground classroom. Discussion boards will show up in your “Weekly Schedule!” folder as they are progressively assigned.

With the understanding that our class weeks will be Mondays 12a.m. – Sundays 11:59pm, you will make weekly posts according to the instructions in each individual discussion forum. Be aware that each forum has different requirements and due dates, so follow instructions to receive credit. You will NOT receive “late” credit for discussion boards, as they are specifically to engage you at that point in the course, as if you were in class. There is a technical help forum, however, to which you will contribute throughout the semester, which has a much longer-range due date. You may contribute as many posts as you want, as long as you meet these minimum requirements for credit. This participation will help the class stay lively, allow students to play active roles in helping other classmates, and foster a better understanding the course material. These forums are intended to serve several discussion roles:

  • Act as technical help boards for peer-to-peer help
  • Act as a place for students to share observations about web design techniques, methods, and trends
  • Serve as a place for students to share course-relevant design news and links
  • Serve as a place for students to share their own web work links and get constructive feedback / critiques
  • Discover that other people are experiencing similar problems, and find similar resolutions
  • Share observations about problems in scripts, misprints in the book, etc.

Lastly, some common sense rules apply to these forums: always be constructive in your criticism; always be respectful and courteous, and use good judgement so as not to post offensive material.

Critiques (For Credit)

It is imperative that each student contributes to each critique. A dialogue of constructive criticism is what helps artists and designers find weaknesses and strengths in their work. These sessions are important tools in refining your own self-critiquing and design processes. We will have online critique assignments for each project, either through discussion boards or Blackboard Collaborate. Critiques will be assigned during the semester.

Drawings, Artwork, Comps

With each project, you will be required to create either hand sketches or computer drawings of web wireframes and layout design ideas before embarking on the full-scale project. You will need to create these precursory drawings with a computer design tool (likely Illustrator or Photoshop), or you can can digitize your hand sketches ona flatbed scanner. All materials turned into the instructor must be in digital format.

This course will also place an emphasis on the visual presentation aspect of design in addition to the purely technical components. It is a marketplace reality that users respond best to strong visual design and functional presences in websites, which further challenges and complicates the job of the web designer. Integrating a strong visual design front-end and a cohesive technical back-end will be one of the challenges in this course. Thus, knowing industry-standard graphic design tools such as Adobe Photoshop and/or Illustrator will be very helpful to your success in this course. You will be expected to use these tools on a regular basis to produce and prep artwork for comps and final web graphics.

Grading Policy

You may turn in a project late up to one full week after the original due/critique date. Any work later than one week overdue will be subject to receive an “F” without consent from the instructor . If you know you will be unable to complete work on time, please discuss it with the instructor in advance! Please note that your grade will automatically drop by 10 points for late work. This means that if work is up to a week late, your highest possible grade begins at a 90.

The final project is the exception! ******NO LATE WORK ACCEPTED FOR THE FINAL.******

Class Participation

This is an online course, so class participation is monitored in a variety of ways. While there is not a specific “Participation” evaluation value in your final grade, your level of participation will often help determine borderline grades, flexibility in missed work, etc. Participation is monitored through the following outlets:

  • meeting progressive deadlines for samples, preliminary sketches, etc.
  • contributing in a timely fashion to the discussion boards
  • critique participation
  • clear communication with the instructor and peers

Grading Breakdown and Assignments:

Letter Grade Assignments

Letter Value Numerical Value
A 90-100
B 80-89
C 70-79
D 60-69
F 0-59


Completed projects will be graded on the following criteria (OVERVIEW):

  1. Instructions (did you follow technical instructions for the assignment?)
  2. Craftsmanship (is the finished piece and presentation clean and well-crafted?)
  3. Overall Composition and Creativity (did you understand and successfully execute the problems presented?)

For detailed grading criteria, you will need to refer to each project outline page. Grading rubrics for specific assignments are available via Blackboard.

Grading Definitions

  • A = Outstanding achievement: available only for the highest accomplishment
  • B = Praiseworthy performance: definitely above average
  • C = Average: award for satisfactory performance, most common undergraduate grade.
  • D = Minimally passing: less than the typical achievement.
  • F = Failing.

**No incompletes will be given without EXTENUATING circumstances.

Class Orientation Videos

After reading the entire syllabus, please watch the two class orientation videos to learn the following:

  • how the course is set up in Blackboard
  • where to find all Blackboard resources for the class
  • where to turn in assignments for this class
  • how to get started online in this class


Please note that this was recorded for a previous semester, but the information is still relevant about knowing how to use Blackboard specifically for our class. Disregard dates that do not correspond with this summer class. 



Digital Art, Design, and Communication Education