Web Semantics is a topic I love, right besides Accessibility and Standards(Yes I am one of
those developers!). The following is a tutorial I wrote a few weeks back combined with a few bits and pieces from my knowledge bank.
When building a website it is sometimes all too easy to forget that the main thing you are doing is marking up text, many developers use heading and paragraph tags but with the rise of CSS many developers forget about the semantic elements of markup.
Semantic tags are used to markup text that has a meaning other than its content. For example, if I enclose text in the <code> tag it demonstrates that that text is a example of source code for a computer program.
This not only has an effect on the display of the text, it also informs
search spiders and
user agents that the piece of text you have marked up contains computer code, this means that they could perform other actions on it e.g. place it in a special index for programmers or inform the user that the site contains code snippets, this could be a useful feature if the browser was built into an
IDE.
Here is a list of inline semantic tags that may be useful to you when marking up documents in the future:
- cite - Demarcate a source citation
- code - Demarcate a code snippet
- dfn - Indicate a term is defined in the current location
- em - Demarcate that text should be emphasised
- kbd - Indicate keyboard input
- samp - Indicate that the contents reflect sample output, as from software
- strong - Indicate that text should have a strong emphasis
- sub - Indicate text should be rendered as subscript
- sup - Indicate text should be rendered as superscript
- var - Demarcate text as a variable name
I hope the above list will help you see how you can use markup to convey not only the text but also its meaning.
Microformats are also a a neat little semantic tool, I won't go into the depths of them in this article but check out
microformats.org for more information. Even something as simple as including a
rel attribute in you anchor tags can help increase the meanin of your information.
XML when used with other technolgies can be awesome, because of its custom nature data can be converyed excellantly. I am currently working on an XML graphing lanuage which outputs graphs in SVG format. The results so far have been brilliant and I will share them with you once It gets to a further development stage(at the moment I only have bar graphs)
Thank you all for reading. If you have any questions or further ideas on the subject please let me know.
Jamie
