Webmentions is what makes it possible for me to write here about someone else’s blogpost and have my response show up beneath theirs. And vice versa. Earlier mechanisms such as pingback and trackback did the same thing, but slipped under the radar or succumbed to spam. Webmention is a W3C recommendation.
The webmention itself is simple
The core of webmention is straightforward: if I write something here, my webserver will try to let every site I link to in my text know I link to them. This by checking if the sites I link to have an ‘endpoint’, an antenna basically, for webmentions. If a site does, then it will send a simple message to that antenna stating two web addresses, the source (here my blogpost) and the target (here your blogpost). When your site receives a webmention it will do some checking: does my source blogpost indeed link to your target address?
What happens next is less simple
It can quickly get confusing during what happens next.
When my site receives a webmention (this source x links to your target y), all it knows is just the URL of a page that links to me. What my site displays and how it displays that as a consequence of a webmention message depends on multiple factors:
My server will try to read the source blogpost, and see what machine readable information it contains, and what it can know about the source blogpost. These machine readable parts are in the form of microformats.
My server will store some of the information it finds.
Then my website template will show some information from what the server stored when showing the target blogpost on my site.
How well that works depends on multiple factors therefore:
- The available machine readable info in the source blogpost, and whether that info is properly encoded
- The settings of my server for what it stores
- The settings of my site template for what it shows
When something seems to be going wrong, it could be a problem with your site, my site template or my server settings, and it is never obvious which one it is, or if it is the aggregation of multiple issues. It also depends on how easy it is to alter any settings whether you can repair or change things when webmentions are not properly dealt with. Supposedly the Webmention and Semantic Linkbacks plug-ins I use should take care of those issues but it is not obvious that they indeed do.
An example, me and Frank’s sites webmentioning each other
Frank Meeuwsen and I have been mentioning eachother several times and we’ve seen some strange webmention behaviours. For instance in one case Frank’s blog displayed not just a short part of my posting mentioning him, but my entire page including header, footer and sidebar. Clearly something wrong, likely with some of my machine readable encoding, but maybe also something wrong on his end. I suspect my machine readable encoding is indeed faulty but there’s no clear way in which I can change how my webmention plugins deal with that. And if I alter the code, which I could, it is likely the next software update will simply overwrite it.
Yesterday Frank posted about the puzzle webmention is to him in Dutch. Here are some screenshots on how pieces of that puzzle look on my end of things.
Frank’s posting lives at http://diggingthedigital.com//Waar-te-beginnen-met-Webmentions/ In his posting he refers to a posting on my site. He did not send a webmention. But I can do that myself, using a simple form at the bottom of my posting (visible at the bottom of this page too). In that webform I pasted the mentioned url, and that sends the simple webmention message. That message has been received and stored on my server, with the correct source and target address and a timestamp:
What ended up underneath my posting is:
Or as it looks for me as the site’s owner:
A few things stand out:
- There’s no link to the actual blogpost by Frank (the source), just to his general domain
- There’s a link to news.indieweb.org, which is a completely different domain
- There’s no image of the author or an avatar in absence of an image
- There isn’t any content from Frank’s post shown as part of the mention
So what’s happening? Is this an issue at Frank’s end, is it an issue with what I store on my server, or what I show in my site template? One, two, all three of them?
Puzzling over the pieces in this example
The missing avatar. My site tries to look for an avatar in the source, and if there isn’t one, it shows a general one. Here neither happens, it’s just a blank space. The HTML source of my page reveals it does try to show an avatar, the one that Frank sets in his own blog page as the one to use. His site says in the source code:
<a href="/" class="site-avatar"><img src="/images/dtd-avatar.png" class="u-photo" /></a>
The micro format u-photo is interpreted correctly by my site, and it tries to show the linked image. When you go to that image in your browser it works, but if you try to embed it in your own page it doesn’t.
Frank’s image should be visible below this line,
and above this one, but it isn’t.
Probably Frank’s web server prevents bandwidth theft by sending back a white pixel and not the requested image.
[UPDATE] The issue, as Sven points out in the comments, is that this site is https and Frank’s is http. My browser is set-up to reject http material on an otherwise https site. A case of my browser being my castle.[/UPDATE]
Making the avatar fail because my site doesn’t try to store the avatar locally.
The link to news.indieweb.org and the absence of a link to the actual blog post by Frank. The source (Frank’s blogpost) was sent and received correctly as we saw. In the machine readable part of Frank’s site a value is set as ‘canonical’ address for his blogpost.
There is an extra / in that url, and I’m not sure what that might cause, but on my end the canonical that gets saved is very different, it’s that indieweb address.
The odd bit is that indieweb.org address is not mentioned in the source of Frank’s page. At the same time, it seems it isn’t unique to my server, as underneath a posting about webmentions by Sebastiaan Andeweg you see the same thing happening. Frank’s webmention from May 12th shows the indieweb link (and no avatar). Sebastiaan doesn’t use WordPress or the plugins I use as far as I can tell.
So where’s the actual link to Frank’s blogpost? The canonical URL Frank’s posts provides is stored on my server, in the database table for comments as the URL for the author. The indieweb URL however is stored as canonical URL in the comment metadata table in my database. And that gets used for displaying the webmention underneath my blogposting.
The same is true for the absence of the content of Frank’s mention of me. It is collected and stored in the comment table of my site’s database. Yet what is shown underneath my blogpost as mention is constructed only from the comment meta data table, and not the comment table.
Frank’s mention’s content is in my comment database, yet not shown
The metadata fields stored for Frank’s mention in my database
So what’s happening here is a mix of elements from Frank’s site, my webmention plugins and my site template. But how to influence the behaviour of my plugins without seeing that undone with the next update is not clear to me at this point. Nor is how to alter the plugins so I can improve the machine readable microformats on my site.
Peter Rukavina mentioned this article on ruk.ca.
Inspecting some pieces of puzzling #webmention behaviour zylstra.org/blog/2018/07/w… @frankmeeuwsen @sebsel @martijnvdven #indieweb
Lot’s of things going on here, but I think I figured them all out.
Frank’s site is only served over HTTP, not HTTPS. In
<img src="">, that’s fine and only creates a warning in the browser, but in your comment display it is included in
<img srcset="">. Here, browsers do not accept mixed content, so the image is blocked and not shown. This is also why there is no default avatar: the avatar was found and is requested in the HTML, but the browser refuses to load it.
link to news.indieweb.org
That’s not true, and the problem in this case. There’s a
<a href="https://news.indieweb.org/nl" class="u-syndication"></a>as the only top-level link inside his post, and no explicit
urlproperty set. This causes the microformats parser to assume that this link points to the canonical location of the post, and it is thus used for comment display. This seems like a problem with the microformats specification, and I’ll follow up on it there, but for now the easy fix would be for Frank’s posts to mark up their permalink, e.g. by adding a
class="u-url"to the link on the headline.
absence of content in comments
This is intentional. Frank’s post only mentions your post (=includes a link to it), it is not marked up as an explicit reply. Only replies are shown with content, since for mentions this is often misleading.
Peter Rukavina mentioned this article on ruk.ca.
Frank Meeuwsen mentioned this article on diggingthedigital.com.
Ton Zijlstra mentioned this article on zylstra.org.