GRC 175B Web Design and Publishing I

CSN Spring Semester 2010

Section WC801   Call #24930 3.0 credits   Thursday   6:00 - 9:40 pm 1/21/10 - 5/13/10  West Charleston Campus  - Room  #113

Instructor: Michael W. Harrison Phone: 799-4000 voice mail

E-mail Questions: mwh452@interact.ccsd.net    E-mail Homework: mwh710@yahoo.com

CSN Computer Graphics Homepage http://sites.csn.edu/cg/
   

Home

Calendar

Syllabus

Syllabus

Course Description:

Due to its reach, power and importance, it is now more important than ever to have a presence on the World Wide Web. In this course students learn how to design and develop small web sites using professional XHTML and graphic editing tools and the latest web design techniques. The tools and techniques covered in this course will enable the student to design attractive and effective web pages and small web sites.

To create attractive Web sites requires some guiding principles. This class will provide you with this framework and the means to put these principles into practice. We will look at the technical and aesthetic elements of design, including color theory, typography, page layouts and more, and how they apply in the creation of attractive and effective web pages.

Student will create basic Web pages and websites using Adobe Dreamweaver . This is not just a course covering the use of this application, it also includes the theory needed to understand why and when to use it. At the conclusion of this course, students will know everything needed to design and create attractive, effective Web sites and the basics of how to promote them using the top search engines.

Prerequisite:

GRC103 & GRC119

Course Objectives:

1. To demonstrate the fundamentals of graphics preparation for the internet, emphasizing file formats and size
2. To learn the basic design principals and various layouts of a web page.
3. To explore the fundamentals Adobe Photoshop to prepare graphics for the internet.
4. To learn how to navigate and search the internet to gather information.
5. To learn about the software and hardware requirements necessary for internet browsing and publishing.
6. To learn the basics of HTML as a means for graphic design.
7. To learn to transfer files using FTP.
8. To learn to communicate and transfer files using e-mail.
9. To learn how to make 2D animation for the web.

Course Outcomes: What the student can do at the end of the course.

1. Set up web pages using basic Hypertext Markup Language (HTML).
2. Use Photoshop to prepare graphics for the World Wide Web, with optimal file formats, bit depth, resolution, and size.
3. Demonstrate good graphic design and layout of web pages, using tables, image maps, and HTML.
4. Navigate and search the internet to gather information.
5. Describe differences of the software and hardware requirements necessary for internet browsing and publishing.
6. Transfer files using FTP.
7. Communicate and transfer files using e-mail.
8. Make a 2D animation for the web.
9. Organize the files of a web site for efficient updating.

Required Text and Materials:

   A 256 MB, or above, Flash disks or a blank CD ROM(s) can be used to store assignments. Student assumes all responsibility for saving assignment data.

• Adobe Dreamweaver CS4 Digital Classroom
• by Jerry Osborn & Aquent Creative Team
• Wiley Publishing
• ISBN#987-0-470-41092-9

Grading Policy:

    Final grades are determined by accumulated scores of the assignments, tasks, quizes, and attendance.  An assignment, task, or quiz that is 1 or 2 days late will result in a 10% reduction in points earned. Late assignments, exercises and tutorials will not be accepted for a grade beyond the 2-day grace period.

WHY??

1. Having an incomplete does not allow you to take up a seat in next semester's class or use the CCSN facilities, work has to be done on your own time.
2. Incompletes automatically turn into an 'F' grade after one year.
3. Multimedia course and software changes every semester as we try to keep up with the exponential growth of the internet.

I will not automatically withdraw students from class, if you are on the roster at the end of the semester and I have seen you at least once, or if you do not turn in a portfolio, you will receive an F for the class.

Attendance Policy:

    Attendance to the lecture sections of each class is Mandatory.  Tardiness  is rude and disruptive.  If you are tardy, please see a classmate to get the missed notes after class.  On-line tutorials are to be used as a guide, they are constantly being revised.  Do not work ahead.  You are responsible for the tutorials as given in class, which very well may differ from the on-line versions.

Late Instructor Policy:

   Students must wait for 15 minutes or per other instructions if the instructor is late.

Additional Policies and Procedures of the Classroom:

1. Absolutely no food or drink of any kind can be in the lab.  If you need to leave the classroom for any reason, just quietly get up and do your business.
2. Headphones are permitted during lab time only.  Volume has to be adjusted so that no one can hear your music, even with the headphones on.
3. You will be asked to turn your cell phone off, if it repeatedly disrupts the class.
4. Scholastic dishonesty will not be tolerated and will be prosecuted to the fullest extent. You are expected to have read and understood the current issue of the student handbook (published by
   Student Services) regarding student responsibilities and rights, and the intellectual property policy, for information about procedures and about what constitutes acceptable on-campus behavior.
5. Continuos disruption of class will not be tolerated.  You will be ask to leave the classroom and I will be forced to follow the school's policy for possible dismissal.
6. Students are not allowed to download or install/delete/copy any software, or change any settings that involve the integrity of the computer, etc. If you have questions, ask first.
7. This is a school, professional, adult environment, please do not embarrass yourself or any classmate with undesirable content from the internet or any other means.
8. No visitors are allowed in the classroom, CSN policy.

Course Outline:

    Note:  this course outline is the minimum amount of content and information that this course will cover.  By no means will we follow the outline step by step, please use it as a guideline and reference only.  Please refer to the class assignments page for more detailed information of what we will cover week by week.

1. Internet / Web basics
1. Brief history
2. Standards
3. Technologies (email, ftp, http)
4. Browser basics
2. Web Design overview
1. Web as a medium
2. Client side / Server side
3. Web generations
4. Web Page standards (navigation, download speed, understandability, stickiness, content, design)
5. Form vs. Function
6. Design issues
7. User Interface Design
1. Interface usability issues
2. Navigational design and usability issues
1. Navbars
2. Templates
3. Web Page Elements
1. Basic HTML construct, building blocks
1. Editing code
2. Working with images
3. Working with links
1. Kinds (relative, absolute, anchors, email, image)
2. Making/editing links
3. Changing colors
4. Insert and playing media
5. Using the Code Reference, Quick Tag Editor.
6. Selecting Parent and Child Tags.
7. Inserting Comments.
8. Setting HTML Preferences.
9. Cleaning Up HTML.
2. XHTML
3. Color
1. Web safe, setting page/background color
4. Formats—images, multimedia
4. Production Tools
1. HTML editors
2. WYSIWYG applications
1. Dreamweaver
2. Setting up a local site
1. Site Window
2. Moving Files
3. Managing Assets
3. Other applications
1. Image Editor
2. Animation
3. Audio
4. Video
5. Pre-production
1. Acquiring the web project (initial contact to contract)
2. Planning
1. Flowcharting
2. Templates
3. Title Blocks
3. Setting up the work environment (browser, FTP client, web editor)
6. Layout and Design
1. Design principles (clarity, consistency, unity, contrast, simplicity, structure, emphasis)
2. Design issues (color, frames, fonts, resolution, browser inconsistencies)
3. Fonts and typography
1. Formatting type
2. Special Characters,
3. Spelling Check
4. Lists (Dreamweaver and HTML)
4. Cascading Style Sheets
1. Applying, removing, creating, editing
5. Controlling layout design
1. Frames
1. Good, bad, and ugly
2. Navigation with frames
3. Setting up a frameset
2. Tables
1. Setting up, adjusting, adding/removing rows and columns
2. Merging/spitting cells
3. Aligning
4. Working in Standard View
3. Image Tables
1. Slicing/assembling images
4. Graphics with Image maps
5. Flash
6. PDF
7. CSS positing and layers
1. Absolute vs. Relative
2. Creating, selecting, renaming, moving, resizing
6. Creating mockups in a graphic editor (Illustrator . Photoshop)
7. Accessibility and Internationalization issues
8. Content Creation
1. Writing for the web
2. Capturing, preparing images (scanning, digital cameras)
1. Inserting images
2. Optimizing
3. Rendering type
4. Animation
1. Creating, using animated GIFs
2. Basic SWF animation
1. Creating Flash Objects in Dreamweaver
3. DHTML
5. Digital audio/video overview
9. Interactivity, Feedback
1. Rollovers
2. Forms
1. Creating, formatting (text boxes, checkboxes, radio buttons, menus/lists)
2. Submit/Reset buttons
3. Email
4. Other types (programmed, database-driven, user-to-user)
5. Scripts
1. Status bar message
2. Popup message
3. Preload images
10. Site Testing and Optimization
1. Site check (consistency, links, browser compatibility, media, code validation)
2. Speed optimization
3. Usability testing
11. Implementation, Marketing
1. Client sign-off
2. Uploading and launching
3. Search engine listings
4. Banner ads
5. Advertising and other offline strategies
12. Hosting
1. Housing the site
2. Name registration
3. Service providers

Back To Top