HTML Standards

  • Most Pages (currently) use the XHTML strict Doctype tag. Please make sure that the HTML conforms to this DTD as best as possible. see for further information on what is defined within this standard for individual elements. This should remain the same for the (future) implementation of HTML5 that should remain (backwardly) XHTML compliant in that it should take the good bits of XHTML (for example that pages should remain XML compliant) and ignore the bad bits of the original spec (the inclusion within HTML5 of extra useful attributes and tags).
  • Make correct use of semantic HTML where possible, i.e. use HTML for its proper purpose. So use a <p> tag for a paragraph; use a <ul> <li> for list of items; a table for tabular data. Use <strong>, <em>, <span> for targeting in-line data etc.… If unsure ask Angus or Greg.
  • Also where possible we need to implement HTML mark up which conforms to the design pattern defined at (this would normally relate to the display of meta data such as dates, reviews and anchor links…).
  • With the introduction of HTML5 we should look to conform more closely to the WAI-ARIA accessibility mark-up guidelines for our template layout as much as possible (many clients expect our sites to conform to these standards). Although admittedly many of their markup suggestions are not strictly XHTML complaint. However in my view they are useful exceptions to the previous rules.
  • Always include a class on block level elements. The class should be a name that reflects the markup’s purpose / containing information (if no microformat or ARIA guidline is defined). It should not indicate how it is to be styled (as this may and often does change). For example “big_blue_button” is bad; “submit-form-button” is good. Admittedly we do have some legacy issues in this respect to supporting classes that describe, more than reflect, the purpose for which they are required.
  • Re-use of the same class should be done, as appropriate. But this should be done in as consistent a way as possible. I know this is more difficult than it sounds!
  • Avoid overuse of id attributes in the markup. They must be unique (per page) and overuse may result in duplications and then problems with DOM scripting and validation will occur.
  • Include a containing <div> with a class (around logical related sections / blocks) that may well need to be uniquely styled or to be targeted by DOM scripting. This should be included on most JSPs within Pub2web in my view.
  • Always htmlEncode character entities within the HTML and URLEncode URL values.

Leave a Comment

Your email address will not be published.