How to Design a Web SiteHow to Design a Web SiteAn OverviewAn Overview

Center for Teaching and Learning - PS 1005

Brainstorming/Envisioning Brainstorming/Envisioning

Why make a site?Who is your

audience?Why will they

return?

Why make a site?Who is your

audience?Why will they

return?

Center for Teaching and Learning - PS 1005

Brainstorming/EnvisioningBrainstorming/Envisioning

Sketch your site’s sections and sub-sections

Sketch your site’s sections and sub-sections

Center for Teaching and Learning - PS 1005

PlanningPlanning

What will you need?Pictures?Documents?Information?Multimedia?

How will you get your materials?How long will it take? What’s

your timetable?

What will you need?Pictures?Documents?Information?Multimedia?

How will you get your materials?How long will it take? What’s

your timetable?

Center for Teaching and Learning - PS 1005

Designing I: ObservingDesigning I: Observing

Look at web design by others for its:

contentnavigation“look and feel”

Look at web design by others for its:

contentnavigation“look and feel”

Center for Teaching and Learning - PS 1005

Designing II: DraftingDesigning II: Drafting

Sketch your site’s homepage and sample inside pages

Sketch your site’s homepage and sample inside pages

Center for Teaching and Learning - PS 1005

Organizing (logistics)Organizing (logistics)

Being tidy helps (set up folders)imagesraw filesDocuments? PowerPoints? Flash?

Audio?filenames: no_spaces, all lowercase

is better

Being tidy helps (set up folders)imagesraw filesDocuments? PowerPoints? Flash?

Audio?filenames: no_spaces, all lowercase

is better

Center for Teaching and Learning - PS 1005

Organizing (design)Organizing (design)

Go for consistency throughout site:Similar look & feel throughout pagesFonts: less is moreDW can help (style sheets)

Navigation elements throughout:Contact info on each pageLink to home and other sectionsDW can help (templates)

Go for consistency throughout site:Similar look & feel throughout pagesFonts: less is moreDW can help (style sheets)

Navigation elements throughout:Contact info on each pageLink to home and other sectionsDW can help (templates)

Center for Teaching and Learning - PS 1005

ProducingProducing

Publishing (uploading to server)

Testing linksDifferent machines Different browsers

Publishing (uploading to server)

Testing linksDifferent machines Different browsers

Center for Teaching and Learning - PS 1005

Publicizing and Updating Publicizing and Updating

Reach out to your audience(s)classescolleaguescommunity - or communities

Re-visit and Revise your site

Reach out to your audience(s)classescolleaguescommunity - or communities

Re-visit and Revise your site

Center for Teaching and Learning - PS 1005

Summary Summary

Steps for the web site planning process:

Brainstorming/sketchingPlanningDesigningProducingPublicizingUpdating

Steps for the web site planning process:

Brainstorming/sketchingPlanningDesigningProducingPublicizingUpdating