Required Text
Basics of Web Design HTML5 & CSS3 (2nd Ed), by Terry Felke-Morris. Pearson 2014. (ISBN-10: 0-13-312891-1)
Required Materials
• USB thumb drive(s) or portable hard drive to back up files.
• A Notebook and pencil or pen for hand written note taking.
• Ear buds or head phones to listen to video tutorials without disturbing others during working lab time.
Course Description
4 CreditsThe second course in a three-part series teaching front-end web design and development, this course picks up where GID109 ends. We begin with a brief recap of previous skills, followed by a study of additional layouts including responsive web design layouts that adapt to the size of the device being used. Additional techniques include CSS3, HTML5, flexible images, media queries, and advanced navigation bars. An overview of Mobile Web Design will be included. Students continue to increase their knowledge of JavaScript and jQuery to add interactivity to their web pages. A variety of web page assignments will be hand coded to master the fundamental techniques presented in this course. Emphasis continues on the effective use of project planning techniques, the principles of design, user experience (UX) design, writing and typography for the web, validation and browser testing. A major
component of this class will be working with a client from project planning through final presentation of the website. One of two required large-scale creative website projects will focus in-depth on working with a client. Prerequisites: GID101, GID104 and GID109 or permission of the Division Dean. GID117 Typography in Visual
Communication is recommended as a co-requisite. Spring.
Course Objectives
Upon successful completion of this course, students will:
• Manage working with a website client from initial client interview, through project planning to website completion and presentation.
• Plan and perform a client interview summarizing the results in a written report.
• Interpret and analyze the client
interview results to prioritize the client’s needs and requests.
• Compare, appraise and summarize in writing the findings of research of similar websites.
• Identify the target audience for the client’s website, the key components the audience needs/expects in a website and summarize the target audience findings in a written report.
• Write a Creative Brief to identify the work to be performed, and meet with the client for approval.
• Create a timeline for the project’s progress, approval stages and completion date, and construct the website in accordance with the timeline. • Collect and organize all website content according to the page it will appear on.
• Create thumbnails to determine a variety of layouts that support the projects needs.
• Choose the layouts and create three non-functioning full-size, full-color mock-ups for the client to choose from for the home page.
• Design three interior page layouts (based on the approved home page layout) for the client to approve. • Prepare a formal presentation and
present the completed website project to the client(s).
• Use hand coding to construct HTML page layouts that pass validation for fixed-width two-column and fixed-width three-column websites.
• Employ CSS3 to create rounded corners, box shadows, text shadows, opacity, RGBA & HSLA color and gradients. • Apply Positioning with CSS
• Create you-are-here navigation bars and CSS Sprite navigation bars. • Describe and identify the purpose of
responsive web design.
• Construct a responsive website layout; flexible images, responsive navigation. • Use Fragment Identifiers to link to a
specific portion of a page.
• Explain and use new HTML5 Elements; hgroup, section, article, aside & time • Use CSS to create a print style sheet to
control what gets printed
• Write a variety of meta tags, including the viewport meta tag.
• Write Media Queries to target different size displays.
• Construct a table and simple form. • Describe and demonstrate how to test a
mobile display
• Employ the CSS Transition property and the HTML5 Canvas element
• Use jQuery to add interactivity to their web pages
• Plan and create media and interactivity basics
• Use File Transfer Protocol (FTP) to
publish websites to online web hosting space
Grading Standards
A (93-100) Excellent comprehension of class concepts, work above and beyond class
assignments
A- (90-92) Excellent comprehension of class concepts, creative solutions to design problems B+ (87-89) Very good comprehension of
class concepts, originality shown in all work
B (83-86) Good comprehension of class concepts, demonstrated artistic progress
B- (80-82) Better than average grasp of class concepts,
demonstrated artistic progress
C+ (77-79) Average grasp of class concepts, reasonable attention to work, artistic progress
C (73-76) Average grasp of class concepts, reasonable attention to work
C- (70-72) Less than average grasp of class concepts shown, but all work passed in
D (60-69) Marginal knowledge shown, not all assignments
completed satisfactorily F (below 60) Failing, unacceptably low
level of knowledge shown, less than 1/2 work
completed, absences in excess of allowable limit
Method of Assessment
Homework assignments 25%
Tests, Quizzes 25%
Project Planning 25%
Creative Projects 25%
Estimated Homework Hours
A minimum of 5-6 hours of homework can be expected per week. All work will be due at the start of the next class, unless
otherwise noted. Work time is never given in class, for work that is due that same day.
Late Work
LATE WORK IS PENALIZED
All work is expected on time and late work will be penalized with a deduction in the grade. The techniques taught in this class build upon each other to create a comprehensive skill set, missing tech-niques will affect the student’s ability to successfully produce the work required and the quality of the student’s work.
Saving Your Work
Students are required to keep backup copies of all their homework and project files for this course.
Submitting Your Work
To receive credit for their work, students must submit their work following the correct procedure as verbally specified by the instructor in the classroom, or as specified in the assignment instructions, or in the creative project instructions.
Attendance
Students are expected to attend class on a regular basis. Poor attendance will affect a student’s final grade. The maximum number of absences is the equivalent of 5 class hours (1 week of class). The instructor reserves the right to mark down a student’s course grade 1 point for each additional class hour missed.
The instructor reserves the right to withdraw students who have missed more than 7.5 class hours in absences. If you are not present when attendance is taken, you will be considered absent. Also, it is your responsibility to get what you have missed if you are absent from class. Please see the assignment list and team up with a
classmate to fill you in on pertinent information and notes from the class you missed (deadlines, instructions, handouts, etc.)
Plagiarism/Cheating
The act of adopting ideas, written passages, visual images, etc. as ones own is
unacceptable. Plagiarism and cheating of any kind will not be tolerated and will be taken seriously with a course grade of F/Failing.
Please carefully review the full policy: http://mwcc.edu/catalog/policies.html#Hon esty
Academic Support
Many students find that college coursework provides new academic challenges.
Students who wish to deepen their
understanding of course concepts, extend their skills, and improve their performance in this course are encouraged to use the free tutoring and other support services available in the Academic Support Center. Math and writing tutors are available on a drop-in basis. Tutoring in other subjects is arranged by appointment. If you have any questions about tutoring, stop by the Academic Support Center on the main level of the college’s library, room 128.
Learning Disabilities
If you wish, please inform me of any
learning issues you may have, and how I can help facilitate your learning process.
Students with documented disabilities who believe that they may need accommodations in this class are encouraged to contact the Coordinator of Services for Students with Disabilities in room 141A, or call 978- 630-9120, as soon as possible to ensure that such accommodations are implemented in a timely fashion. The Disabilities Counselor and the Disability Services Team members are the designated persons to review your documentation, protect the confidentiality of the information disclosed, and to discuss the most reasonable accommodation options. Bring back the signed
Accommodation Recommendation Form. We can then, discuss your needs privately and implement the best accommodations in view of the required academic and technical standards of this class.
Distracting Behavior
Cell phones, beepers, and personal
headsets are simply not allowed. Turn them off during class. I insist.
Respect for self, instructor, and classmates are required at all times. Other forms of distractive behavior, such as sleeping, side conversations, disrespect toward fellow students and profanity are also not permitted in order to ensure a comfortable and