šŸŽ‰ Eight years ago today, the #IndieWeb Webmention protocol was published as a W3C REC https://www.w3.org/TR/webmention/

As a social web building block, #Webmention was designed to work with various other building blocks. Small pieces, loosely joined. Every year developers find new ways to work with Webmention, and new subtleties when combined with other building blocks.

The primary uses of Webmention, peer-to-peer comments, likes, and other responses across web sites, have long presented an interesting challenge with the incorporation and display of external content originally from one site (the Webmention sender), on another site (the Webmention receiver).

There are multiple considerations to keep in mind when displaying such external content.

Two examples of external content are images (e.g. peopleā€™s icons or profile images from the author of a comment) and text (e.g. peopleā€™s names or the text of their comments).

For external images, rather than displaying them in full fidelity, you may want to compress them into a smaller resolution for how your site displays the profile images of comment authors.

If you accept Webmentions from arbitrary sources, thereā€™s no telling what might show up in author images. You may want to pixelate images from unknown or novel sources into say 3x3 pixel grids of color (or grayscale) averages to make them uniquely identifiable while blurring any undesirable graphics beyond recognition.

For external text, one thing we discovered in recent IndieWeb chatĀ¹ is that someoneā€™s comment (or in this case their name) can contain Unicode directional formatting characters, e.g. for displaying an Arabic or Hebrew name right-to-left. Text with such formatting characters can errantly impact the direction of adjacent text.

Fortunately there is a CSS property, 'unicode-bidi', that can be used to directionally isolate such external text. Thus when you embed text that was parsed from a received Webmention, possibly with formatting characters, you have to wrap it in an HTML element (a span will do if you have not already wrapped it) with that CSS property. E.g.:

<span style="unicode-bidi: isolate;">parsed text here</span>

Though even better would be use of a generic HTML class name indicating the semantic:

<span class="external-text">parsed text here</span>

and then a CSS rule in your style sheet to add that property (and any others you want for external text)

.external-text { unicode-bidi: isolate; }

Previously: https://tantek.com/2023/012/t1/six-years-webmention-w3c


This is post 7 of #100PostsOfIndieWeb. #100Posts #socialWeb #openSocialWeb

ā† https://tantek.com/2025/004/t1/micro-one-onramp-open-social-web
ā†’ šŸ”®


Glossary

HTML class name
Ā  https://tantek.com/2012/353/b1/why-html-classes-css-class-selectors
IndieWeb chat
Ā  https://indieweb.org/discuss
pixelate
Ā  https://indieweb.org/pixelated
small pieces, loosely joined
Ā  https://www.smallpieces.com/
Unicode directional formatting characters
Ā  https://en.wikipedia.org/wiki/Bidirectional_text#Explicit_formatting
unicode-bidi CSS property
Ā  https://developer.mozilla.org/en-US/docs/Web/CSS/unicode-bidi Ā 


References

Ā¹ https://chat.indieweb.org/dev/2025-01-05#t1736092889120900

My list of articles worth of reading https://w3blogy.cz/ has now author attribution, abstract and tags. Every article from my Feedly feed is enhanced with semantic data extracted from the page. I have many layers of fallbacks to get the best data I can. #indieweb #semanticweb

Content Policy on the Social Web

Nesse sentido o mais avanƧado parece ser o https://atabook.org/

Vi tambƩm umas paradas que tu bota que dƔ pra visualizar o mouse de quem mais estiver online ao mesmo tempo na pƔgina.

SerĆ” que existem outras coisas?

#indieWeb

A series of posts on why the right wing likes the indie web, or small web, as it were and how they are taking advantage of the indieweb to push hate.

part 1 https://blog.avas.space/the-web-revival-harmful-ideas/

part 2 https://web.archive.org/web/20231206041729/https://daintyeco.smol.pub/webrevivalharmfulideaspart2

RELATED. RageBate in the indieweb https://blog.avas.space/rage-bait/

#SmallWeb #IndieWeb #Internet #WebRevival

I'm working on a web component for embedding youtube videos. I'm setting it up to use the parent page's stylesheet. If I put the custom element on the page in the `<main>` element everything work as expected. If I move the custom element inside a `<section>` tag the styles get messed up. I spent an hour on it and made no progress. This page shows what's going on if that kind of puzzle appeals to you:

https://yt-player.alanwsmith.com/issue/

#WebDev #WebComponents #IndieWeb

This is super exciting, and I look forward to having my blog be fully federated this year!

https://activitypub.ghost.org/the-story-so-far/

#Technology #GhostCMS #Blog #Fediverse #IndieWeb

šŸ”— Range via @louie #Indieweb #Blogging #Rss

Whenever I beat the RSS drum, someone always asks about discoverability, so I want to put this bluntly: it is through algorithmic discoverability features that harmful posts become visible. Whether they are original posts, reposts, or replies, harmful posts are only able to successfully reach their intended audience by depending on those features functioning as social media websites built them.

https://lmnt.me/blog/range.html

Okay Meta might not have a consumer product of more significance than the iPhone, but React is still hugely important in the tech world

While Swift is definitely great for app development and backend, React is still my go to for web frontend, all of my sites are built in Next.JS

With that being said, SwiftWASM looks fun

#Technology #Meta #Apple #React #IndieWeb #NextJS #SwiftLang

Iā€™m interested in the IndieWeb, books, and thinking about curation, so of course I love this post from Ben Werdmuller:

The indieweb should feel like the Norrington Room: an expansive world of different voices, opinions, modes of expression, and art that you can explore, peruse, or have curated for you. Itā€™s not about any particular goal aside from the goal of being enriched by people sharing their lived experiences, creativity, and expertise. Itā€™s a journey of discovery, conversation, and community, not a journey of extraction.

Hope to visit Blackwellā€™s one day too.

The indie web should be a universe of discovery

Iā€™m interested in the IndieWeb, books, and thinking about curation, so of course I love this post from Ben Werdmuller:

The indieweb should feel like the Norrington Room: an expansive world of different voices, opinions, modes of expression, and art that you can explore, peruse, or have curated for you. Itā€™s not about any particular goal aside from the goal of being enriched by people sharing their lived experiences, creativity, and expertise. Itā€™s a journey of discovery, conversation, and community, not a journey of extraction.

Hope to visit Blackwellā€™s one day too.

The #indieweb should be a journey of discovery, conversation, and community, not one of extraction. That demands different tools and a different approach to search. werd.io/2025/the-ind...

The indie web should be a univ...

The #indieweb should be a journey of discovery, conversation, and community, not one of extraction. That demands different tools and a different approach to search. https://werd.io/2025/the-indie-web-should-be-a-universe-of-discovery

@point5a @Vivaldi @johnbeen So, I happened to get my #VivaldiMail address, after all. I previously did it, but I still need to set it up in on my #MacBook app for downloading. Meanwhile, I also now have a secondary #Mastodon account at #VivaldiSocial.
I have also been completing my #Fediverse, #Mastodon, #BlueSky, and other connections at #WordPress, thanks to #ActivityPub, #Jetpack, #Webfinger, #Friends, #Hum, #Webmention, and other #plugins. Thanks also to people like @pfefferle and many others who have been making these plugin applications happen over the years. Big improvements! Almost there in my setupā€¦ getting better everyday. Iā€™ve been incredibly productive, and on the way! Thanks to the community here!! @mastodonmigration too.

Ha! Iā€™m again able to have *my silly website* ā€œboostā€ ā€œFediverse posts.ā€

I mark these up using #microformats2 ā€“ which after parsing look like this: https://pin13.net/mf2/?url=https%3A%2F%2Fjan.boddez.net%2Fnotes%2F786b644f01 ā€“ and have my ā€œActivityPub senderā€ pick that up, so that instead of a ā€œCreateā€ activity, it POSTs an ā€œAnnounce.ā€

Iā€™d previously implemented this as an addon for #WordPressā€™ #ActivityPub plugin and now have it working for my #Laravel site, too.

#IndieWeb

Hello (again), indieweb dot social!

Here's a new #introduction

I've been active on and off on this account, but with my previous home instance allthingstech dot social being shut down in the near future, this is where I will be now!

I'd like to thank @CliffWade and @beardedtechguy for really introducing me to both the fediverse and blogging

I wouldn't be an #IndieWeb builder if it weren't for them and AllThingsTech

@nikswonder Yeah #goodreads is cluttered. I also don't like how books are rated. Ideally I jus want my own #indieweb corner of the internet where I can rate my books & share my thoughts. I went w/my own published notion pg w/ #GoogleSheets charts embedded! https://librarymonster.io/lair.html

I can easily & quickly update my reading progress & status updates thru the notion app. Deeper analytics (of my own; #storygraph is good but I want to crunch my own stats) go into gsheets' published charts āœØšŸ·

"Itā€™s easy to forget how simple a website can be. A website can be just one page. It doesnā€™t even need CSS. You donā€™t need a content management system like Wordpress. All you have to do is write some HTML and drag that file to a server"

lmnt.me/blog/how-to-...

#Website #WebDev #IndieWeb