Over a million developers have joined DZone.

Good example of practical microdata

DZone's Guide to

Good example of practical microdata

· Web Dev Zone ·
Free Resource

Jumpstart your Angular applications with Indigo.Design, a unified platform for visual design, UX prototyping, code generation, and app development.

Microdata (Wikipedia ref) is one of those HTML5 things that I've been meaning to take a closer look at for some time. At a very high level, you can think of microdata as a way of embedding context into your HTML to provide information to search engine crawlers and browsers. It isn't meant for the human eye, but can help out automated agents viewing your site.

I ran into a great example of this today: Creating a semantic breadcrumb using HTML5 microdata

In this article, Euan Torano describes how he used microdata to provide context to Google. You can see in his screen shot that the microdata was visible in the Google Search Results. Not only that, the same HTML used to provide that microdata could be used as nice breadcrumbs in general.

Want to learn more? Check out Schema.org and their simple to follow Getting Started guide.

I'd love to know if any of my readers are making use of this yet.

Take a look at an Indigo.Design sample application to learn more about how apps are created with design to code software.


Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}