Home arrow Services arrow News arrow Mambo arrow Semantic Ideas

Semantic Ideas

Published on Sunday, 10 July 2005
Creating a readable document on the web requires skill and precision. Creating a document that matches the intent of the publisher should mean that when a search engine browses the website and finds the relevant article, that article is able to be searched and archived correctly. This is why semantically correct and well-formed code matter.
Merely having article titles as  h1 and h2 elements for content does not allow a definitive site structure as they do not reflect a semantic, 'webified' document, especially when the document is linearized. This may also influence accessibility considerations as a definitive site structure may not be built if all content and article titles remain major headings inside the web structure.
Here is the methodology I recommend:
  •   h1  should be used for the site name.
  •   h2  for branding / alias / related titling
  •   h3 is the Mambo standard for module headings, and since 'content' is by design, a component, modules and components of any nature should have the same heading format.
  •   h4 to should be used inside components, modules and content as sub-headings on various levels.

Furthermore, the methodology I am using for Orange (currently) is that the heading will not need to be styled independently. People should not need to rewrite the methodology to get a semantic header structure.

Through this, the style sheet defines a global h3 tag. Mambo default CSS calls of .contentheading and .componentheading can then be used by a designer to style the content and components independently (if they wish) to the global tag due to CSS being a cascading architecture.

This minimises markup and allows the CMS to deliver greater flexibility in a simpler format. It also makes allowance for pre-existing templates that already define .contentheading and .componentheading independent of a  h1  or h2 element. It means that those templates, irrespective of when they were released in comparison to the semantic extensions to Mambo, recieve the benefit of semantic structure without having to needlessly redeclare styles.

Furthermore, by having h3 element as the standard Mambo class for all headings, irrespective of component, content or module, that leaves the h1 and h2 elements to be styled independently by a designer to end up with the effects seen in websites like the CSS Zen Garden.
blog comments powered by Disqus
 

“Interactive design is a seamless blend of graphic arts, technology, and psychology.”

 :: 

Welcome to Absalom Media

Delivering web accessible websites

Absalom Media seeks to deliver industry best practice website usability and design for your budget.

As we are upgrading systems, login has been disabled.

Account management

As we are upgrading systems, account management has been temporarily disabled

What are you looking for?

Connect

Join us on Facebook

Follow us on Twitter

Talk to us on Skype

Generated in 0.38362 Seconds