using dreamweaver web page design. introduction to web page design developing a new site building a...

QuickTime™ and aTIFF (Uncompressed) decompressor

are needed to see this picture.

Using DreamweaverUsing Dreamweaver

Web Page DesignWeb Page Design

Introduction to Web Page DesignIntroduction to Web Page Design

Developing a New Site• Building a web site involves creating individual

pages and linking them to other pages

• You need to have a home page (the first page visitors will see when they arrive at your URL) and that page needs to bring them into the rest of the pages of the site - usually with links

• Those pages, in turn, link to subsections that can then lead to deeper subsections


What the User Sees

• A good web site is designed so that users navigate easily and intuitively and can make a beeline to the information most relevant to them


As you plan, make sure that users can:

• Access key information easily from more than one place in the site

• Move back and forth easily between pages and sections

• Return to main pages and subsection in one step


Preparing and Planning a Web Site

• One of the most common mistakes new Web designers make isplunging into developing a site without thinking through all their goalsand design options

• the instinct is to simply start creating pages, throw them all into onebig directory, and then string stuff together with links

• when designers finally test the site out, they’re often surprised tofind that they can’t find what they want

• save yourself some grief and plan ahead – you will have a betterchance at creating an attractive web site that’s easy to maintain andupdate

Introduction to Web Page DesignIntroduction to Web Page DesignVisualizing your site• Plan your site and think about its structure and

organization. A good place to begin is by answering the following questions:

• What do you want to accomplish with your Web site (what are your goals and objectives?)

• Who is your target audience?• How will you create or collect the text and images you

need for your site?• How will you organize the files in your site?• Will you include multimedia files such as Flash, audio, or

video?• What kind of navigation system will y have for your site

(that is, how can you make it easy for visitors to move from one page or section to another in your site?)

The Basics of Web DesignThe Basics of Web Design

Graphics1. Think Small - huge image are a primary

cause of slow pages (10-12KB per image)2. Always use graphics that fit the content -

just because you have an adorable photo of your dog doesn’t mean you should have it on your web site about Skiing

3. Do not use images that blink or move or change or rotate or flash etc. Flashing graphics are distracting and annoying

Layout

1. Stick with standard layouts - the 3-column layout is most popular and most easy to read (newspaper)

2. White space is an important function of your layout - be aware of the white space on your page and how it affects how the content is viewed


Fonts1. Use standard font families - choose a font that your

browser is most likely to have. It may be boring, but your pages will look better and the designs look correct on more browsers (Helvetica, Geneva, Arial, Verdana etc.)

2. Limit the number of different fonts. Limit your page to 2 or possibly 3 standard font families - it is easier to read and looks more professional

3. Use sans-serif fonts - easier to read on computer monitors because the screen resolution is not as high as in print


Remember Your Readers

1. Test your pages in multiple browsers and operating systems

2. Write content that they want - make sure that your content covers topics that your readers want to read


Checklist for Building a Good WebsiteChecklist for Building a Good Website

The Visible Part of Your Website• Does your home page grab attention?• Is your navigation simple?• Is the design visually easy to follow?• Is the site design professional?• Is the most important information visible (without scrolling?)• Does the home page explain the following: who you are,

what you do, why you do it, and how to buy or contact you?)

• Do the pages open easily? (images optimized, minimal flash)

• Does your site accomplish its goals• Have you checked your site thoroughly for grammar

mistakes and typos?

using dreamweaver web page design. introduction to web page design developing a new site building a...

Documents