WWW Page Design and Construction | New School University | Computer Instruction Center
Keith Alexander, Instructor
keith@nootrope.net
Course description:
This course covers all of the aspects required to define, design and deploy
a multi-page www site. HTML, image creation and manipulation, file transfer protocol,
information architecture and design will be discussed. Building pages from ‘scratch’
is the focus, no HTML editors or graphic-based text tools will be used.
Classes last 2.5 hours. 12 classes over 6 weeks.
Course pre-requisites:
A solid understanding of computer operation including opening and saving files in a basic text editor,
navigating the file structure and disk drives, Internet navigation and search. An account on
New School's web server is provided.
Course requirement:
Students will be expected to attend at least 75 percent of the course, and be
able to demonstrate proficiency by building a working website.
- - -
Day 1
Intros, Net history, why online resources and not a book, wysiwg vs. hand
Why HTML is not programming, content is king
Functional specifications – operation and site features
Tech specifications - end user profile, supported platforms, browsers and plug-ins, bandwidth
Creative briefs - color theory, content types, look and feel, tone, message
Proposals - pitching a concept / benefits vs. features
Q&A
Assignment: Analyze a favorite site. What works, what doesn’t. Present findings
Day 2
Review
View analyzed sites
Define student’s sites
Naming conventions, basic directory structures
Using the View Source function
Writing clean HTML
Basic Tags and attributes:
html, head, title, body - bgcolor (hex vs. names), text, p, br, center
Q&A
Assignment: Write creative brief or a proposal
Day 3
Review
Review briefs and proposals
Basic Tags and attributes:
hr - width, size, noshade, color, %, pixel
font - size, face, color
blockquote, pre, b, i
Q&A
Assignment: Create site maps
Day 4
Review
Review site maps
Converting MS Word documents to HTML (why not to)
Create two dummy pages
A - href, absolute, relative, target, alink, vlink, link, mailto:
Link dummy pages
Lists OL/UL, type (disc, circle, square)
Beginning Photoshop - toolbar tour, file types, load times, choosing colors, creating files
Q&A
Assignment: Begin text content collection
Day 5
Review
Tiled Backgrounds
Intermediate Photoshop - RBG vs Indexed, layers, text, buttons, filters
img src - alt, height, width, border
Tables tr, td, height, width, border, cellspacing, cellpadding
Final content collected and reviewed
Q&A
Assignment: Begin image content collection
Day 6
Review
More Tables - cellspan and rowspan, cell bg colors, headers and captions, align and valign
Discuss design concepts - what makes a good site
Information architecture - global navigation, auxiliary navigation, site depth
Create final directory structure
Q&A
Assignment: Finalize the site map
Day 7
Review
Review content collected
Intermediate Photoshop - toolbar, functionality, 89a transparent .gifs
Embedding sound and video – QuickTime, RA
Pop-up window using a javascript
Review final directory structure, creative briefs and proposals
Start building sites
Q&A
Assignment: Begin resource listing
Day 8
Review
QA/QC - methodologies and tools
Using echoecho.com - penetration rates, installed user base, adoption rates, percentages, browser wars
Testing matrix, browser compatability issues, platforms and processors
Site building (individual instruction)
Q&A
Day 9
Review
Discuss CSS, DHTML, flash, XML, javascript, programming languages, CGI, forms, frames,
streaming A/V, WML, WAP, NT, Linux, UNIX, cookies, image maps
Simple pop up window reusing a javascript
Site building (individual instruction)
Q&A
Day 10
Review
Metatags – redirect, content
Adding a counter to a page
Understanding IP addresses and DNS, DTD, The W3
Registering domains – Network Solutions and Register.com
Registering with search engines
ftp sites live
Q&A
Assignment: Post mortem on the process
Day 11
Review
Student Presentations and assessment
Q&A
Assignment: Online resources final list due
Day 12
Final Review
Resources
Q&A
Closing statements
- - -
d i g i t a l _ p r o j e c t _ m a n a g e m e n t _ c o u r s e
b a c k
|