Web Standards Checklist to Make a Proper Website Part I
The term web standards can mean different things to different people. For some, it is 'table-free sites', for others it is 'using valid code'. However, web standards are much broader than that. A site built to web standards should adhere to standards (HTML, XHTML, XML, CSS, XSLT, DOM, MathML, SVG etc) and pursue best practices (valid code, accessible code, semantically correct code, user-friendly URLs etc).
In other words, a site built to web standards should ideally be lean, clean, CSS-based, accessible, usable and search engine friendly.
About the checklist :: This is not an uber-checklist. There are probably many items that could be added. More importantly, it should not be seen as a list of items that must be addressed on every site that you develop. It is simply a guide that can be used ::
- to show the breadth of web standards
- as a handy tool for developers during the production phase of websites
- as an aid for developers who are interested in moving towards web standards
The checklist ::
- Quality of code ::
- Does the site use a correct Doctype?
- Does the site use a Character set?
- Does the site use Valid (X)HTML?
- Does the site use Valid CSS?
- Does the site use any CSS hacks?
- Does the site use unnecessary classes or ids?
- Is the code well structured?
- Does the site have any broken links?
- How does the site perform in terms of speed/page size?
- Does the site have JavaScript errors?
- Degree of separation between content and presentation ::
- Does the site use CSS for all presentation aspects (fonts, color, padding, borders etc)?
- Are all decorative images in the CSS, or do they appear in the (X)HTML?
- Accessibility for users ::
- Are "alt" attributes used for all descriptive images?
- Does the site use relative units rather than absolute units for text size?
- Do any aspects of the layout break if font size is increased?
- Does the site use visible skip menus?
- Does the site use accessible forms?
- Does the site use accessible tables?
- Is there sufficient color brightness/contrasts?
- Is color alone used for critical information?
- Is there delayed responsiveness for dropdown menus (for users with reduced motor skills)?
- Are all links descriptive (for blind users)?
- Accessibility for devices ::
- 1. Does the site work acceptably across modern and older browsers?
- Is the content accessible with CSS switched off or not supported?
- Is the content accessible with images switched off or not supported?
- Does the site work in text browsers such as Lynx?
- Does the site work well when printed?
- Does the site work well in Hand Held devices?
- Does the site include detailed metadata?
- Does the site work well in a range of browser window sizes?
- Basic Usability ::
- Is there a clear visual hierarchy?
- Are heading levels easy to distinguish?
- Does the site have easy to understand navigation?
- Does the site use consistent navigation?
- Are links underlined?
- Does the site use consistent and appropriate language?
- Do you have a sitemap page and contact page? Are they easy to find?
- For large sites, is there a search tool?
- Is there a link to the home page on every page in the site?
- Are visited links clearly defined with a unique color?
- Site management ::
- Does the site have a meaningful and helpful 404 error page that works from any depth in the site?
- Does the site use friendly URLs?
- Do your URLs work without "www"?
- Does the site have a favicon?
Be The First One To Comment