Syllabus IT/236 Version 4

Syllabus
Axia College College of Information Systems & Technology IT/236 - Web Design I
Copyright 2009, 2007, 2006 by University of Phoenix. All rights reserved.

Course Description This course introduces effective Web design principles and the essential role of the Web designer in today's business environment. Topics covered include site architecture, page layout, navigation, content, functionality, and usability. Students will evaluate existing Web sites and apply best practices to prototype a unique design using a Web authoring application. Policies Faculty and students/learners will be held responsible for understanding and adhering to all policies contained within the following two documents: University policies: You must be logged into the student website to view this document. Instructor policies: This document is posted in the Course Materials forum.

University policies are subject to change. Be sure to read the policies at the beginning of each class. Policies may be slightly different depending on the modality in which you attend class. If you have recently changed modalities, read the policies governing your current class modality. Course Materials Textbooks Huddleston, R. (2009). Master visually Dreamweaver CS4 and Flash CS4 Professional. Indianapolis: Wiley. Sklar, J. (2003). Principles of Web Design (2nd ed.). Boston: Course Technology. Software Dreamweaver and Photoshop provided through Toolwire. All electronic materials are available on the student website. If you have your own copy of Dreamweaver and Photoshop CS4 or greater, you may use your software instead of the software provided in Toolwire . Even if you choose to use your own copy of the software to complete the assignments each week, you must complete the Toolwire tutorials for practice. Toolwire Toolwire is an experiential learning company providing access to real hardware and software over the Internet. This platform provides expert lab guides, real-world scenarios, online assessments, group collaboration, personal storage and websites so students, can receive expert hands-on technology training anywhere, anytime. Its all about the experience, because experience matters. There are two components to toolwire: the Student Desktops and the LiveLabs. Student Desktops are hosted virtual computers customized for this class training needs and provides a hands-on "sandbox" for your experiential learning. LiveLabs are similar but in addition provide expert step-by-step lab guide instructions. Completing these guided labs will help you complete the checkpoints and assignments in this course. Please note that you do not need to submit the guided labs for grading except during week 8 (see instructions under week 8).

Syllabus IT/236 Version 4

Week One: Web Site Planning

Details
Objectives 1.1 Identify how the purpose, target audience, and intended message drive Web site development. 1.2 List reasons for and importance of a Web site design. 1.3 Define fundamental Web design terminology. Read the course description and objectives. Read the instructors biography and post your own. Decide on the Web site topic and theme for your project. You design the Project plan for a 3- to 5-page Web site throughout the course. Once your topic or theme has been decided on, it may not be changed; therefore, considerable thought should be put into this decision. Possibilities include developing a Web site Plan for Reading Reading Reading Reading Reading Participation CheckPoint Web Design Terminology your favorite charitable organization. a professional portfolio about yourself. a small business needing a Web presence. your choice I suggest keeping the project simple.

Points

Course Preparation

Read Ch. 1 of Principles of Web Design. Read Ch. 2 of Principles of Web Design. Read Ch. 3 of Principles of Web Design. Read Glossary of Principles of Web Design. Read Week one Electronic Reserve Readings. Participate in class discussion by posting 8 substantive responses - 2 posts per day up to 8 posts for the week. Due date: Day 4 - Thursday Resource: Appendix B and Glossary of Principles of Web Design. Complete the Web Design Key Terms matching table in Appendix B. Post the completed Appendix B as an attachment in the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week one overview. 20 40

Syllabus IT/236 Version 4

Week Two: Project Proposal

Details
Objectives 2.1 Identify site purpose, target audience, and intended message. 2.2 Draw a site navigation map. Create a project proposal. Review the information about toolwire under the course outline in the Materials tab. Due date: Day 4 - Thursday Create the first section of a Web site plan. The plan must include: Site purpose: A short paragraph to describe the purpose of the Web site. Target audience: list of your target audience. Site slogan: It must be 10 words or less, but must drive the site purpose to the audience. Write 2 to 3 sentences explaining how the slogan with drive the Web site content. Format your paper according to APA standards using Microsoft Word 2003 or later version. Post your file as an attachment in the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week two overview. Due date: Day 7 - Sunday Submit the second section of a Web site plan illustrating the site structure to define the page content, file names, and relationships between pages. This assignment must include the following: Page content: Short paragraph for each Web page describing its content and purpose. Include each page name and be sure the page names do not include spaces or special characters. The underscore ( _ ) character is acceptable. For example, homepage: index.html or resume page: LName_Resume.html, etc. It is industry standard to name the homepage index.html. For ideas on naming your web pages, please review the Content Idea Table posted in the Course Material forum. Site structure type: List the structure type you will use with a short paragraph of why you selected this type. See your textbook, Principles of Web Design pp. 75 78. Storyboard: Create the site architecture map or storyboard using Microsoft Word, PowerPoint, Visio, or Adobe Photoshop. See your textbook, Principles of Web Design pp. 7578. IMPORTANT: You must convert the storyboard/map to a jpg and insert the storyboard/map in your paper. Format your paper according to APA standards using Microsoft Word 2003 or later version. Post your paper as an attachment in the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week two overview. NOTE: Keep in mind that there is a limit of 10 MB for uploading files in the classroom forum. If your file exceeds this amount, you must optimize your images in order to reduce the file size of your work. 50

Points

Toolwire Links CheckPoint Web Site Plan Part One

Individual Project Proposal: Site Structure

100

Syllabus IT/236 Version 4

Week Three: Web Design Concepts & Techniques

Details
Objectives 3.1 Identify popular Web design tools and their applications. 3.2 Create a Web page using Adobe Dreamweaver. 3.3 Prototype various layouts of a home page and secondary pages. Read Ch. 4 of Principles of Web Design. Read Ch. 1 of Master Visually. Read Ch. 2 of Master Visually. Read Ch. 3 of Master Visually. Read Ch. 5 of Master Visually. Read Week 3 Electronic Reserve Readings. Review the information about toolwire under the course outline in the Materials tab. Participate in class discussion by posting 8 substantive responses - 2 posts per day up to 8 posts for the week. Due date: Day 4 - Thursday Resource: Project Proposal Continue building on your Project Proposal from Week 2. You may create a new document or add to the proposal submitted on week 2. Visualize the page design for your site and create two different page designs (Theme A and Theme B). Each design theme should include a homepage and the secondary pages. Since your web project must be at least 3 web pages, you need two different themes and each theme must have a design for the homepage and the two secondary pages. A minimum of six pages should be submitted for this assignment. Include the following components: You may create the page designs using your choice of Microsoft Word, PowerPoint, Visio, Adobe Photoshop, etc. Make sure to include any suggestions provided by your instructor and any modifications made to your Project Proposal. Each page layout must include placement of headings, navigational menu, text areas, images, etc. Color and font choice should also be indicated. The example below depict a 3-page web project: Theme A
Homepage
Insert text here

Points

Reading Reading Reading Reading Reading Reading Toolwire Links Participation CheckPoint Project Proposal: Page Design

20 50

Secondary Page 1
Insert text here

Secondary Page 2
Insert text here

Home | Page1|Page2

Home | Page1|Page2

Home | Page1|Page2

Syllabus IT/236 Version 4

Week Three: Web Design Concepts & Techniques - continued

Theme B
Homepage
Home Page2 Page3 Insert text here Insert text here

Secondary Page 1
Home Page2 Page3 Insert text here

Secondary Page 2
Home Page2 Page3

Insert text here

Insert text here

Insert text here Insert text here

Submit your design themes as an attachment to the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week three overview. Exercise: Create a Web Page Due date: Day 7 - Sunday Resource: Toolwire tutorials Complete the Toolwire Lab: Create a Web Page as a learning tool. Do not submit Toolwire lab to your instructor. Complete the following: Use Dreamweaver to create your web pages as identified on your proposal. Remember, you may use your own copy of Dreamweaver if you have one. Name the homepage index.html and the secondary pages should be named with a short meaningful name that describes the page content. For example: your products page can be named products.html, your about page can be named aboutUs.html or about.html, etc. See the Content Idea Table posted during week 2 for suggestions. Do not add any images or text to your pages at this time. The pages you create for this assignment will be blank pages. We will add these items in the upcoming weeks. Save the web pages to your computers desktop. If you are working in Toolwire, you need to transfer the files from toolwire to your computers desktop. Compress your web pages and submit your web pages and post the compressed file as an attachment to the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week three overview. NOTE 1: Keep in mind that there is a limit of 10 MB for uploading files in the classroom forum. If your file exceeds this amount, you must optimize your images in order to reduce the file size of your work. NOTE 2: The web project consists of 3 - 5 pages. Keep it simple! You are welcome to add more pages to your project once the course ends. If you build more than five pages, the project will be evaluated as a whole and all pages must be complete. Intro pages are not considered web pages. 30

Syllabus IT/236 Version 4

Week Four: Web Site Structure and Navigation

Details
Objectives 4.1 4.2 4.3 4.4 4.5 Create a site (file) structure using Adobe Dreamweaver. Explain the importance of file organization for a Web site. Explain design principles for effective Web site navigation. Research and identify best practices for site navigation. Create usable navigation.

Points

Reading Reading Reading Reading CheckPoint Navigation

Read Ch. 5 of Principles of Web Design. Read Ch. 8 of Principles of Web Design. Read Ch. 4 of Master Visually. Read Ch. 6 of Master Visually. Due date: Day 4 - Thursday Research the best practices for site navigation. Find examples of effective site navigation from the Internet. Identify examples of how you would like your site navigation to work and function. Take a screen shot of at least one example. Write a 350- to 700-word paper explaining the effective design features. Include the screen shot. Format your paper according to APA standards using Microsoft Word 2003 or later version. Post your paper as an attachment in the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week four overview. Due date: Day 7 - Sunday Resource: Toolwire tutorials Complete the Toolwire Lab: Create a Site with Navigation for practice. Do not submit this weeks Toolwire Lab to your instructor. Complete the following: Create a new site structure by creating a folder on your computers desktop. Name the folder IT236_Name, where Name is the initial of your first name followed by your last name (i.e., IT236_EEarley). Make sure your folder name does not include spaces or special characters. Add a folder inside the IT236-Name folder and name it images. Select a minimum of four images you will use on your web pages and save these images in the images folder inside the IT236_Name folder. When working with Dreamweaver, it is important that you save all the images you will use on your website project in this folder before adding them to your web pages. Move the web pages you created last week to your IT236_ Name folder. Use Adobe Dreamweaver software on the Toolwire desktop or you may use your own copy of Dreamweaver if you have one. Open your homepage and secondary pages. 50

Individual Site Structure

100

Syllabus IT/236 Version 4

Week Four: Web Site Structure and Navigation - continued

Create a navigation menu on each page and hyperlinked each menu item. A navigation menu should be included on all pages with hyperlinks to the homepage and all secondary pages on each page. Below is an example of a navigation menu: Home I About Us | Services | Contact Us NOTE 1: Make sure all your pages are saved in your IT236 folder prior to creating the hyperlinks. Use a relative path when creating each hyperlink. Save the changes. Do not add any images or text to your pages at this time. Each page on your website should only have the navigation menu. We will add other items in the upcoming weeks. Compress and submit your entire IT236_Name folder and post the compressed file as an attachment to the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week four overview. NOTE 2: Keep in mind that there is a limit of 10 MB for uploading files in the classroom forum. If your file exceeds this amount, you must optimize your images in order to reduce the file size of your work.

Syllabus IT/236 Version 4

Week Five: Web Site Graphic Content

Details
Objectives 5.1 Recognize advantages and disadvantages of common graphic formats. 5.2 Explain good design techniques for integrating multimedia into a Web site. 5.3 Identify a plug-in for multimedia. Read Ch. 5 of Principles of Web Design. Read Ch. 8 of Principles of Web Design. Read Ch. 4 of Master Visually. Read Ch. 6 of Master Visually. Read this weeks Electronic Reserve Readings. Participate in class discussion by posting 8 substantive responses - 2 posts per day up to 8 posts for the week. Due date: Day 4 - Thursday Resource: Project Proposal Complete your Project Proposal from Week Three. Finalize the page design for your site by finding images and multimedia for your Web site. Include the following components: Modifications made to your Project Proposal as recommended by your instructor. Any media formats and plug-ins that will be necessary in the site A description of how graphics will be used in the site A description of the content to be included in the site and how this content will be acquired Attention must be given to copyright restrictions. A description of how usability and accessibility are considered in the site design Format your paper according to APA standards using Microsoft Word 2003 or later. Post your paper as an attachment in the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week five overview. 20 50

Points

Reading Reading Reading Reading Reading Participation CheckPoint Project Proposal: Graphic Design

Syllabus IT/236 Version 4

Week Six: Web Site Content and Layout

Details
Objectives 6.1 Discuss the implications of copyrights on the usage of content on a Web site. 6.2 Explain how to optimize text content for search engines. 6.3 Add textual content to a Web page using a table. Read Ch. 5 of Principles of Web Design. Read Ch. 6 of Principles of Web Design. Read Ch. 7 of Master Visually. Due date: Day 4 - Thursday Research and discuss copyright implications related to Web site development. Write a minimum of 350 words discussing the implications of copyrights on the usage of content on a Web site. Include how these implications may be overcome. Post your paper as an attachment in the assignment forum. Format your paper according to APA standards using Microsoft Word 2003 or later version. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week six overview. Due date: Day 7 - Sunday Resources: Toolwire tutorial Complete the Toolwire Lab: Textual Content and Tables for practice. Do not submit this weeks Toolwire lab to your instructor. Complete the following: Use Adobe Dreamweaver on the Toolwire desktop and open your homepage and secondary pages. Add a table to your web pages. Incorporate the design principles you learned in Ch. 5, Working with Tables, of Principles of Web Design. Manipulate the table to create a page layout following the one of the designs created on your project proposal. Add at least 200 words of textual content to your web pages. The content for your web pages should elaborate on your main topic. Use the Content Idea Table provided on week 2 for suggestions. Compress and submit the entire IT236_Name folder as an attachment to the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week six overview. NOTE: Keep in mind that there is a limit of 10 MB for uploading files in the classroom forum. If your file exceeds this amount, you must optimize your images in order to reduce the file size of your work. 50

Points

Reading Reading Reading CheckPoint Copyright Implications

Individual Page Content

100

Syllabus IT/236 Version 4

10

Week Seven: Web Site Effectiveness

Details
Objectives Reading Reading Reading Participation CheckPoint Insert Graphics 7.1 Identify a plug-in for multimedia. 7.2 Add images to a Web site using Adobe Dreamweaver Read Ch. 6 of Principles of Web Design. Read Ch. 7 of Master Visually. Read week 7 Electronic Reserve Readings. Participate in class discussion by posting 8 substantive responses - 2 posts per day up to 8 posts for the week. Due date: Day 4 - Thursday Resource: Toolwire Complete the Toolwire Lab: Adding Graphics for practice. Do not submit this weeks Toolwire lab to your instructor. This lab can be found under week 5 section in the Materials tab. Complete the following: Use Adobe Dreamweaver on the Toolwire desktop to insert the two images to each of your Web pages. The images should complement your site content. You may use your own images and/or images from other sources. Cite all sources in a word document and save the reference document inside your IT236_Name folder. Incorporate the design principles you learned in Ch. 8, Graphics and Color, of Principles of Web Design. This includes optimizing your images using Photoshop prior to inserting them to your web pages. Also, see image optimization provided in the course material forum. Compress and submit the entire IT236_Name folder to the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week seven overview. NOTE: Keep in mind that there is a limit of 10 MB for uploading files in the classroom forum. If your file exceeds this amount, you must optimize your images in order to reduce the file size of your work. 20 50

Points

Syllabus IT/236 Version 4

11

Week Eight: Web Site Prototyping

Details
Objectives 8.1 Apply effective design concepts and techniques to prototype a homepage and secondary pages. 8.2 Identify how CSS can be used to create a unified Web site style. 8.3 Explain the importance of usability when designing a Web site. 8.4 Recognize design principles of basic Web site appearance and functionality. 8.5 Use CSS with Adobe Dreamweaver. Due date: Day 4 - Thursday Resources: Toolwire tutorial. Complete the Toolwire Lab: Add Style to Page Content. NOTE: This is the ONLY Toolwire lab that you will submit for grading. To complete this lab, you need to have the previous toolwire tutorials completed. Compress and submit the Toolwire lab as an attachment to the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week eight overview. Due date: Day 7 - Sunday Resources: Toolwire and Master Visually Complete the homepage and your secondary pages. Make the final adjustments to your web pages and incorporate any changes based on feedback from previous weeks. You should have a complete functional 3-5 page website. Use the Adobe Dreamweaver software on the Toolwire desktop to add style and color to your content via CSS. Embed CSS style into all your Web pages to enhance the content and color of your pages. Include at least four different HTML tags in your embedded style. Use Ch. 7 of Master Visually as a reference. Compress and submit the entire IT236_Name folder as an attachment to the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week eight overview. NOTE: Keep in mind that there is a limit of 10 MB for uploading files in the classroom forum. If your file exceeds this amount, you must optimize your images in order to reduce the file size of your work. 50

Points

CheckPoint Toolwire Lab: Add Style to Pages

Individual Web Site Prototyping

100

Syllabus IT/236 Version 4

12

Week Nine: Web Site Redesign Recommendations

Details
Objectives Capstone Participation Final Project Web Site Analysis 9.1 Evaluate Web page layouts, navigation, and performance. 9.2 Develop recommendations for redesign. Participate in class discussion by posting 8 substantive responses - 2 posts per day up to 8 posts for the week. Due date: Day 7 - Sunday Analyze the Web site you selected for the Capstone Discussion question. Use the knowledge you gained from the past 8 weeks. Evaluate the current design of the site and identify recommendations for redesign. Write a 750- to 1,050-word page paper providing your evaluation and recommendations for redesign. Format your paper according to APA standards using Microsoft Word 2003 or later version. Post your paper as an attachment to the assignment forum. Grading Rubric: Please check the grading rubric included in the Course Materials section of the classroom for additional assignment requirements. Grading rubric is provided with week nine overview. 20 80

Points

Syllabus IT/236 Version 4

13

Syllabus IT/236 Version 4

14

Discussion Questions Week One Discussion Questions List three things that a Web designer must consider and understand about the purpose or target audience prior to site development. Why do you feel each of these is important to a successful plan? List the reasons why a Web site would need to be redesigned. Why do you think it is important to always be planning the next site redesign for a company? Week Three Discussion Questions Compare the advantages and disadvantages of using a Web authoring application, an HTML editor and a text editor for developing Web sites. List an example of each tool. What have you chosen as the focus of your final project Web site? Describe the preliminary design and navigation goals you aim to achieve and why. Respond to your classmates with additional design goals they might consider. Week Five Discussion Questions Based on the readings and Internet research, what are the differences between the graphic formats of jpg, gif, and png? Provide an example of when you would use each. Research a good design technique for integrating multimedia into a Web site design. Share your findings including the type of multimedia and what plug-in is needed for successfully viewing this type of multimedia on a Web site? Week Seven Discussion Questions Based on the Marketing Week (2007) article, explain the importance of usability when designing a Web site. Based on the readings this week and your own research, how might CSS be used for developing a unique Web site style? Find a Web site that includes CSS to enhance their Web site appearance and functionality. Explain why you think so. Week Nine Capstone Question Select a business or e-business Web site from the Internet. Based on your knowledge from the past 8 weeks, reply to this discussion thread with your evaluation of the page layout, navigation, and performance.

Copyright
University of Phoenix is a registered trademark of Apollo Group, Inc. in the United States and/or other countries. Microsoft, Windows, and Windows NT are registered trademarks of Microsoft Corporation in the United States and/or other countries. All other company and product names are trademarks or registered trademarks of their respective companies. Use of these marks is not intended to imply endorsement, sponsorship, or affiliation. Edited in accordance with University of Phoenix editorial standards and practices.