The collapse of Twitter last year got me thinking about closed platforms and
reducing the hold that privately owned platforms have over the Internet.
I’ve been blogging for nine years now on my personal website. I like owning my
own domain as it allows me to retain control and stay independent of particular
services. Private platforms have a tendency to be bought out and/or ruined by
commercial interests, especially now with tech growth slowing down and investors
getting uneasy.
However, there are some benefits to closed blogging platforms. Medium provides a
network effect that small blogs don’t have. It has an algorithm that promotes
posts that users may find interesting. This allows the blogs to organically gain
new readers. Additionally, Medium makes it super easy to like, comment, and
reply to a post, resulting in a platform that feels a lot more like a social
network than your standard cloud blogging service.
Last year, I started looking into ways independent blogs could communicate, just
like on Medium. I considered making my blog ActivityPub-compatible, as that
would allow users on Mastodon and the Fediverse to like, share, and comment on
articles. And then, I stumbled upon the IndieWeb.
Table of contents
What is IndieWeb?
IndieWeb.org describes the IndieWeb as:
The IndieWeb is a community of independent & personal websites connected by simple standards, based on the principles of: owning your domain & using it as your primary identity, publishing on your own site (optionally syndicating elsewhere), and owning your data.
—
IndieWeb.org
To phrase it another way, IndieWeb is about posting the things you make on your
personal website and domain, to keep control of your data and stay independent
from private platforms (aka silos). You may still post to silos but you should
post to your personal website first.
IndieWeb isn’t just about blogging. You might post Twitter-like microposts,
photos, location check-ins, reviews, replies to other sites, and more.
POSSE and Backfeeding
An important concept is “Publish on your Own Site; Syndicate
Elsewhere” (POSSE). This means that you should
post the original version on your own website and then share links or copies of
your content with relevant social media communities. This is simpler and more
flexible than adding ActivityPub support to my blog, and is so obvious that I’ve
already been doing it without realising it.
You may be thinking that POSSE is pretty obvious and a bit of a cop-out. But
where POSSE truly shines is when combined with backfeeding. A Backfeed is a
list of replies, likes, and mentions for the current page. Combined with POSSE,
this allows you to see replies to the current page across all different private
silos. For example, you might see comments from Mastodon and Reddit at the
bottom of a blog post, as well as replies from other IndieWeb websites.
Together, POSSE and backfeeding strike a good compromise between owning your
own presence and participating in silos. They improve discoverability and allow
for reader interaction.
Webmentions
The IndieWeb community has authored several standards that allow IndieWeb
websites to communicate.
Webmentions allow websites to be notified
when another site links to them. By receiving a notification, a site can know
about replies and mentions without having to maintain impractical web crawlers
or subscribe to a backlinking service.
Receiving Webmentions
I started by
implementing support for
receiving Webmentions. This was super easy, I just needed to add a couple of
link tags to the top of all pages:
<link rel="webmention" href="https://webmention.io/example.com/webmention">
<link rel="pingback" href="https://webmention.io/example.com/xmlrpc">
WebMention.io is a cloud service for receiving
Webmentions. You might think it’s odd to use a cloud service for this, but it’s
not a problem as I’m still using my own domain for the pages and could switch
the Webmentions service at any time. IndieWeb isn’t about self-hosting, it’s
about owning your identity and data.
Sending Webmentions
I currently send Webmentions manually using
Telegraph or IndieWebify.
My blog is statically hosted and is built using GitLab CI. As the site is only
published when CI finishes, it would be impossible to include sending web
mentions as part of the same CI pipeline. In the future, I’ll probably look into
using Brid.gy or some other tool to send Webmentions by monitoring my web feeds.
Microformats2
Personal websites can contain a variety of content. Long-form articles,
Twitter-like notes, location check-ins, reviews, and replies.
Microformats2 is a way of marking up the content of
web pages so that machines can understand it better. This is a powerful thing
when combined with Webmentions as it allows the receiving website to understand
what is linking to it and why.
Microformats2 works by adding classes to elements representing content:
<article class="h-entry">
<h2 class="p-name">Hello world!</h2>
<a href="/tags/a-tag/" class="p-category">
A tag
</a>
<div class="e-content">
This is the article's content.
</div>
</article>
Implementing support for Microformats2 (mf2) was a
huge pain, I cannot overstate how much so. The documentation was very fragmented
and inconsistent, and the tools I found to test mf2 didn’t match the
documentation.
The most extreme problem I had was with
authorship - authorship is how you find out
who is the author of a piece of content. The documentation says that you should
be able to just include a link to the homepage in each piece of content, and
tools should fetch the author info:
<article class="h-entry">
<div class="e-content">This is an example note</div>
<a href="https://rubenwardy.com" class="u-author"></a>
</article>
However, this did not work at all. Most of the tools I found didn’t make further
requests and only looked at the current page. This makes sense I guess, but it’s
annoying that the documentation said it was possible.
The next thing I looked at was including the authorship information in the
footer of each page, and then referencing it from each piece of content like so:
<article class="h-entry">
<div class="e-content">This is an example note</div>
<a href="/" class="u-author"></a>
</article>
<footer>
<a href="/" class="h-card">
<img class="u-photo" src="/me.jpg">
<span class="p-name">Author Name</span>
</a>
</footer>
Unfortunately, this didn’t work with any of the tools either. The only thing I
found that worked was to include the authorship information in full in every
single piece of content.
<article class="h-entry">
<div class="e-content">This is an example note</div>
<div class="p-author h-card d-none">
<a class="u-url p-name" href="https://rubenwardy.com/">rubenwardy</a>
<img class="u-photo" src="/me.jpg">
</div>
</article>
Thank you to users on the IndieWeb IRC channels for pointing towards useful
tools and documentation, and asking my newbie questions. Without them, I
wouldn’t have been able to implement support at all. I believe that they have
improved the documentation a bit based on my feedback, although the authorship
page still mentions the methods I tried that didn’t work.
The three main tools I used for testing Microformats2 were
IndieWebify, pin13.net mf2,
Waterpigs mf2.
Backfeeding
A Backfeed is a list of replies, likes, and mentions for the current page. For
example, you might see comments from Mastodon and Reddit at the bottom of a blog
post, as well as replies from other IndieWeb websites.
Backfeeding likes
My blog shows likes from Mastodon and other social platforms using
Brid.gy and Webmentions. When I post a link to my blog on
social media, Brid.gy monitors activity and sends Webmentions. JavaScript on my
blog fetches Webmentions and updates the counter. My blog also caches like
counts at build time. In the future, I’ll make it so that the JS only fetches
activity since the blog was last built, reducing the amount of work the Web
Mentions API needs to do.
Backfeeding replies
I decided not to implement the backfeeding of comments from social media as I’m
concerned about the privacy implications. Just because someone decides to reply
publicly on social media silos doesn’t mean that they want their post and their
profile picture to appear on my website. Additionally, Webmentions can’t be
deleted meaning that the comment may continue to appear on my website even after
the author deletes it on the silo.
Two good articles discussing the ethics and privacy challenges of backfeeding
include
“The ethics of syndicating comments using WebMentions”
and
“The IndieWeb privacy challenge”.
I may reconsider this in the future. I’d need to make it sufficiently clear to
commenters and allow them to opt-out. I’d also need to make sure that deleting
the comment on the silo also deletes it from my website.
Comment form
I added a comment form to the bottom of posts on my blog. My blog is statically
hosted. To collect comments, I have a service running on another subdomain that
collects any comments and sends them to me. Users can also choose to send
comments by email or another method. All comments are moderated before showing
on my blog.
To avoid spam, the comment form has a “username” form hidden using CSS. Most
spam bots don’t bother applying the CSS so will see the field and fill it in.
This is called a honeypot field and is surprisingly effective - I was receiving
multiple spam comments a day, but since adding the field I’ve only received a
single spam comment.
<style>
input[name="username"] {
display: none;
}
</style>
<input type="text" name="username">
You can find
the source code behind commenting on GitLab.
Thoughts on the IndieWeb
IndieWeb standards are fairly obscure and don’t seem to have been adopted much
yet. Of all the posts I’ve made since adding IndieWeb support, this is probably
the only one that will actually find websites linked to that can receive
Webmentions. If a popular Content Management System, like WordPress, added
built-in support for Webmentions and mf2, I could see it suddenly becoming a lot
more popular.
Whilst Webmentions are pretty cool, Microformats2 is pretty complicated and was
pretty annoying to implement. I know that the IndieWeb crowd will have strong
opinions on this, but I quite like how simple JSON-LD
was to add support for and that it’s JSON.
As for the community side of IndieWeb, personal websites have seen a big
resurgence since the fall of Twitter. I think we’re in a new golden age for RSS
and personal websites. I’ve been encouraging a lot of my friends to take up
blogging.
Conclusion
I’m certainly a more technical user than the average blogger. I don’t mind being
an early adopter of technology and appreciate the goals of IndieWeb. I like how
they try to focus on the people before the technology, even though Microformats2
leaves much to be desired.
I currently only post blog posts on my website. I don’t plan to post notes on my
website as I prefer to use Mastodon directly. But I might start posting my
photography here.
I’m undecided as to whether I’ll stick with IndieWeb technology in the long
term, but I’ll certainly continue to own and publish on my own domain.
Ryan Barrett 
Aaron Parecki 
rubenwardy 
Tantek Çelik 
James' Coffee Blog 
Geralt_of_Razhia 
fielddecorator