search

LemmyNet / lemmy-ui

The official web app for lemmy.
https://join-lemmy.org/
GNU Affero General Public License v3.0
878 stars 334 forks source link

Add Microformats #32

Open zcdunn opened 5 years ago

zcdunn commented 5 years ago

microformats are extensions to HTML for marking up people, organizations, events, locations, blog posts, products, reviews, resumes, recipes etc. Sites use microformats to publish a standard API that is consumed and used by search engines, aggregators, and other tools.

--From the indieweb website

Microformats are simple HTML markup that describe the content. Marking up users, posts, and comments would allow interoperability with indieweb site/tools.

Within the fediverse, Plume, Prismo, and Mastodon all have support for microformats.

dessalines commented 5 years ago

Could you give an example of what these are / how they would be used here? What specific html items should get these tags, and what should they be?

zcdunn commented 5 years ago

Sure. Microformats are just class names applied to the HTML that describe the content. So if you have a user account, you would mark it up with an h-card class.

Here's a full example from the microformats site: `

<img class="u-photo" alt="photo of Mitchell" src="https://webfwd.org/content/about-experts/300.mitchellbaker/mentor_mbaker.jpg"/> <a class="p-name u-url" href="http://blog.lizardwrangler.com/"

Mitchell Baker (<a class="u-url" href="https://twitter.com/MitchellBaker" @MitchellBaker) Mozilla Foundation

Mitchell is responsible for setting the direction and scope of the Mozilla Foundation and its activities.

Strategy Leadership
`

You can see the parent container gets an h-cardclass, the element containing the user's avatar source url gets a u-photoclass, any element linking to a url representing the user gets a u-url class, and the element containing their name gets a p-name class.

Posts and comments work similarly but use an h-entry for their root class.

Restioson commented 5 years ago

Is this similar or dissimilar to opengraph tags?

zcdunn commented 5 years ago

I guess microformats are similar to opengraph, but the usecase is different. My understanding is that opengraph is mostly used for link previews, while microformats are used to provide a machine-parseable version of content. Clients that implement Microsub can subscribe to feeds marked up with microformats. So I could use Monocle, or any other conforming client, to subscribe to a Lemmy user/forum.

A webpage with an h-feed that contains a few h-entry's will be a human readable page and a machine readable feed, equivalent to having a webpage and an RSS/Atom feed.

Restioson commented 5 years ago

Ah, I see.