Principles of Web Design

Keep it simple

Content is critical--Form is not.

Speed is “King”.

Consistent filenames are key.

Design efficiently.

Cite your sources.

K.I.S.S. Principle

Maintain simple, consistent page layout.

Keep backgrounds simple and high contrast to allow easy viewing of content.

Design the page so that user does not have to scroll from left to right to see the whole page

Content is Critical….

Users are completely uninterested in learning anything about how your site works. They came for content.

“Learn and think about your audience, then learn and think about computers, then think again about your audience.”

Use a simple template to design your webpage. You then have time for other things in your life.

Speed is King

You have 3 seconds to convince a user not to use the Back button.

More speed, less interactivity

Follow the less is more principle.

Consistent filenames are key.

Use all lowercase

No spaces

First page is named index.htm

All webpage files are stored in the same folder

All images are stored in a folder within the folder that stores the web files.

Design efficiently

Include images and animation that help communicate the content.Images should not exceed a total 100k per page. Do not include identification information with photographs. Use a large, commonly understood navigation scheme.Use meaningful terms for hyperlinks

Design tips continued

Use standard fonts

Colors should be “web safe” as much as possible.

Pages should be sized so they will display properly in a variety of screen resolutions.

Cite your sources

“Give credit where credit is due”

Have another coworker double check the webpage before publishing.

Web Design Resources

http://www.bagism.com/tablemaker/

http://werbach.com/barebones/

http://www.kn.pacbell.com/wired/beyond/

http://www.smplanet.com/webpage/webpage.html

http://libweb.uoregon.edu/it/webpub/

http://www.suelebeau.com/webdesigning.htm

Sources

http://www.hotwired.com/webmonkey/98/34/index1a_page2.html?tw=design

http://www.bham.wednet.edu/technology/webtenets.htm

http://k-12.pisd.edu/guide/schools/webpages/