demosthenes.info

I’m Dudley Storey, the author of Pro CSS3 Animation. This is my blog, where I talk about web design and development with , and . To receive more information, including news, updates, and tips, you should follow me on Twitter or add me on Google+.

web developer guide

my books

Book cover of Pro CSS3 AnimationPro CSS3 Animation, Apress, 2013

my projects

CSSslidy: an auto-generated #RWD image slider. 3.8K of JS, no JQuery. Drop in images, add a line of CSS. Done.

tipster.ioAutomatically provides local tipping customs and percentages for services anywhere.

Microdata: Metadata For Content

seo / microdata

Estimated reading time: 1 minute, 51 seconds

In most tags are semantic: that is, they carry meaning. This structure of semantic tags is embraced and extended in HTML5 through elements like <time>.

Even with the dozens of new tags in HTML5, there is no way to provide meaning for every piece of content. This impoverishes the web: machine-readable tags that provide context make for a richer, more semantic internet, better and more accurate searches, and more powerful data aggregators. But short of an XML utopia, covering every possibility of meaning is a near-infinite task.

Instead, there are several measures that add to, or extend, the semantics of web pages:

  • Dublin Core meta tags, and their progenitors, attempt to summarize the context of the entire page, adding information such as authorship and revision date. However, they can only describe the page as a whole: as meta tags are written in the <head> section, it is impossible for such tags to drill down and specify the individual content of the page.

  • Microformats extend tags via special values for class and id attributes. Microformats have strong support by Google, Facebook and YouTube through schemas like hcard (to represent people, companies, organizations, and places), calendar (for events), recipe, and XFN (to diagram relationships between people).

  • RDFa is another means of providing context to tags via values added to del and class attributes, currently used to indicate Creative Commons licenses, amongst other purposes.

  • To this, HTML5 adds microdata, a way of extending the meaning of tags through a shared vocabulary. Unlike meta tags, microdata is written in the body of an HTML document; unlike microformats and RDFa, it does not abuse class or del, instead using new attributes that are built into HTML5 such as itemscope and item type, with established, central schemas such as schema.org and data-vocabulary.org. Google and Microsoft are both supporters of microdata, with more adopters being added.

“Which system should I use?”

Which system you use depends on what you are trying to do:

Are you making an XHTML page?

In that case, use Dublin Core and microformats

Want to add a Creative Commons license?

Use RDFa

Making an HTML5 page?

Use microdata, adding meta tags and RDFa as they are supported with namespaces.

comments powered by Disqus

This site helps millions of visitors while remaining ad-free. For less than the price of a cup of coffee, you can help pay for bandwidth and server costs while encouraging further articles.