Canonical HTML Template
Enterprise Web Standards for HTML
- HTML and CSS should validate with no errors or warnings.
- Pages should not produce errors or warnings when validated with the Firefox Accessibility extension.
- In HTML that is part of a reusable template, every element should have an ID.
- Do not use inline
styleor event handler attributes (
onmouseover, onblur, etc).
- In hyperlinks, do not use
#as a value for
- Every link should have a meaningful
- Tables should only be used to display tabular data. Do not use tables for layout.
- Use camel case for names (classes, IDs, variables, etc).
- Every div (and other tags that encompass large blocks) should be commented so as to identify both the beginning and ending tags.
- Only use CSS hacks that target the current or an older version of a browser.
- Use unicode character entities such as ®, ©, —, and ™.
- Use semantic tagging (
address, abbrev, acronym) where appropriate.
- Use microformats where applicable.
- The CSS stylesheet should be referenced with a LINK tag rather than @import.
MarkUp Wish List
If possible, CSS sprites should be used, instead of multiple image assets. That would imply that the template will only reference 1 image.
Though generating valid, semantically correct code can be time-consuming, doing so makes the UI more flexible and accessible to a wider audience. We don't expect developers to have all the answers. Don't hesitate to ask questions and, most importantly, don't forget to have fun!