View
222
Download
2
Category
Tags:
Preview:
Citation preview
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
© www.melanieevemiller.com
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
© www.melanieevemiller.com
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
© www.melanieevemiller.com
Element 3: Write for the Web
Most of your online audience will scan content rather than reading it.
6
© www.melanieevemiller.com
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
© www.melanieevemiller.com
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
© www.melanieevemiller.com
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
© www.melanieevemiller.com
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
© www.melanieevemiller.com
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
© www.melanieevemiller.com
Recommended