Web Designby Jack Davis

Based on:The WEB WIZARD’S GUIDE TO

WEB Designby James G. Lengel

Chapter 1 – Planning A Web Site

• Chapter Objectives- identify and describe the audience- site purpose- plan site structure- communications through site- planning table for a site

Audiences/Users

• Yahooligans!http://www.yahooligans.com

• Fidelity Investmentshttp://www.fidelity.com/

• National Oceanic and Atmospheric Administrationhttp://www.NOAA.GOV

Audience/Design

• YahooligansChildren - limited choices

- pictures- simple words

• FidelityAdult Investors - information & advice

- quick and easy access to info.

• NOAAwide audience - researchers, meteorologists, and people who need weather information

User-Centered Design

• Organization-centered- built from company point of view- company vocabulary and structure

• Technology-centered- uses a particular set of tools- designed based on technology

• User-centered- considers target audience- what they need and how they work

Defining the AudienceDemographics

• age• gender• geographic location• residence: urban, suburban, rural• level of income• level of education• race or ethnicity• interest• history (path of Web pages previously visited)

Defining the Audience

• Who are they?• Why are they at the site?• How did they get there?• How old are they? What’s the age range?• Where do they live?• What gender? Why?• How wealthy?• History of dealing with this organization?• What are the common characteristics?

Audience DefinitionThe audience for the LeftyStuff Web site is potential purchasers of LeftyStuff products who have responded to one of LeftyStuff’s banner ads and are interested in items designed especially for left-handed people Most are adults, equally divided among men and women, between 25 and 50 years of age, who live in the United States or Canada, are sports-minded, and have family incomes greater than $50,000. Most have never visited the site before.

Site’s Purpose

• What the users will be trying to do and why?

• Part is stated in the audience definition and part is in the organization’s goals.

• Organization- increase the direct online sales of …- make it easy to find the right item …- easy to make purchases (credit card)- communicate the organization’s goals

Financial Times News

• http://news.ft.com/news/home/us

• What’s the purpose of the Financial Times Web site?- provide news and advertising- ??? (other)

• How would you define the audience?- age, gender, economics, history, ???

Goals & Objectives

• Statement of purpose should contain both goals and objectives

• Goals – state the desired long-term results, such as- “to increase the direct online sales of tennis racquets by 30% over the next year”- “provide a wider range of services to readers”

Goals and Objectives

• Objectives include specific means and methods used on the site to accomplish its goals- “to provide online readers of the newspaper with hourly updates of key news stories”

Organization and User Purposes

• Both types should be included in the purpose statement.

• A user-centered objective might be,“to promote intelligent conversation about XYZ among all audiences”

• An organization-centered objective – “to expand and broaden the reach of the program so it makes a greater impact on American education.”

Evaluating Success

• How will you know if the web site achieves the goals?To measure you must have stated measurable goals and objects. Some measures might include:- how much did product sales go up?- how many new readers registered?- how many hits on the site?- how many return hits?- how many e-mail requests?

Site Purpose

• Goals of the organization

• Goals of the user

• Objectives for display

• Objectives for interactivity

• Objectives for communication

• Objectives for technology

Planning Site Structure

• The layout of a web site typically includes each of the pages and functions of each part.

• It typically consists of a flow chart and a detailed written statement of functions.

Home Page

Complete Site Structure

Home PageAbout the

Home Page

Calendar ofEvents

TeachingResources

InstitutesFaculty and

StaffForums

TeachingUnits

Publications

Multimedia

SynchronousChat

DiscussionTopics

FacultyPages

Component Descriptions describes what’s included

• Teaching Resources SectionThis is the largest part of the site, contains materials to help teachers integrate media and democracy topics into curriculum* Teaching units: full text available on-line * Publication: references to print and on-

line publications with links* Multimedia: video, audio, image and

slide material

Function Descriptions describe how the site works.

• Functions- Dynamic home page: program staff need to change images and text on the home page weekly, without reprogramming- Database of resources: viewers need to be able to search and retrieve teaching units from a large collection. Program staff need to be able to add new units to this database easily and index them.

Goal – Function Description

• A good way to develop the site’s structure is to list the goals and objectives specified. Then, for each one, write a statement of functionality.

Calendar of Events section: Viewers will find alisting of various types of events: workshopsand institutes, offered by the program staff. Online discussions and chats offered by theprogram. Viewers can search events by topic,date, and other criteria.

Purpose Structure

To inform audiences about XYZ happenings.

“Speccing” Out the Flow Chart

• Adding important characteristics to the flow chart will make it more useful.- filename- graphics to be used- menu items- multimedia elements- input forms - etc.

Web Site Components

• Text – most efficient for many types of communication (html)- Text to be printed is a problem, one solution is to use PDF files

• Images – (gif, jpeg, & others)• Multimedia

- animation (Macromedia Flash)- sound, video- virtual reality (VR)

Interactivity is the keydifference in Web applications

User’s are interactive when they:- choose (select their next topic or page)- participate in animations (usually via choices)- search & find- buy & sell- manipulate (move screen objects)- construct- converse- play

Web appPlanning Table

Start with purpose and list site components.

Purpose Structure Function Media

To inform

audiences

about …

Calendar of

Events: list

of events …

user can

link to

teaching

resources

and …

Text, with small icons for each event …