1/12

2/12 Who is this Lawrence guy? Why am I here? Why is effective web design important? :: See whySee why We will discuss: General Suggestions User Considerations Site Architecture Layout/Design of Page Web Accessibility Cascading Style Sheets The Good, The Bad and The Ugly

3/12 Attractive site Quick Loads Six seconds to make impact Functionality Keep site updated Consistent look and feel to sites :: Get to the point – clear and concise content Give the user a reason to revisit the site, keep content fresh Provide contact information Proofread, proofread, proofread Test, test, test

4/12 Screen resolution Connection speed Computer platform Browser type/version Site’s audience Purpose of site

5/12 Simple urls :: Use folders to organize site. Put images in one folder. File naming structure - lowercase and no spaces – may use dash or underscore

6/12 Avoid gratuitous use of bleeding edge technology Consider plug-ins/software required to view site

7/12 Font, size Meta tags/search engines :: Web-safe color palette (256 colors) :: Intuitive links Do you need a splash page? :: Wolfpack TowersWolfpack Towers Treat top of page like beachfront property. Most important information should be at top of page. Avoid use of tables for layout of page – only for data Scroll up and down rather than left to right Keep navigation links in same location Browser title ::

8/12 Avoid frames Name and logo with link on every page Structure page to facilitate scanning Avoid counters, scrolling text, excessive animated gifs and under construction signs. Proportional images :: ExampleExample Avoid large graphics that are slow to load :: ExampleExample Avoid text that is too large, too small Avoid dark text on dark backgrounds/colors Avoid use of embedded sounds

9/12 Agencies that receive funds from the federal government are required to create accessible web sites for persons with disabilities. W3C’s Web Content Accessibility Guidelines (WCAG) 2.0 and Section 508 Standards :: WCAG 2.0 :: 2.0www.section508.gov Use alt tags Provide table summaries Create text-only version Some users navigate without mouse Use screenreaders such as Jaws to test site Color blindness Bobby approved :: :: bobby.watchfire.comwww.uncp.edu/test/dss/bobby.watchfire.com

10/12 Advantages – smaller file size, cleaner code, control layout of page, faster load Disadvantages – not supported by older generations of browsers html – structure CSS – markup Pages designed using CSS can be easily changed by adjusting one file

11/12 UNC Pembroke :: University and Community Relations :: coolhomepages.com :: Entertainment sites :: Lehigh University :: NC State University Athletics :: University of Virginia :: USA Today :: webpagesthatsuck.com :: University of Idaho Children’s Center ::