Web User Experience is primarily achived through the delivery of HTML to Browsers. HTML provides a structured framework within which it is possible to create a rich, dynamic customer experience. Along with ‘static’ content such as News articles, sports reports etc. it is possible to provide ‘services’ which are in effect highly personalised, dynamic content such as email, IM etc.
But to the browser, these are just HTML delivered over HTTP. The only thing that might differentiate is that the HTTP headers may indicatate a shorter time to live, or that the content should not be cached at all.
Recently Industry best practice has evolved HTML to align with the more tightly specified XML. Migrating to HTML 4.01, through XHTML 1.0 to XHTML 1.1 many of the inconsistencies and ambiguities in the language have been removed and it is now possible to leverage XML technologies such as XSL transformation engines, modular schema definitions and verifying parsers.
Formalising HTML creates a cleaner object model within the browser, known as the Browser Object Model – BOM. This is a true object model and contains data, style and behaviour. There are industry standards over how to deal with badly formed HTML, it depends upon the browser implementation.
Cascading Style Sheets (CSS) provide a rule-based approach to appearance. CSS features a syntax that uses selectors to apply presentational style to HTML structure. CSS styles are applied in a layer manner so that there is generally always a fallback to the most generic case, whilst specialised styles can be applied in an increasingly targeted manner to apply more specialised styles as required by the UI designer.
XHTML supports the addition of the generic attributes ‘class’ and ‘id’ which can take arbitrary string values that add additional semantics to whatever HTML base tag they are applied. The rules for these attributes are simple: the id attribute provides a unique identifier to a tag within a given scope, whilst the class attribute is used to group several similar tags into a set. Using these attributes with CSS selectors allows much finer control over presentational style.
Microformats are predefined patterns of HTML tags and class attributes that provide additional semantics to structure and facilitate machine based interpretation of content allowing richer interaction and improved accessibility through complementary browser extensions.
XHTML provides structure, content and semantics; CSS provides presentation. The Browser uses these to construct an implementation specific object model and provides the default behaviour for user interaction. Through careful observance of standards XHTML and CSS are sufficient to provide a rich user experience.