Web Design, 5 th Edition 3 Planning a Successful Website: Part 1.

Web Design,5th Edition

3Planning aSuccessful Website: Part 1

Chapter 3: Planning a Successful Website: Part 1 2

Chapter Objectives

Describe the website development planning process Complete Step 1: Identify the website’s purpose and

target audience Complete Step 2: Determine the website’s general

content Complete Step 3: Select the website’s structure


The Website Development Planning Process


Step 1: Define the Website’s Purpose and Audience Website goals Website objectives Target audience profile Target audience wants,

needs, and expectations Website purpose

statement


Step 2: Determine the Website’s General ContentThe home page is often the first page a visitor

seesShould include:

– Who– What– Why– Where

Search feature


Step 2: Determine the Website’s General ContentWebsites often include multiple subsidiary or

underlying pagesShould include the same elements as its home

page:– Name– Logo– Typeface– Color scheme


Step 2: Determine the Website’s General Content


Step 2: Determine the Website’s General ContentLanding pages generally have one of two

purposes: – to provide reference and specific information to

customers about a product or event– to encourage website visitors to complete a sales

transaction or other specific interaction


Step 2: Determine the Website’s General ContentShould include value-added content:

– Relevant– Informative– Timely– Accurate– High quality– Usable


Step 2: Determine the Website’s General Content Text

– Remember, visitors typically scan webpage text for information rather than read the text word for word

– Guidelines to consider• Chunk text for scannability• Place explanatory or detailed information on linked underlying

pages• Keep content to one page where possible to avoid scrolling• Use active voice and a friendly tone• Remove transitional words and phrases like as stated previously,

similarly, and as a result, which might not be relevant for the chunked text


Step 2: Determine the Website’s General ContentImages

– Most commonly included content element on webpages

– Can familiarize the unknown


Step 2: Determine the Website’s General ContentAudio

– Audio can vary in form and intensity– Can persuade, inspire, personalize, motivate, or

sootheVideo

– Incorporates movement and sound– Extremely large sizes of video

• Downloadable vs. Streaming media


Step 2: Determine the Website’s General ContentAnimation and multimedia

– Widely used to attract attention and enliven webpages

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

annoying– Animated GIF

• Gives the appearance of moving pictures– Flash animation


Step 2: Determine the Website’s General ContentDynamically Generated Content

– Served up to your website visitor triggered by a specific event• Frequently called up from a database• Websites that use databases to generate dynamic

content are database-driven websites


Step 2: Determine the Website’s General ContentOrganizing Website Files

– Organize the resulting files in your website– Create folders on your computer’s local hard drive– Regularly create backups


Step 3: Select the Website’s Structure Visualize the organization of the website’s pages and linking

relationships Organize the pages by level of detail Follow the links between pages to make certain visitors can

quickly click through the site to find useful information — fewer clicks mean more satisfied site visitors

Detect dead-end pages, which are pages that currently do not fit into the linking arrangement

Rearrange pages and revise linking relationships, and then visualize the changes before you create the website


Step 3: Select the Website’s StructureA storyboard is a series of pages originally

developed to graphically present scenes for a movie or television program

A flowchart is a diagram that shows steps or processes; flowcharts are another useful way to outline a website’s structures


Step 3: Select the Website’s Structure


Step 3: Select the Website’s StructureChoose the method that you find most flexible

and comfortable• Linear / tutorial structure• Webbed / random structure• Hierarchical structure


Linear/Tutorial Structure

Presents information in a specific order– Training website


Webbed Structure

Arranges information without a specific order


Hierarchical Structure

Organizes information into categories and subcategories


Hierarchical Structure


Chapter Summary

Describe the website development planning process Complete Step 1: Identify the website’s purpose and

target audience Complete Step 2: Determine the website’s general

content Complete Step 3: Select the website’s structure

Web Design,5th Edition

3Planning aSuccessful Website: Part 1

Web Design, 5 th Edition 3 Planning a Successful Website: Part 1.

Documents

Transcript of Web Design, 5 th Edition 3 Planning a Successful Website: Part 1.