I love full-width websites, I love fixed width websites. I love flex galleries and I love grid galleries. I love plain websites and colourful websites. I love cool skeuomorphic design elements and I love plain, bog-standard webpages. I love clever and loose tag-based navigation and I love organised and well-defined hierarchies. I love painterly graphic elements and I love hard-edged vector elements
in short, my website can't be done because it will always want to be something else
I really like this little tool I’ve built: it collects all relevant posts from my most active social media accounts in one place, so that fellow goblins can just chill out in it. Comments and #webmentions are also active, so there is always room for goblin notes and scratches in the archive.
Turning myself into a goblin asking himself what other goblins would like in a social media archive has so far been fungal.
https://social.mariobreskic.de/goblin/2025/01/13/651/
I really like this little tool I’ve built: it collects all relevant posts from my most active social media accounts in one place, so that fellow goblins can just chill out in it. Comments and #webmentions are also active, so there is always room for goblin notes and scratches in the archive.
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
🎉 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
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?
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/
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:
This is super exciting, and I look forward to having my blog be fully federated this year!
🔗 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.
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...