5 5 essential web design elements a writers guide to website design
TRANSCRIPT
![Page 1: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/1.jpg)
55 ESSENTIAL WEB DESIGN ELEMENTS
A Writer’s Guide to Website Design
![Page 2: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/2.jpg)
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
![Page 3: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/3.jpg)
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
![Page 4: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/4.jpg)
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
![Page 5: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/5.jpg)
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
![Page 6: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/6.jpg)
Element 3: Write for the Web
Most of your online audience will scan content rather than reading it.
6
© www.melanieevemiller.com
![Page 7: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/7.jpg)
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
![Page 8: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/8.jpg)
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
![Page 9: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/9.jpg)
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
![Page 10: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/10.jpg)
5 Essential Web Design Elements
Consistent Brand Intuitive Navigation Write for the Web Search Function Engaging Content
10
© www.melanieevemiller.com
![Page 11: 5 5 ESSENTIAL WEB DESIGN ELEMENTS A Writers Guide to Website Design](https://reader035.vdocuments.net/reader035/viewer/2022062511/551408c3550346e7488b4c69/html5/thumbnails/11.jpg)
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