Publishing on the IndieWeb Level 2

1. Mark up your content with microformats2

Humans can already understand the things you post on your site. By adding a few short class names to your HTML, other people’s software can understand it and use it for things like reply contexts, cross-site comments, event RSVPs, and more.

Check your homepage h-card:

Almost there!

Multiple h-cards were found on your site! Consider only having one and marking it up as the representative h-card.

To identify the h-card that represents the page, you can:

  • Add class="u-url u-uid" on the h-card’s link to https://geheimesite.nl/
  • Or: add class="u-url" rel="me" on the h-card’s link to https://geheimesite.nl/

Here is the first h-card found:

Add a photo!

<img class="u-photo" src="…" />

Robin Boers.

URL

Add your URLs! <a rel="me" class="u-url">…</a>

Email

Got a brief bio like a Twitter/Instagram bio? Add it to your own h-card as a note property! <p class="p-note">…</p>

Given (often first) name

  • Robin

Family (often last) name

  • Boers

Nickname

  • axcelott

Email address

  • https://geheimesite.nl/contact

City/town/village

  • Maassluis

Country

  • Netherlands

Organization

  • Qdentity
  • Maakotheek

Job title

  • Full-stack developer
  • Sysadmin & lead developer

See the full list of h-card properties.

Want to be able to use h-card data in your code? Check out the open-source implementations.

Previous Step | Home | Next Step