5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design.

55 ESSENTIAL WEB DESIGN ELEMENTS

A Writer’s Guide to Website Design

Element 1: Brand Yourself

What is a brand? A brand is more than a logo You create a brand with:

Icons, logos, informational graphics, colors and typography

Specific, parsed components of content for web consumption

A consistent look-and-feel for all pages of your website

2

© www.melanieevemiller.com

Brand Examples

www.publix.com

www.apple.com

www.nike.com

www.target.com

www.pepsi.com

Well-known Brands: Author Website:

www.melanieevemiller.com

3


Element 2: Intuitive Navigation

Navigation is how a person “navigates,” or moves, from one part of your site to the next.

Navigation should: Be clear and easy to follow Always link to the main sections of your site Be consistent and present on all pages

4


Navigation Examples

Good:

Bad:

Shown right, 3D navigation is almost always bad. It's harder to manipulate, it doesn't show the choices as well as a 2D interface, and it tends to be slower to use. *Image from archived specialized.com)

http://www.useit.com/alertbox/bad-design.html

Shown below, tab metaphors are a good example of intuitive navigation:http://www.sitepoint.com/

5


Element 3: Write for the Web

Most of your online audience will scan content rather than reading it.

6


Write for the Web by Using:

Highlighted keywords using: Hypertext links Typeface variations (i.e. size, bold, italics–not ten

different fonts!) Color

Bulleted lists One idea per paragraph

You must “hook” users with the first few words in the paragraph.

Less text than conventional writing Use half the word-count to convey your message

http://www.useit.com/alertbox/9710a.html

7


Element 4: Search Function

Every good website has a search feature to allow users to search the site

Users want to feel empowered to find what they are looking for in the quickest way possible

8


Element 5: Engaging Content

Write to Be

Read

Write Powerful Headlines Use Lists Employ Effective Images and

Captions Use Hyperlinks to Supply

Supplemental Information

9


http://www.sun.com/980713/webwriting/wftw5.html

5 Essential Web Design Elements

Consistent Brand Intuitive Navigation Write for the Web Search Function Engaging Content

10


Jupiter Images, Unlimited. Stock photos, royalty free images and stock photography. All document images. Retrieved October 31, 2008, from http://www.jiunlimited.com

Lynch, Patrick J. & Horton, Sarah. (2001). Web style guide: Basic design principles for creating web sites. New Haven and London: Yale University Press.

Nielsen, Jakob. (2008). Four bad web designs: Jakob Nielsen’s alertbox. Retrieved October 30, 2008, from http://www.useit.com/alertbox/bad-design.html

Sitepoint. (2008) Retrieved October 30, 2008, from http://www.sitepoint.com/

Sun Microsystems (2008). Writing for the web: Writing to be read. Retrieved October 30, 2008, from http://www.sun.com/980713/webwriting/wftw5.html

References:11


5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design.

Documents

Transcript of 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design.