Visual Semantics in HTML and CSS
Saturday, June 12th, 2010Each layer in the web stack has its own architecture. You wouldn’t expect the DB schema to be used to architect the PHP middleware, and yet people expect that of the HTML and CSS. HTML needs to be written with a sense of the meaning of the data or content, something I call code semantics. Code semantics are incredibly important in the HTML for both portability and accessibility. On the other hand, CSS really is a separate layer in the stack, and it needs its own architecture that reflects the visual semantics of the page.
Visual semantics describe all the repeating patterns in the design of the page. They represent the fundamental building blocks of your website. In fact, they are often portable across sites with only minor modifications. Visual semantics shouldn’t necessarily be tied to HTML semantics, because you want an architecture that fits the unique requirements of each layer of the stack…
