i’ve heard about h-cards from some personal sites i’ve looked at, but all the resources i’ve found for them are code snippets - they don’t tell you really what it is, what they’re used for, why to include them on your website, where to put them, and how to go about doing so. are there good articles out there that explain them in detail?
I believe they’re for communicating contact information, sort of like vCards.
1 Like
This page explains it a bit better, but basically, using the class names on each element (h-card, p-name, etc) scripts and tools can extract information about the author or organisation just by having the elements on the page with the right classes. E.G., an rss feed reader can show an author photo next to the article link, or a site like reddit could use the author image as a post thumbnail.
I guess the advantage for this way of doing it, as opposed to other kinds of microdata (JSONLD, etc) is that it caters to humans and robots at the same time, whereas JSONLD is just for robots and isn’t visible on-page. That’s kind of the disadvantage of it as well, in my opinion; I’m not a fan of using element classes for data.
4 Likes
OpenGraph is probably the metadata that matters in most places for link previews.
Google supports various kinds of “structured data”
Adopting structured data and semantic web approaches to help the likes of Google may be harmful in the long run.
1 Like