This is Google's cache of http://terrymorris.net/bestpractices/. It is a snapshot of the page as it appeared on 4 Apr 2018 03:53:54 GMT.

The current page could have changed in the meantime. Learn more

Full version Text-only version View source Tip: To quickly find your search term on this page, press Ctrl+F or ⌘-F (Mac) and use the find bar.

Skip to Content

Terry Ann Morris, Ed.D.

Web Design & Instructional Technology
home books news background resources photos

Web Development &

Web Design Best Practices Checklist Design Foundations
Background Information
URL:
Target Audience:
Purpose:

Page Layout

❏ Appealing to target audience

❏ Consistent site header/logo The 8th edition of this popular
❏ Consistent navigation area textbook introduces HTML5,
CSS3, and responsive web
❏ Informative page title that includes the company/organization/site name design.
❏ Page footer area includes copyright, last update, contact e-mail address More Info on Web
❏ Good use of basic design principles: repetition, contrast, proximity, and alignment Development & Design
❏ Displays without horizontal scrolling at 1024×768 and higher resolutions Foundations
❏ Balance of text/graphics/white space on page
❏ Good contrast between text and background Basics of Web Design,
❏ Header and nav occupy less than ¼ to ⅓ of the browser at 1024×768 resolution 3rd Edition
❏ Home page has compelling, interesting information above the fold at 1024×768
❏ Home page downloads within ten seconds on dial-up connection 3rd Edition
❏ Viewport meta tag is used to enhance display on smartphones Book Cover
❏ Media queries configure responsive page layout for smartphone and tablet display
The third edition of the popular
Browser Compatibility textbook features HTML5 and
CSS3 organized into two-page
❏ Displays on popular/current versions of Internet Explorer topic spreads.
More Info on Basics of Web
❏ Displays on popular/current versions of Microsoft Edge
Design, 3rd Edition
❏ Displays on current versions of Firefox
❏ Displays on current versions of Google Chrome
❏ Displays on current versions of Opera
❏ Displays on current versions of Safari (both Mac and Windows)
❏ Displays on popular mobile devices (including tablets and smartphones)

Navigation

❏ Main navigation links are clearly and consistently labeled

❏ Navigation is easy to use for target audience
❏ If main navigation uses images, clear text links are in the footer section of the page
❏ If main navigation uses Flash, clear text links are in the footer section of the page
❏ Navigation is structured in an unordered list
❏ Navigation aids, such as site map, skip navigation link, or breadcrumbs are used
❏ All navigation hyperlinks "work" — are not broken

Color and Graphics

❏ Color scheme is limited to a maximum of three or four colors plus neutrals

❏ Color is used consistently
❏ Text color has sufficient contrast with background color
❏ Color is not used alone to convey meaning
❏ Use of color and graphics enhances rather than distracts from the site
❏ Graphics are optimized and do not significantly slow download
❏ Each graphic used serves a clear purpose
❏ Image tags use the alt attribute to configure an alternate text description
❏ Animated images do not distract from the site and do not endlessly repeat

Multimedia

❏ Each audio/video/Flash file used serves a clear purpose

❏ The audio/video/Flash files used enhance rather than distract from the site
❏ Captions are provided for each audio or video file used
 ❏ Download times for audio or video files are indicated
❏ Links to downloads for media plug-ins are provided

Content Presentation

❏ Common fonts such as Arial or Times New Roman are used

❏ No more than one web font is used
❏ Techniques of writing for the Web are used: headings, bullet points, brief paragraphs
❏ Fonts, font sizes, and font colors are consistently used
❏ Content provides meaningful, useful information
❏ Content is organized in a consistent manner
❏ Information is easy to find (minimal clicks)
❏ Timeliness: The date of the last revision and/or copyright date is accurate
❏ Content does not include outdated material
❏ Content is free of typographical and grammatical errors
❏ Content provides links to other useful sites
❏ Avoids the use of "Click here" when writing text for hyperlinks
❏ Hyperlinks use a consistent set of colors to indicate visited/nonvisited status
❏ If graphics are used to convey meaning, the alternate text equivalent is provided
❏ If media is used to convey meaning, the alternate text equivalent is provided

Functionality

❏ All internal hyperlinks work

❏ All external hyperlinks work
❏ All forms function as expected
❏ No JavaScript errors are generated

Accessibility

❏ If main navigation uses images, text links are in the footer section of the page
❏ If main navigation uses Flash, text links are in the footer section of the page
❏ Navigation is structured in an unordered list
❏ Navigation aids, such as site map, skip navigation link, or breadcrumbs are used
❏ Color is not used alone to convey meaning
❏ Text color has sufficient contrast with background color
❏ Image elements use the alt attribute to configure an alternate text description
❏ If graphics are used to convey meaning, the alternate text equivalent is provided
❏ If media is used to convey meaning, the alternate text equivalent is provided
❏ Captions are provided for each audio or video file used
❏ Use attributes designed to improve accessibility such as title when appropriate
❏ Use the id and headers attributes to improve the accessibility of table data
❏ Configure frames with frame titles and place meaningful content in the noframes area
❏ The html element's lang attribute indicates the spoken language of the page
❏ The role attribute indicates ARIA landmark roles

Last Updated: October 31, 2016

Copyright © 1998-2016 Terry Ann Morris, Ed.D.
Contact: [email protected]