|
|
||||||||||||||||||||
|
ADVANCED WEB PAGE/SITE DESIGN |
||||||||||||||||||||
|
Class Hours: 3.0 |
|
Credit Hours: 3.0 |
|
|||||||||||||||||
|
Laboratory Hours:
0.0 |
|
Revised: Spring 08 |
|
|||||||||||||||||
|
NOTE: This
course is not designed for transfer credit. |
|
|||||||||||||||||||
|
Catalog Course
Description: |
|
|
||||||||||||||||||
|
|
This problems-oriented
course will teach the use of dynamic elements to enhance web pages and sites.
Advanced concepts in page layout and site optimization will be studied with
emphasis on principles used to craft dynamic web pages that get noticed. Exercises
and projects will allow students to apply the principles of web design to
their own sites that will be created and transferred to a server in the
course. |
|||||||||||||||||||
|
Entry Level Standards: |
|
|
||||||||||||||||||
|
|
Students taking this course
should be proficient in Windows 98, 2000 or XP; have a working knowledge of
the Internet; and have a working knowledge of web-page development using
HTML, an HTML editor, and industry standard Web development software.
Students should also be able to create, scan, and manipulate digital graphics
by using a professional standard graphics program; they should be familiar
with graphic file types; be able to submit files online using online
courseware, SFTP software, and email attachments; and be able to send files
to the instructor on a backup disk or CD. |
|||||||||||||||||||
|
Prerequisites: |
|
|
||||||||||||||||||
|
|
WEB 2001 and 2002 and 2003;
and |
|||||||||||||||||||
|
Textbook(s) and Other Reference
Materials Basic to the Course: |
|
|||||||||||||||||||
|
|
Required Textbook: Recommended: Dreamweaver
CS3 for Windows and Macintosh Visual Quickstart
Guide, Tom Negrino & Dori
Smith, Peachpit Press; 1 edition (May 30, 2007),
ISBN-10: 0321503023 Recommended: Don't Make Me Think! A
Common Sense Approach to Web Usability, by Steve Krug, New Riders
Publishing, Indianapolis, Indiana, 2nd Edition, 2005, ISBN-10: 0321344758. Supplementary Materials: Students will use online subscription to
training videos from Lynda.com.
Optional online tutorial videos are available from VTC.com. Student should have USB/Flash Storage
Media, CDs or DVDs available for saving and external back-up of work. Update
back-ups of your work during each session, so in the event of computer or
service problems work can be transfered or sent to
instructor. (The student is responsible for keeping work safe and sending it
to be evaluated.) Software for This Course:
|
|||||||||||||||||||
|
I. Week/Unit/Topic Basis: |
|
|
||||||||||||||||||
|
|
Week |
Topic |
||||||||||||||||||
|
|
1 |
Getting Started |
||||||||||||||||||
|
|
2 |
Variables in the Web Design
Environment |
||||||||||||||||||
|
|
3 |
Web Site Design Principles |
||||||||||||||||||
|
|
4 |
Planning the Site |
||||||||||||||||||
|
|
5 |
Planning Site Navigation |
||||||||||||||||||
|
|
6 |
Creating Page Templates |
||||||||||||||||||
|
|
7 |
Cascading Style Sheets |
||||||||||||||||||
|
|
8 |
Web Typography |
||||||||||||||||||
|
|
9 |
Graphics and Color |
||||||||||||||||||
|
|
10 |
Using Box Properties |
||||||||||||||||||
|
|
11 |
Working with Forms |
||||||||||||||||||
|
|
12 |
Publishing and Maintaining
Your Site |
||||||||||||||||||
|
|
13 |
Frames |
||||||||||||||||||
|
|
14 |
Final Projects and
Evaluations |
||||||||||||||||||
|
|
15 |
Final Exam Period |
||||||||||||||||||
|
II. Course Objectives*: |
|
|
||||||||||||||||||
|
|
A. |
Explore the variable factors
that affect web design. I,II,II |
||||||||||||||||||
|
|
B. |
Develop web pages that
focus on both the user's needs and the information requirements of content
while producing a site that is easy to navigate and quick to download.
I,II,II,IV,V,VI |
||||||||||||||||||
|
|
C. |
Create, scan, save, and use
graphic images in web documents. I,II,II |
||||||||||||||||||
|
|
D. |
Use HTML tables to create
page templates to provide control over how page content displays.
I,II,II,IV,V,VI |
||||||||||||||||||
|
|
E. |
Use Cascading Style Sheets to
manipulate text properties to achieve professional, effective results with
quick download time. I,II,II,IV,V,VI |
||||||||||||||||||
|
|
F. |
Use color, text, and
graphics judiciously to communicate and guide the reader through a site and
test the sites in a variety of browsers and at different ranges of connection
speeds. I,II,II,IV,V,VI |
||||||||||||||||||
|
|
G. |
Explore the advantages and
disadvantages of designing web pages with frames. I,II,II,IV,V,VI |
||||||||||||||||||
|
|
H. |
Use forms to collect data.
I,II,II,IV,V,VI |
||||||||||||||||||
|
|
I. |
Transfer files to the web
server from the local computer and update the site as needed. I,II,II,IV,V,VI |
||||||||||||||||||
|
*Roman numerals after
course objectives reference goals of the Web Technology program |
||||||||||||||||||||
|
III. Instructional Processes*: |
|
|
||||||||||||||||||
|
Students will: |
|
|
|
|||||||||||||||||
|
|
1. |
Use technology to promote
the objectives of this course; specifically, the Internet, Web search
engines, email, and word processing. Technological Literacy Outcome |
||||||||||||||||||
|
|
2. |
Use web research to
investigate areas of interest in building web sites. Technological
Literacy Outcome |
||||||||||||||||||
|
|
3. |
Use interactive learning
through writing, listening, and speaking in the collaborative activities. Communication
Outcome |
||||||||||||||||||
|
|
4. |
Use research activities to
promote independent thinking. Active Learning Strategy Outcome |
||||||||||||||||||
|
|
5. |
Use software tools and web
development skills to develop web sites that are attractive, functional, and
efficient. Technological Literacy Outcome |
||||||||||||||||||
|
*Strategies and outcomes listed
after instructional processes reference TBR’s
goals for strengthening general education knowledge and skills, connecting
coursework to experiences beyond the classroom, and encouraging students to
take active and responsible roles in the educational process. |
||||||||||||||||||||
|
IV. Expectations for
Student Performance*: |
|
|
||||||||||||||||||
|
Upon successful completion of
this course, the student should be able to: |
||||||||||||||||||||
|
|
1. |
Describe the current state
and design limitations of HTML. A |
||||||||||||||||||
|
|
2. |
Learn how XML and XHTML
could transform the future of the web. A |
||||||||||||||||||
|
|
3. |
Describe how web browsers affect
the way users view web sites. A |
||||||||||||||||||
|
|
4. |
Decide if you should use an
HTML editor to create markup code. A |
||||||||||||||||||
|
|
5. |
Identify the elements that
make up a well-designed web page. B |
||||||||||||||||||
|
|
6. |
Research the Web to locate attractive,
well-designed web pages. B |
||||||||||||||||||
|
|
7. |
Describe how screen
resolution and connection speed affect the user's browsing experience. B |
||||||||||||||||||
|
|
8. |
Clear the cache when
testing your site. B |
||||||||||||||||||
|
|
9. |
Describe how web pages are delivered
via the Internet and stored on a user's computer. B |
||||||||||||||||||
|
|
10. |
Use image maps in HTML
documents. B |
||||||||||||||||||
|
|
11. |
Create a site specification
document. B |
||||||||||||||||||
|
|
12. |
Identify a content goal. B |
||||||||||||||||||
|
|
13. |
Create a user-focused site
by analyzing the audience. B |
||||||||||||||||||
|
|
14. |
Consider the different
roles and talents necessary to build a web site. B |
||||||||||||||||||
|
|
15. |
Create naming conventions
for site files. B |
||||||||||||||||||
|
|
16. |
Build a relative file structure
that is portable to different web servers. B |
||||||||||||||||||
|
|
17. |
Understand navigation
principles. A,B |
||||||||||||||||||
|
|
18. |
Build navigation schemes
that meet users' needs. B,C |
||||||||||||||||||
|
|
19. |
Use hypertext linking
creatively. A,B |
||||||||||||||||||
|
|
20. |
Use the Internet to do
research. F |
||||||||||||||||||
|
|
21. |
Use graphical for navigation
and linking. A,B |
||||||||||||||||||
|
|
22. |
Understand how tables can
enhance the display of content. A,C |
||||||||||||||||||
|
|
23. |
Use HTML table elements and
attributes to customize page templates. A,C |
||||||||||||||||||
|
|
24. |
Learn how to take a page
design concept to HTML code. A,C |
||||||||||||||||||
|
|
25. |
Recognize basic page
templates. A,C |
||||||||||||||||||
|
|
26. |
Understand principles for
type design on a web site. A,E |
||||||||||||||||||
|
|
27. |
Understand why you should
use Cascading Style Sheet (CSS) instead of the <FONT> element. A,E |
||||||||||||||||||
|
|
28. |
Create style rules using
the CSS language. A,E |
||||||||||||||||||
|
|
29. |
Selectively apply CSS style
rules. A,E |
||||||||||||||||||
|
|
30. |
Specify CSS font properties
and block-level space values. A,E |
||||||||||||||||||
|
|
31. |
Build and apply style
classes. A,E |
||||||||||||||||||
|
|
32. |
Understand the differences
between the web-based image file formats: GIF, JPG,
and PNG. A,F |
||||||||||||||||||
|
|
33. |
Know which type of file
format to use for which type of image. A,F |
||||||||||||||||||
|
|
34. |
Understand the basics of
computer color. A,F |
||||||||||||||||||
|
|
35. |
Use hexadecimal color
values to add color to pages. A,F |
||||||||||||||||||
|
|
36. |
Use the <IMG> element
and attributes to display images effectively. A,F |
||||||||||||||||||
|
|
37. |
Understand the benefits and
drawbacks of frames. A,G |
||||||||||||||||||
|
|
38. |
Understand and use frames
syntax. A,G |
||||||||||||||||||
|
|
39. |
Understand and use frame targeting
and special targeting names. A,G |
||||||||||||||||||
|
|
40. |
Design framesets that
accommodate different screen resolutions. A,G |
||||||||||||||||||
|
|
41. |
Design forms to collect
information. A,F |
||||||||||||||||||
|
|
42. |
Understand the features of Internet
Service Providers and what to look for when choosing one. A,I |
||||||||||||||||||
|
|
43. |
Use the File Transfer
Protocol (FTP) to transfer files to and from the website. A,I |
||||||||||||||||||
|
|
44. |
Plan for usability testing
and user feedback. A,I |
||||||||||||||||||
|
|
45. |
Plan for ongoing site
maintenance and updates. A,I |
||||||||||||||||||
|
|
46. |
Use a variety of ways to
enhance search engine listings of web site. A,I |
||||||||||||||||||
|
*Letters after performance
expectations reference the course objectives listed above. |
||||||||||||||||||||
|
V. Evaluation: |
|
|
||||||||||||||||||
|
|
A. Testing Procedures: 40%
of grade |
|||||||||||||||||||
|
|
Online quizzes are built
into this course. The primary portion of the student's grade will be based on
hands on projects completed. The purpose of the online quizzes is to encourage
the student to work through the lessons, exercises and to help become
familiar with the concepts and principles explained in the textbook and
chapters and tutorial videos. The quiz items are randomly generated from a
bank of quiz items; each quiz may receive a different set of quiz questions
over a specific topic. A comprehensive final quiz also delivers random
questions from each course topic. Quizzes: 30 percent of grade. Students will
be given a series of non-cumulative theory exams over textbook content during
the semester. These exams will consist of true/false, multiple choice, and
essay questions. |
|||||||||||||||||||
|
|
B. Laboratory Expectations: |
|||||||||||||||||||
|
|
N/A |
|||||||||||||||||||
|
|
C. Field Work: |
|||||||||||||||||||
|
|
N/A |
|||||||||||||||||||
|
|
D. Other Evaluation
Methods: 60% of grade |
|||||||||||||||||||
|
|
Projects: 55 percent of
grade. Students will be given several chapter-based projects and two
broad-based projects involving the manipulation of digital graphics. Using
Photoshop and ImageReady will comprise the major
part of the grade for this course. The projects will be completed in the
course of reading and working through the textbook. The files will be sent
weekly through the WebCT Assignment utility. Online Communication Tools: 5 percent of
grade. Students will use email to communicate with instructor and with each
other. |
|||||||||||||||||||
|
|
E. Grading Scale: |
|||||||||||||||||||
|
|
|
|||||||||||||||||||
|
VI. Policies: |
|
|
||||||||||||||||||
|
|
A. Attendance Policy: |
|||||||||||||||||||
|
|
|
|||||||||||||||||||
|
|
B. Academic Dishonesty: |
|||||||||||||||||||
|
|
Each student is expected to
submit only his/her work. Do not collaborate on work with other
students except for a group project. Plagiarism, cheating, and other forms
of academic dishonesty are prohibited. Students guilty of academic
misconduct, either directly or indirectly through participation or
assistance, are immediately responsible to the instructor of the class. In
addition to other possible disciplinary sanctions which may be imposed
through the regular |
|||||||||||||||||||
|
|
C. Accommodations for
disabilities: |
|||||||||||||||||||
|
|
If you need accommodations
because of a disability, if you have emergency medical information to share,
or if you need special arrangements in case the building must be evacuated,
please inform the instructor immediately. Please see the instructor privately
after class or in his/her office. Students must present a current
accommodation plan from a staff member in Services for Students with
Disabilities (SSWD) in order to receive accommodations in this course.
Services for Students with Disabilities may be contacted by going to Goins 127 or 131 or by phone: 694-6751(Voice/TTY) or
539-7153. |
|||||||||||||||||||
|
|
D. Other Policies: |
|||||||||||||||||||
|
|
Some exams are to be taken
at the It is the responsibility of students who
are taking this course at a distance and cannot come to the Facilities:
Students must have a valid Pellissippi ID to be
presented on demand to gain access to Pellissippi
facilities Hardware Requirements for this Course IBM criteria:
Software:
Macintosh criteria:
Software:
|
|||||||||||||||||||