Art 318: Art & Design for Websites

Tuesdays and Thursdays 2PM – 4:50PM
3 Credits
Prerequisites: Art 219 or by permission

instructor: Brent Patterson
office: Smith
office phone: 304-696-3532
office hours (SP13): MW 11-12, TR 1-2, other times by appointment

previous students’ sites
Kristina Murrill
Matthew Crutchfield
David Kendall
Jetwichan Chaowadee
Matthew Bailey

Current Students (spring 2013)
Tyler V.

Spring 2013 Important Dates:
Monday 1/23: MLK Day: No Class
February 8 – Last day to apply to graduate in May 2013
Friday 2/22: Last day to drop a class
March 6 – midterm
March 18 -22 Spring Break
April 22: Advanced Registration for Fall 2013 begins
May 3: Last day of classes for Spring 2013 Semester
Final Exam: Friday May 10 at 12:45PM

Assignment One – Getting Started
Assignment Two – Basic Webpage
Assignment Three – CSS Structure
Assignment Four – The Fake Website
Assignment Five – Setting up WordPress
Assignment Six: CSS3 Animation (Holiday Card)

HTML Essential Training
CSS Core Concepts
CSS Fundamentals
CSS Page Layouts
CSS Styling Navigation
Using Illustrator to Make Mockups
Using Photoshop to Make Mockups

Advanced Training:
CSS Transitions
Responsive Web Design
Interaction Design Fundamentals

Content Management:
WordPress Essential Training
Child Themes
Responsive Themes for WordPress

Course Description
This 3 credit hour course serves as an introduction to theory and logic behind HTML (HyperText Markup Language) CSS (Cascading Style Sheets), and website content management systems. Students will acquire domain names and create and maintain basic websites with an emphasis on the visual structure and human-machine interface issues of website design.

Materials & Requirements
• A data storage device such as a USB flash drive to store and back up your work
• A functioning web host and domain name that includes ftp access, php support, and at least one MySQL database. Marshall students have access to a discounted service with Bluehost at for $60 for one year. This program letʼs you cancel anytime and youʼll get a refund. You may choose another service, but I may not be able to assist you with it.
• No text required. Marshall University students have free access to at We will be using this service extensively.

Learning Objectives
At the end of the semester successful students will know what it takes to create and deploy a modern and functioning website.

Attendance policy:
ATTENDANCE AT EVERY CLASS IS MANDATORY. New material is covered nearly every day. Many students find this material very difficult, so missing just one class can result in irreparably falling behind. Excused absences will be allowed only with excuses from the Marshall University Office of Student Affairs. Do not bring me your doctorsʼ excuses or other reasons. Students will be allowed three (3) unexcused absences. Four (4) unexcused absences will result in severe grade reductions. No exceptions. It is the studentʼs responsibility to make up any work or content missed due to an absence, excused or unexcused. I do not repeat lectures. Donʼt be late. If you are more than 30 minutes late, you are considered absent for that day.

Studentsʼ final grades will be a composite of quiz scores, written assignmentsʼ scores and assignment scores. Grades are usually given one week after the due date of each assignment.

grading scale
92%–100%” A
82%–91%” B
70%–81%” C
60%–69%” D
59% or below ” F

Example Evaluation Sheet (PDF)

Evaluation Rubrics
Use the following criteria to self-evaluate your projects before submitting them. By fully understanding these standards, you should be able to predict your grade for your project.

projects receiving an A will exhibit the following:
careful planning
multiple ideas
a consideration and awareness of the principles of design
connections to previous knowledge
the capacity to place the problem into context
innovative solutions to creative problems
strong effort
acute attention to detail

projects receiving a B will exhibit the following:
some planning
some awareness of the principles of design
two or more ideas before settling on one
creative problem solved directly
good effort, but room for improvement
smallest details have been ignored

projects receiving a C will exhibit the following:
assignment completed according to criteria
little evidence of planning
weak in originality or innovation
a lack of interest in work
chose easiest solutions to problems
mediocre craftsmanship

projects receiving a D will exhibit the following:
little or no evidence of planning
assignment completed, but not according to schedule
copied other ideas, no innovation
minimal effort exerted to meet assignment requirements
little or no concern for craftsmanship

projects receiving an F will exhibit the following:
minimum amount of work delivered, or not completed
no evidence of creative thinking
incomplete or incorrect solutions to problem
negligent in completing assignment correctly or didn’t understand the assignment

Plagiarism and Academic Dishonesty
Plagiarism will not be tolerated in this course. Assigned writings must be properly cited in the MLA style. Upon the first infringement, students will receive a zero for the assignment. Upon a second offense, students will receive a zero for the course and be referred to the University Academic Affairs Office. This policy applies to imagery as well. Copyrighted photos and graphics taken from the web or scanned from printed materials and used in assignments will be considered plagiarism. Public domain imagery, however, is permitted. The instructor will provide a list of reliable public domain resources. It is the student’s individual responsibility to insure his or her work is not violating any copyright laws.
Academic dishonesty also applies to actions in which students do another student’s work, or claim another student’s work as their own.

All work submitted for assignments in this class must have been created exclusively for this class. Work from previous courses or personal work made before June 8th, 2010 and submitted for this class will classify as academically dishonest behavior.

Due Dates and Make-up policies:
Assignments and quizzes completed late will lose points for each day they are late. Exceptions can be made for university-excused absences. It is strongly preferred for the student to make the instructor aware that the work will be late BEFORE it is late. COMPUTER FAILURE and INSUFFICIENT SUPPLIES are NOT accepted excuses for late assignments. Computers fail and supplies run out at the least opportune times. Hope for the best, but plan for the worst.

Inclement Weather
Please refer to the university student handbook for the inclement weather policy. Also note that the weather in Smith Hall varies from day-today (the lab can sometimes be quite cold or hot most unpredictably).
Refer to the MU Inclement Weather Policy:

Student Work Used in Promotional Materials
Particularly strong student work from this class may be displayed on the Department of Art & Design’s website as well as the instructor’s personal website, Credit will be given when possible. If you would prefer to not have your work displayed, just let the instructor know.

Course Philosophy
Much of the software and techniques covered in this course will be obsolete in 10 years or less. The field is changing too quickly for anyone to become a master at all the software in a single undergraduate course. The empowered and educated artist/designer does not rely solely on the skills she or he has learned in school. What often is most important in this discipline is the ability to self-teach, and to adapt. This course will provide problem situations in which students learn these principles. It is not a skill but rather a mode of thinking through a process. This process involves assessing situations, questioning assumptions and adapting to new paradigms. Your greatest assets in this course will be curiosity, an open mind, attentiveness and persistence.

Special Accomodations
Accommodations will be made for students with documented disabilities. It is the student’s responsibility to make the instructor aware of any required accommodations as soon as possible at the beginning of the semester.

MU Policy for Students with Disabilities:

Lab ettiquette and behavior
No drinks, no food in the lab. Turn off your cell phone before class. Always carry your student ID. Students not currently enrolled in courses that use SH 625 should not be in SH 625, so ask the instructor before bringing in visitors. No instant messaging, texting, unassigned web browsing or accessing Facebook during class. Doing so will immediately result in an absence being recorded for that day in your attendance record. Never change peripherals (mice, keyboards, etc.) without asking the instructor. Don’t leave a mess at your machine. Wash your hands before and after using the computer lab (a lot of people use these machines, so keep your hands out of your mouth).

Please review the MU Computer Acceptable Use Policy.

Cell Phones
Put them on vibrate. Be respectful and try to limit distractions – cell phones are a prime distraction.

It is against university policy for instructors to correspond with students using any email system other than the university system. Only use your official Marshall email address ( or muOnline. Facebook is not an authorized communication method for class.

Syllabus Revisions
This syllabus is subject to change in the event of extenuating circumstances or by mutual agreement between the students and the instructor. If the syllabus is revised students will be notified of changes promptly and receive the revised syllabus in a timely manner.

It is the policy of Marshall University to provide equal opportunities to all prospective and current members of the student body, faculty, and staff on the basis of individual qualifications and merit without regard to race, color, sex, religion, age, disability, national origin or sexual orientation.

This nondiscrimination policy also applies to all programs and activities covered under Title IX, which prohibits sex discrimination in higher education.

The university ensures equality of opportunity and treatment in all areas related to student admissions, instructions, employment, placement, accommodations, financial assistance programs and other services. Marshall University also neither affiliates with nor grants recognition to any individual, group or organization having policies that discriminate on the basis of race, color, sex, religion, age, disability, national origin or sexual orientation.

Further, the university is committed to the ideals of inclusion for students, faculty and staff and whenever appropriate, will take affirmative steps to enhance diversity.

Course Outline:

Syllabus Introduction
protocols and procedures


finding assignment resources
turning in assignments checking everyday write-ups


The early web and what web pages used to look like How the web works
Where is the web going?

HTML Beginnings

Getting started
tags attributes and elements
page titles
line breaks
optimizing images with Photoshop image types for web pages
things to stay away from
Make a valid HTML file


Cyber Duck
Chrome/Firefox/Safari developer tools

CSS beginnings

exploring CSS with Firebug
modes of application (inline, internal, external) selectors, properties and values
formatting text
margins and padding
using Dreamweaver to define CSS rules

CSS Intermediate

classes and IDs
grouping and nesting
pseudo classes
background images
PNG files
analyzing web page structures troubleshooting

CSS layout Techniques

page layout techniques position (relative, absolute) float
pseudo elements specificity

HTML intermediate

meta tags
embedding media (YouTube, Quicktime, Flash)
definition lists
standards compliance
testing validation
using PNG alpha channels
hacking Internet Explorer 6.0 (ruining validation)Week 7: Site Management

Overview of Content Management Systems

content management systems databases – mySQL PHP-based dynamic pages

more to come…