Web Design,3rd Edition

3Planning aSuccessful WebSite: Part 1

Chapter Objectives

Describe the Web site development planning process Complete Step 1: Define the site’s purpose Complete Step 2: Identify the site’s target audience Complete Step 3: Determine the site’s general

content Complete Step 4: Select the site’s structure

Chapter 3: Planning a Successful Web Site: Part 1 2

The Web Site Development Planning Process

Chapter 3: Planning a Successful Web Site: Part 1 3

Step 1: Define the Purpose

Decide on a topic for the Web site

List the goals of the Web site

Determine your objectives

Purpose statement written explanation of overall goals and specific objectives utilized to achieve goals.

More on Web

Primary goal

Secondary goals

objectives

Step 1: Determine Your Goals

Goals – results of Web site in specific time frame– Reflect a realistic time frame

Example in Book – retirement planning web site– Investing money for retirement

Goals for one year period– Promote online awareness of company– Educate visitors on retirement strategies– Provide tools and methods for retirement investment

strategies

Step 1: Determine Your Objectives

Goals – methods utilized to accomplish goals– Testimonials from satisfied customers– 20% discount for purchases made in next 30 days

Example in Book – retirement planner Objectives– Establish credibility of company– Provide sound financial advice– Make available an analysis tool to determine current assets– Provide a method to calculate anticipated retirement needs– Determine strategies to achieve retirement goals– Develop individualized retirement investment plans

Your Turn! (page 72)Exploring Purpose Statements

1. Visit the Web Design Chapter 3 Online Companion Web page scsite.com/web3e/ch3/ and click Dr. Gourmet,  Oakland, and San Jose in the Your Turn links to review thee Web site purpose statements.

2. Write down your visitor expectations for the content and design of each Web site based solely on the information contained in its purpose statement. Do not look at other site pages.

3. Next, review the home page and at least two subsidiary pages at each site. Is each site's purpose statement reflected in the site's content and design? If yes, how? If no, what is missing?

Step 2: Identify the Site’s Target AudienceDefine the needs of the audience

– Develop a preliminary audience profile

Chapter 3: Planning a Successful Web Site: Part 1 8

More on Web

Step 2: Identify the Audience

how old age rangeWhat genderEducational backgroundsCareers, income levels, and lifestylesWhere do they live

Step 2: Define the Needs of Your AudienceWhat are they expecting to gain from your

Web siteNeed quick facts or in-depth explanationsbiasesExperienced Web usersInternational

– Cultural differences, norms, and customs

Step 2: Develop the Audience Profile

limited resources and tight time frame– Use audience’s top two or three needs– Continually gather feedback

• Fine-tune and add to audience profile

Step 3: Determine the Site’s General ContentThe home page is often the first page a visitor

seesShould include:

– Who– What– Where

Search feature

Chapter 3: Planning a Successful Web Site: Part 1 12

Who?answered by

company logoand name

Where? answeredby links

What?Answeredby photosand text

More on Web

Step 3: Determine the Site’s General ContentWeb sites often include multiple subsidiary or

underlying pagesShould include the same elements as its home

page:– Name– Logo– Typeface– Color scheme

Chapter 3: Planning a Successful Web Site: Part 1 13

Step 3: Determine the Site’s General Content

Chapter 3: Planning a Successful Web Site: Part 1 14

Links back tohome page

Logo, company, name typeface, color scheme, and linkplacement maintain visual identity with the home page

Step 3: Determine the Site’s General ContentA splash page uses images, animation, and

sound to capture visitors’ attention and draw them into the site

Chapter 3: Planning a Successful Web Site: Part 1 15

More on Web

Step 3: Determine the Site’s General ContentShould include value-added content:

– Relative– Informative– Timely– Accurate– High quality– Usable

Chapter 3: Planning a Successful Web Site: Part 1 16

Step 3: Determine the Site’s General ContentText

– Primary component of a Web site– Guidelines to consider

• Abbreviate text• Chunk information for scannability• Add hyperlinks to explanatory or detailed information• Use active voice / friendly tone• Remove transitional words• Do not use Web clichés

– Use Register online instead of Click here to register

Your Turn! (page 81)Exploring Purpose Statements

1. Review the public domain Q & A and then visit the Web Design Chapter 3 Online Companion Web page scsite.com/web3e/ch3/ and click  FTC in the Your Turn links.

2. Locate the Key Publication section on the FTC Identity Theft page and open a copy of a PDF publication on identity theft in your browser; print the publication. (Copy and Paste into Word document the 4 paragraphs of text you repurpose instead of printing as book says)

3. Using the guidelines for repurposing text from print publications, repurpose at least four paragraphs from the printed publication for your own Web site. As an acknowledgement, cite the source of the repurposed text in a line below the text.

4. Submit your repurposed text to your instructor. Be prepared to compare your repurposed text with the original printed publication text in class.

Step 3: Determine the Site’s General ContentImages

– After text most commonly included content element on Web sites (motivate visitors)

– Can personalize and familiarize the unknown

Chapter 3: Planning a Successful Web Site: Part 1 19

Step 3: Determine the Site’s General ContentPhotographs

– Can help deliver a message or prompt an action– Select high-quality, relevant pictures

Step 3: Determine the Site’s General ContentAudio

– Low-bandwidth alternative to video– Vary in both form and intensity– Incorporate audio into a Web site to personalize a

message, enhance recall, set a mood, or sell a product or service• Glowing testimonial from satisfied customer• Catchy jingle

Chapter 3: Planning a Successful Web Site: Part 1 21

Step 3: Determine the Site’s General ContentVideo

– Video clips incorporate movement and sound– Extremely large sizes of video– Choice for designers is to limit size of

downloadable video files or generate streaming• Downloadable Video – downloaded in its entirety before

it can be heard or seen• Streaming Video – begins to play as soon as the data

begins to stream or transfer

Chapter 3: Planning a Successful Web Site: Part 1 22

Step 3: Determine the Site’s General ContentAnimations

– Widely used to attract attention and enliven Web pages

– Adds interest and appeal to Web pages– Overuse of animations can become distracting and

annoying– Animated GIF

• Gives the appearance of moving pictures

Step 3: Determine the Site’s General ContentMultimedia

– Add action, excitement, and interactivity to your Web site

– Viewers are intrigued and entertained by multimedia presentations

– Multimedia presentations can be interactive• Users can participate• Helper Applications• Plug-ins – software program allows certain content to

function within the currently viewed Web page– Adobe acrobat plug-in needed for PDF files

Step 3: Determine the Site’s General Content

Chapter 3: Planning a Successful Web Site: Part 1 25

More on Web

Step 3: Determine the Site’s General ContentDynamically Generated Content

– Served up to your Web site visitor triggered by a specific event• Frequently called up from a database

– Active Server Pages – Microsoft ASP. Net– Scripting languages – Open source PHP

Chapter 3: Planning a Successful Web Site: Part 1 26

Step 3: Determine the Site’s General Content

Chapter 3: Planning a Successful Web Site: Part 1 27

Visitors to this site candynamically obtain a variety

of information from theuniversity database

Step 3: Determine the Site’s General ContentPlan an organized file system

– Separate into logical subfolders• HTML, photographs, audio, and video files• Create subfolder to place original files

– Word processing files– Graphics files

• These files will later be transformed into Web-usable formats

– Regularly create back ups

Chapter 3: Planning a Successful Web Site: Part 1 28

Step 4: Select the Site’s StructureOutline your Web Site – serve as a blueprint

and define major navigational paths.– Use flowchart, storyboard, sticky notes, index

cards, or text outline• Structure information to achieve Web site’s purpose

– Choose the method that you find most flexible and comfortable• Linear / tutorial structure• Random structure• Hierarchical structure

Chapter 3: Planning a Successful Web Site: Part 1 29

Linear/Tutorial Structure

Presents information in a specific order– Historical or chronological order– Training website

Chapter 3: Planning a Successful Web Site: Part 1 30

Linear/tutorial structure controls usernavigation by progressing usersthrough one Web page at a time

Random Structure

Presents information without a specific orderUse only for small Web sites

Chapter 3: Planning a Successful Web Site: Part 1 31

random structure allows visitorsto navigate pages in any

preferred order

Hierarchical Structure

Organizes information into categories and subcategories

Best used in organizational / topical Web sites

Chapter 3: Planning a Successful Web Site: Part 1 32

hierarchical structure organizesinformation into categories and

subcategories

Hierarchical Structure

Chapter 3: Planning a Successful Web Site: Part 1 33

More on Web

Chapter Summary

Describe the Web site development planning process Complete Step 1: Define the site’s purpose Complete Step 2: Identify the site’s target audience Complete Step 3: Determine the site’s general

content Complete Step 4: Select the site’s structure

Chapter 3: Planning a Successful Web Site: Part 1 34

Case Study # 3

Case Study Page 98Do steps 1-2 to produce 1 page paper using

Word.See assignment web page for details.

Web Design,3rd Edition

3Planning aSuccessful WebSite: Part 1