1. So You Want a Web Page!

2. What is a Web Page? According to Webopedia, a web page is: A document on the World Wide Web. A Web site is really a bunch of Web pages linked together by clickable hyperlinks.

3. Web Design Examples http://users.nac.net/falken/annoying/m ain.htmlhttp://users.nac.net/falken/annoying/m ain.html http://www.un.org/events/workshop/dpi -unitar/2003/dreamweaver/bad- design.htmhttp://www.un.org/events/workshop/dpi -unitar/2003/dreamweaver/bad- design.htm

4. Web Design Features General Design Backgrounds Text Navigation Links Graphics Blinking and animations Junk

5. Bad Web Design Examples http://valweb.org/ http://www.scopesys.com/ http://www.augsburg.edu/index.html http://www.mewspage.pwp.blueyonder.co.uk/http://www.mewspage.pwp.blueyonder.co.uk/ http://www.oc.ca.gov/

6. Good Web Design Examples http://americanhistory.si.edu/westpoint/ index.htmlhttp://americanhistory.si.edu/westpoint/ index.html http://www.apple.com/ http://musicstem.com/ http://www.immuexa.com/

7. Elements of Effective Web Design Simplicity Consistency Identity Content User-friendly navigation Visual Appeal Compatibility

8. Top 10 Do's and Don'ts 1.Keep graphics files small 2.Keep text files small 3.Design for easy reading 4.Design for all screen resolutions 5.Use "ALT" Tags On Graphics 6.Include contact information on every page 7.Keep your site fresh 8.Use small pages 9.Be backward compatible 10.Test your site as visitors will see it

9. Plan Your Website There are 3 critical phases in the design process ›Information design ›Site design ›Page design

10. Information Design Goals Audience Objectives Interactivity Tools Inventory Organization Planning

11. Assignment Identify the purpose and audience for your website.

12. Site Design Organization Navigation Interaction/Functionality Overall Usability/Accessibility

13. Organization

14. Navigation Navigation bars Place-finding tools Breadcrumbs Site maps

15. Interactivity/Functionality When planning for a site's functionality, ask yourself which of the following the site will require: ›Search features ›Forms for submitting information ›Streaming media capabilities

16. Usability/Accessibility Usability refers to how easy a site is to use and how well it functions. http://www.useit.com/alertbox/9605.html http://www.useit.com/alertbox/9605.html Accessibility refers to the practice of making pages on the Internet accessible to all users, especially those with disabilities. http://webaim.org/intro/

17. Assignment List the major sections and subsections for your website

18. Page Design Create some thumbnail sketches of the pages in the site. Create detailed page mock-ups or rough sketches of the pages in the site. Create a web-based prototype

19. Layout Guidelines Alignment Visual Hierarchy Balance Repetition/Consistency Proximity Contrast

20. Resources http://irt.austincc.edu/webdev/ Accessibility ›http://www.accessify.com/tools-and-wizards/ ›http://webaim.org/intro/ ›http://www.w3.org/WAI/ Colors on the Web ›http://www.colorsontheweb.com/ ›http://wellstyled.com/tools/colorscheme2/index-en.html ›http://www.colorschemer.com/online.html ›http://colorblender.com/ Interactivity ›http://www.dynamicdrive.com/ ›http://www.hotscripts.com/ ›http://javascriptkit.com/cutpastejava.shtml Graphics ›http://www.sxc.hu/home ›http://istockphoto.com/index.php Other Useful Links ›http://www.alvit.de/handbook/ - Web Developer's Handbook ›http://www.tonyyoo.com/protolize/ ›http://www.alistapart.com/ - A List Apart: For People who Make Websites