Happy 23rd birthday, @somafm ! #indieweb #music
{
"type": "entry",
"author": {
"name": "@brettk",
"url": "https://indieweb.social/@brettk",
"photo": null
},
"url": "https://indieweb.social/@brettk/110270969932437070",
"content": {
"html": "<p>Happy 23rd birthday, <span class=\"h-card\"><a class=\"u-url\" href=\"https://sfba.social/@somafm\">@<span>somafm</span></a></span> ! <a href=\"https://indieweb.social/tags/indieweb\">#<span>indieweb</span></a> <a href=\"https://indieweb.social/tags/music\">#<span>music</span></a></p>",
"text": "Happy 23rd birthday, @somafm ! #indieweb #music"
},
"published": "2023-04-27T13:17:49+00:00",
"post-type": "note",
"_id": "36827816",
"_source": "7235",
"_is_read": false
}
What are you all using for online meetings and teaching in terms of video service? In line with avoiding big tech I mean?
I've been using Whereby (Norwegian) for years but have found it becoming less and less reliable.
Aware of Jitsi and BigBlueButton but I thought this would be a perfect space for asking around as I will definitely have missed some interesting players. I also run my own @owncast server for specific live events.
#Indieweb #SmallTech
{
"type": "entry",
"author": {
"name": "#indieweb",
"url": "https://mastodon.social/tags/indieweb",
"photo": null
},
"url": "https://axbom.me/objects/2903dd66-c218-49cd-a555-5d86223048e9",
"content": {
"html": "What are you all using for online meetings and teaching in terms of video service? In line with avoiding big tech I mean?<br /><br />I've been using Whereby (Norwegian) for years but have found it becoming less and less reliable. <br /><br />Aware of Jitsi and BigBlueButton but I thought this would be a perfect space for asking around as I will definitely have missed some interesting players. I also run my own <span class=\"h-card\"><a class=\"u-url\" href=\"https://fosstodon.org/@owncast\">@<span>owncast</span></a></span> server for specific live events.<br /><br /><a href=\"https://axbom.me/tag/indieweb\">#Indieweb</a> <a href=\"https://axbom.me/tag/smalltech\">#SmallTech</a>",
"text": "What are you all using for online meetings and teaching in terms of video service? In line with avoiding big tech I mean?\n\nI've been using Whereby (Norwegian) for years but have found it becoming less and less reliable. \n\nAware of Jitsi and BigBlueButton but I thought this would be a perfect space for asking around as I will definitely have missed some interesting players. I also run my own @owncast server for specific live events.\n\n#Indieweb #SmallTech"
},
"published": "2023-04-27T06:11:05+00:00",
"post-type": "note",
"_id": "36820815",
"_source": "7235",
"_is_read": false
}
{
"type": "entry",
"published": "2023-04-26T23:38:16-0400",
"url": "https://martymcgui.re/2023/04/26/bad-web-dev-ideas-emoji-as-ids-in-urls/",
"category": [
"\ud83d\udd78\ufe0f\ud83d\udc8d",
"webring",
"IndieWeb",
"update",
"emoji"
],
"syndication": [
"https://fed.brid.gy/"
],
"name": "Bad web dev ideas: emoji as IDs in URLs",
"content": {
"text": "It's another rambling web dev post sorry not sorry grab a beverage and let's go.\nBegin with the Horrible Admission \ud83e\udd2b\ud83d\ude33\nRather than make you wait, here it is:\nI created and maintain An IndieWeb Webring and it uses emojis as IDs. When you add your site to the webring by signing in, an emoji ID is created for you, and it acts, in some ways, like your username or profile ID.\nFor example my webring profile is: \ud83d\udd78\ufe0f\ud83d\udc8d.ws/\ud83d\udeaf\n\n Hopefully you see the appeal. The webring is on an emoji domain, which I registered at IndieWeb Summit 2018 inspired by something Doug Beal presented. It was soon decided that I must in fact build a webring there and, leveraging his influence as the originator of the idea, Doug insisted that emojis be used as user IDs. Probably because: moar emojis!\n \n\nWhy even have IDs? \ud83d\udec2\ud83e\udd37\ud83c\udffb\u200d\u2642\ufe0f\nThis is a dang good question and I could probably sleep better if I drop them.\n\n Ring-ness and identifying click sources\n \n\n\n At the time, the idea was that a webring should be a ring, with adjacency. In other words, if I click the \"next site\" link on your website, it should consistently go to the same site. If I click the \"previous site\" link on their site, it should consistently go back to yours. In order to consistently know which site to send them to next, the webring needs to know where you're coming from.\n \n\nHistorically there has been a way to know where a visitor is coming from: the HTTP \"Referer\" [sic] header. However, at the time (and in the time since) there have been privacy issues around using this header, and it was not uncommon to see sites sabotage this info with purposeful redirects, browser standards were added to allow degrading or removing referrer info, and Chrome even implemented default policies to degrade it.\nSo the more reliable thing would be to put some identifier in the URL and trust that webring members wouldn't like weirdly spoof one anothers' unique webring URLs.\n\n Profile pages\n \n\n\n Another at the time thought was that webring members might want to \"prove\" that they were on the webring. An active profile page with rel-me verification linking back to their homepage could allow other sites and tools to say \"oh hey! you're a member of this webring\". Maybe we could show some stats there! At any rate, none of those use cases ever came into existence as far as I know. (Besides, stats are gross.)\n \n\n\n Why not use <xyz> as an ID? \ud83e\udd14\ud83d\udca1\n \n\nSome things I considered and discarded:\nJust use the URL. URLs-appended-to-URLs require escaping and sanitizing and this gets ugly and long.\n Use a hash of the URL. I like this approach (spoiler alert) but even when they are short hashes are also long and ugly.\n \n Use a numeric ID like a database row. This would probably be fine but numeric IDs can be easily crawled (fine for a webring I guess??) and people get weird about low ID numbers sometimes (warning: orange site link). Also they are boring.\n \n\n Something more clever. Well, we probably could have but this was a weekend hack kind of project.\nThe original sin \ud83c\udf4e\ud83d\udc0d\n\n There is a fun little NodeJS library called hash-emoji that takes any-ol-thing and gives you back a string of emojis of the length you ask. Under the hood, it uses a strong SHA256 hash in hexadecimal, parses that hexadecimal number, then uses modulo arithmetic to keep adding \"digits\" just like any hash algorithm, only the \"digits\" come from a collection of emojis that were in wide use back in 2017 when the library was created.\n \n\n\n I alluded to this in my post about adding a directory to the webring in 2019, but slapping a random emoji or two or three on someone's profile is potentially problematic. When some folks pointed out it was odd that they were assigned a country flag for a place they had never been, I cheekily forked hash-emoji to make hash-emoji-without-borders, which is identical in all ways except I pulled out all flags. Now nobody would get a flag!\n \n\nHowever, by removing the flags I had shrunk the key space for the emoji hash. It wasn't great to begin with - using one emoji from the initial set of ~1300 was bound to lead to collisions eventually - but by changing the set I felt like I was increasing the likelihood that some new signup would be assigned the same emoji ID as an already existing site in the ring.\nSo, I bumped the length of new IDs up to 2. And then, after an unrelated change where I started normalizing URLs differently before creating their hash ID, up to 3.\n\n Let me tell you. 3 emoji almost always tell a story. You can't not see them. Sometimes those stories can be problematic! Or maybe it's nice but you don't find it relatable. Or maybe there is no story, per se, but you're assigned something that you object to being associated with, like weapons or kissing faces or drugs and alcohol or religious symbols, or ...\n \n\nSome folks also ran into issues with the URLs on their web hosting. While I tend to think of the web as being universally UTF-8, that's not necessarily the case. Some hosts would mangle the Unicode URLs, resulting in the webring not being able to find them, resulting in sites being de-listed from the ring. To make it easy for the widest possible of webring users to simply copy their webring links and paste them into their site, I change it to use the %-encoded versions of the emojis. So now my beautiful \ud83d\udd78\ufe0f\ud83d\udc8d.ws/\ud83d\udeaf has become the horrific: https://xn--sr8hvo.ws/%F0%9F%9A%AF\nInstead of worrying too much about any of this I just ... left it alone. A few times I received requests for folks who wanted something custom, and sometimes I obliged as long as it was a request for a unique one- or two-emoji ID, so it couldn't collide with someone's future random ID.\nFooling around, finding out \ud83e\udd6b\ud83e\udeb1\nI've been low-key working on porting the webring from its old and crumbling NodeJS implementation to (hear me out) PHP (I SAID HEAR ME OUT). The basic idea is to reduce the number of emails I get from GitHub where dependabot reports a vulnerability in this or that dependency-of-a-dependency, and more importantly to reduce the amount of time that updating those dependencies takes by reducing the amount of breakage that occurs. I guess this is me saying that churn among dependencies for NodeJS apps feels more disruptive to me than I expect churn to be for PHP. Please don't @ me. Any way.\n\n hash-emoji is broken\n \n\n\n When porting hash-emoji from Javascript to PHP I had some issues where the modulo and division math wasn't working. Turns out SHA256 digests, which are hex-encoded strings 64-characters in length, make for very large numbers when you represent them as numbers to do number math on them. With basic PHP numeric types this was turning up junk, zeroes for every modulo division.\n \n\nSo I tried out both of the main PHP extensions for arbitrary precision math, GMP and BC Math, and got results that were at least functional. However, they weren't the same as the Javascript hash-emoji implementation.\nAt least, they weren't the same until I updated my copy of hash-emoji to use BigInt to make sure it was doing its arbitrary precision math properly. It was at this point that Javascript hash-emoji now began consistently outputting the same results as my new PHP implementation.\nThat means the original hash-emoji algorithm, due to some quirks of Javascript Number math for large numbers, gives results that are not consistent with the same algorithm when using arbitrary precision math types.\n\n With my skills I cannot hope to make a PHP port of hash-emoji that produces identically quirky results to the Javascript version, so, it looks like emoji IDs will have to change again.\n \n\nConsidering the abyss \u26ab\ud83d\udc40\nI thought that, if the emoji ID generation has to change, maybe I can change it for the better? I brainstormed some ideas in the IndieWeb chat. One nice change would be to bring the emoji set up-to-date to at least Unicode 14 (published 2021, implemented widely during 2022). One major unsolved challenge would be to come up with some \"unproblematic\" set of emojis. For example, modifiers for skin tone and gender are widely supported, even in complex combinations like people kissing.\n\n Thanks to sknebel some helpful suggestions, like generating IDs without skin tone modifiers and stripping out skin tone modifiers before looking up an ID. This would allow webring users to customize any emoji that have skin tone variants. Maybe that could be expanded to customizing more things when there are variants by gender, or complex combinations like family with two adults and two children, if it should come up. A \"customize your ID\" tool begins to design itself (lol).\n \n\nsknebel also pointed me to an excellent resource that the Unicode consortium calls the \"best definition of the full set [of emoji]\" - the emoji-test.txt file. Here's the Unicode 14 emoji-test.txt file. It encodes each emoji in a line-oriented format, organized helpfully into groups and sub-groups like the ones you see on your favorite emoji keyboard.\nI could parse this file out into various datasets annotated with their groupings and sub-groupings. Then, I could use those definitions to pull together any combination of (sub-)groupings that I want into different hash-emoji datasets.\n\n I could expand a \"customize your ID\" tool to allow folks who don't like their initial ID to opt out of any groups they don't want emojis from. I could treat those groupings as a flag set and map that flag set to an emoji to prepend to their ID, so each combination of groups becomes its own key space. Nice!\n \n\nReader, let me tell you: I do not want to do all of that.\nEnd with the other Horrible Admission \ud83e\udd2b\ud83d\ude0f\nAs implemented, the webring isn't a true ring. Whether a visitor clicks your custom emoji /next link or your custom emoji /previous link, the webring, in fact, sends you to another active site in the ring at random.\nSo what's next? I think the webring can function fine without these IDs. The copy-paste webring links can become identical for everyone, and the directory, sign-in, and dashboard pages don't make use of them at all. The one exception is individual profile page URLs for member pages, which I think I can safely drop.\n\n What do you think? Are you horrified by any of this? Enraged? Got an ideas I can try instead? Drop me a reply, I'd love to hear from you!",
"html": "<p>It's another rambling web dev post sorry not sorry grab a beverage and let's go.</p>\n<h2>Begin with the Horrible Admission \ud83e\udd2b\ud83d\ude33</h2>\n<p>Rather than make you wait, here it is:</p>\n<p>I created and maintain <a href=\"https://xn--sr8hvo.ws/\">An IndieWeb Webring</a> and it uses emojis as IDs. When you add your site to the webring by signing in, an emoji ID is created for you, and it acts, in some ways, like your username or profile ID.</p>\n<p>For example my webring profile is: <a href=\"https://xn--sr8hvo.ws/%F0%9F%9A%AF\">\ud83d\udd78\ufe0f\ud83d\udc8d.ws/</a><a href=\"https://xn--sr8hvo.ws/%F0%9F%9A%AF\">\ud83d\udeaf</a></p>\n<p>\n Hopefully you see the appeal. The webring is on an <a href=\"https://en.wikipedia.org/wiki/Emoji_domain\">emoji domain</a>, which I registered at <a href=\"https://indieweb.org/2018\">IndieWeb Summit 2018</a> inspired by something <a href=\"https://dougbeal.com/\">Doug Beal</a> presented. It was soon decided that I must in fact build a webring there and, leveraging his influence as the originator of the idea, Doug insisted that emojis be used as user IDs. Probably because: moar emojis!\n <br /></p>\n<h2>Why even have IDs? \ud83d\udec2\ud83e\udd37\ud83c\udffb\u200d\u2642\ufe0f</h2>\n<p>This is a dang good question and I could probably sleep better if I drop them.</p>\n<h3>\n Ring-ness and identifying click sources\n <br /></h3>\n<p>\n <i>At the time</i>, the idea was that a webring should be a <i>ring</i>, with adjacency. In other words, if I click the \"next site\" link on your website, it should consistently go to the same site. If I click the \"previous site\" link on <i>their</i> site, it should consistently go back to yours. In order to consistently know which site to send them to next, the webring needs to know where you're coming <i>from.</i>\n <br /></p>\n<p>Historically there has been a way to know where a visitor is coming from: the HTTP \"Referer\" [sic] header. However, <i>at the time</i> (and in the time since) there have been privacy issues around using this header, and it was not uncommon to see sites sabotage this info with purposeful redirects, <a href=\"https://developer.mozilla.org/en-US/docs/Web/Security/Referer_header:_privacy_and_security_concerns\">browser standards were added to allow degrading or removing referrer info</a>, and <a href=\"https://developer.chrome.com/blog/referrer-policy-new-chrome-default/\">Chrome even implemented default policies to degrade it</a>.</p>\n<p>So the more reliable thing would be to put some identifier in the URL and trust that webring members wouldn't like weirdly spoof one anothers' unique webring URLs.</p>\n<h3>\n Profile pages\n <br /></h3>\n<p>\n Another <i>at the time</i> thought was that webring members might want to \"prove\" that they were on the webring. An active profile page with <a href=\"https://indieweb.org/rel-me\">rel-me verification</a> linking back to their homepage could allow other sites and tools to say \"oh hey! you're a member of this webring\". Maybe we could show some stats there! At any rate, none of those use cases ever came into existence as far as I know. (Besides, stats are gross.)\n <br /></p>\n<h3>\n Why not use <xyz> as an ID? \ud83e\udd14\ud83d\udca1\n <br /></h3>\n<p>Some things I considered and discarded:</p>\n<ul><li>Just use the URL. URLs-appended-to-URLs require escaping and sanitizing and this gets ugly and long.</li>\n <li>Use a hash of the URL. I like this approach (spoiler alert) but even when they are short hashes are also long and ugly.</li>\n <li>\n Use a numeric ID like a database row. This would probably be fine but numeric IDs can be easily crawled (fine for a webring I guess??) and <a href=\"https://news.ycombinator.com/item?id=12962235\">people get weird about low ID numbers sometimes</a> (warning: orange site link). Also they are <i>boring</i>.\n <br /></li>\n <li>Something more clever. Well, we probably could have but this was a weekend hack kind of project.</li>\n</ul><h2>The original sin \ud83c\udf4e\ud83d\udc0d</h2>\n<p>\n There is a fun little <a href=\"https://github.com/earobinson/hash-emoji\">NodeJS library called hash-emoji</a> that takes any-ol-thing and gives you back a string of emojis of the length you ask. Under the hood, it uses a strong SHA256 hash in hexadecimal, parses that hexadecimal number, then uses modulo arithmetic to keep adding \"digits\" just like any hash algorithm, only the \"digits\" come from a collection of emojis that were in wide use back in 2017 when the library was created.\n <br /></p>\n<p>\n I alluded to this in <a href=\"https://martymcgui.re/2019/01/19/an-indiewebring-directory/\">my post about adding a directory to the webring in 2019</a>, but slapping a random emoji or two or three on someone's profile is <i>potentially problematic</i>. When some folks pointed out it was odd that they were assigned a country flag for a place they had never been, I cheekily forked hash-emoji to make <a href=\"https://github.com/martymcguire/hash-emoji-without-borders\">hash-emoji-without-borders</a>, which is identical in all ways except I pulled out all flags. Now nobody would get a flag!\n <br /></p>\n<p>However, by removing the flags I had shrunk the <i>key space</i> for the emoji hash. It wasn't great to begin with - using one emoji from the initial set of ~1300 was bound to lead to collisions eventually - but by changing the set I felt like I was increasing the likelihood that some new signup would be assigned the same emoji ID as an already existing site in the ring.</p>\n<p>So, I bumped the length of new IDs up to 2. And then, after an unrelated change where I started normalizing URLs differently before creating their hash ID, up to 3.</p>\n<p>\n Let me tell you. 3 emoji almost always tell a story. You can't <i>not</i> see them. Sometimes those stories can be problematic! Or maybe it's nice but you don't find it relatable. Or maybe there is no story, per se, but you're assigned something that you object to being associated with, like weapons or kissing faces or drugs and alcohol or religious symbols, or ...\n <br /></p>\n<p>Some folks also ran into issues with the URLs on their web hosting. While I tend to think of the web as being universally UTF-8, that's not necessarily the case. Some hosts would mangle the Unicode URLs, resulting in the webring not being able to find them, resulting in sites being de-listed from the ring. To make it easy for the widest possible of webring users to simply copy their webring links and paste them into their site, I change it to use the %-encoded versions of the emojis. So now my beautiful <a href=\"https://xn--sr8hvo.ws/%F0%9F%9A%AF\">\ud83d\udd78\ufe0f\ud83d\udc8d.ws/</a><a href=\"https://xn--sr8hvo.ws/%F0%9F%9A%AF\">\ud83d\udeaf</a> has become the horrific: https://xn--sr8hvo.ws/%F0%9F%9A%AF</p>\n<p>Instead of worrying too much about any of this I just ... left it alone. A few times I received requests for folks who wanted something custom, and sometimes I obliged as long as it was a request for a unique one- or two-emoji ID, so it couldn't collide with someone's future random ID.</p>\n<h2>Fooling around, finding out \ud83e\udd6b\ud83e\udeb1</h2>\n<p>I've been low-key working on porting the webring from its old and crumbling NodeJS implementation to (hear me out) PHP (I SAID HEAR ME OUT). The basic idea is to reduce the number of emails I get from GitHub where dependabot reports a vulnerability in this or that dependency-of-a-dependency, and more importantly to reduce the amount of time that updating those dependencies takes by reducing the amount of breakage that occurs. I guess this is me saying that churn among dependencies for NodeJS apps feels more disruptive to me than I expect churn to be for PHP. Please don't @ me. Any way.</p>\n<h3>\n hash-emoji is broken\n <br /></h3>\n<p>\n When porting hash-emoji from Javascript to PHP I had some issues where the modulo and division math wasn't working. Turns out SHA256 digests, which are hex-encoded strings 64-characters in length, make for <i>very large numbers</i> when you represent them <i>as numbers</i> to do <i>number math</i> on them. With basic PHP numeric types this was turning up junk, zeroes for every modulo division.\n <br /></p>\n<p>So I tried out both of the main PHP extensions for arbitrary precision math, <a href=\"https://www.php.net/manual/en/book.gmp.php\">GMP</a> and <a href=\"https://www.php.net/manual/en/book.bc.php\">BC Math</a>, and got results that were at least functional. However, <i>they weren't the same</i> as the Javascript hash-emoji implementation.</p>\n<p>At least, they weren't the same <i>until</i> I updated my copy of hash-emoji to use <a href=\"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/BigInt\">BigInt</a> to make sure it was doing its arbitrary precision math properly. It was at this point that Javascript hash-emoji now began consistently outputting the same results as my new PHP implementation.</p>\n<p>That means the original hash-emoji algorithm, due to some quirks of Javascript Number math for large numbers, gives results that are not consistent with the same algorithm when using arbitrary precision math types.</p>\n<p>\n With my skills I cannot hope to make a PHP port of hash-emoji that produces identically quirky results to the Javascript version, so, it looks like emoji IDs will have to change <i>again</i>.\n <br /></p>\n<h2>Considering the abyss \u26ab\ud83d\udc40</h2>\n<p>I thought that, if the emoji ID generation has to change, maybe I can change it for the better? I <a href=\"https://chat.indieweb.org/dev/2023-04-26#t1682525287569200\">brainstormed some ideas in the IndieWeb chat</a>. One nice change would be to bring the emoji set up-to-date to at least Unicode 14 (published 2021, implemented widely during 2022). One major unsolved challenge would be to come up with some \"unproblematic\" set of emojis. For example, modifiers for skin tone and gender are widely supported, even in complex combinations like people kissing.</p>\n<p>\n Thanks to <a href=\"https://www.svenknebel.de/posts/\">sknebel</a> some helpful suggestions, like generating IDs without skin tone modifiers and stripping out skin tone modifiers before looking up an ID. This would allow webring users to customize any emoji that have skin tone variants. Maybe that could be expanded to customizing more things when there are variants by gender, or complex combinations like family with two adults and two children, if it should come up. A \"customize your ID\" tool begins to design itself (lol).\n <br /></p>\n<p>sknebel also pointed me to an <i>excellent</i> resource that the <a href=\"https://www.unicode.org/reports/tr51/tr51-21.html#Identification\">Unicode consortium calls the \"best definition of the full set [of emoji]\"</a> - the emoji-test.txt file. Here's the <a href=\"https://unicode.org/Public/emoji/14.0/emoji-test.txt\">Unicode 14 emoji-test.txt</a> file. It encodes each emoji in a line-oriented format, organized helpfully into groups and sub-groups like the ones you see on your favorite emoji keyboard.</p>\n<p>I could parse this file out into various datasets annotated with their groupings and sub-groupings. Then, I could use those definitions to pull together any combination of (sub-)groupings that I want into different hash-emoji datasets.</p>\n<p>\n I could expand a \"customize your ID\" tool to allow folks who don't like their initial ID to opt out of any groups they don't want emojis from. I could treat those groupings as a flag set and map that flag set to an emoji to prepend to their ID, so each combination of groups becomes its own key space. Nice!\n <br /></p>\n<p>Reader, let me tell you: I do not want to do all of that.</p>\n<h2>End with the other Horrible Admission \ud83e\udd2b\ud83d\ude0f</h2>\n<p>As implemented, the webring isn't a true <i>ring</i>. Whether a visitor clicks your custom emoji /next link or your custom emoji /previous link, the webring, in fact, sends you to another active site in the ring <i>at random</i>.</p>\n<p>So what's next? I think the webring can function fine without these IDs. The copy-paste webring links can become identical for everyone, and the directory, sign-in, and dashboard pages don't make use of them at all. The one exception is individual profile page URLs for member pages, which I think I can safely drop.</p>\n<p>\n What do you think? Are you horrified by any of this? Enraged? Got an ideas I can try instead? Drop me a reply, I'd love to hear from you!\n <br /></p>"
},
"author": {
"type": "card",
"name": "Marty McGuire",
"url": "https://martymcgui.re/",
"photo": "https://martymcgui.re/images/logo.jpg"
},
"post-type": "article",
"_id": "36820335",
"_source": "175",
"_is_read": false
}
{
"type": "entry",
"author": {
"name": "@pablo",
"url": "https://social.lifeofpablo.com/@pablo",
"photo": null
},
"url": "https://social.lifeofpablo.com/@pablo/110268590400891412",
"content": {
"html": "<p>Join an event at the indieweb!</p><p><a href=\"https://events.indieweb.org/\"><span>https://</span><span>events.indieweb.org/</span><span></span></a></p><p><a href=\"https://social.lifeofpablo.com/tags/indieweb\">#<span>indieweb</span></a> <a href=\"https://social.lifeofpablo.com/tags/ownyourdata\">#<span>ownyourdata</span></a> <a href=\"https://social.lifeofpablo.com/tags/collaborate\">#<span>collaborate</span></a> <a href=\"https://social.lifeofpablo.com/tags/socialize\">#<span>socialize</span></a></p>",
"text": "Join an event at the indieweb!https://events.indieweb.org/#indieweb #ownyourdata #collaborate #socialize"
},
"published": "2023-04-27T03:12:41+00:00",
"post-type": "note",
"_id": "36819451",
"_source": "7235",
"_is_read": false
}
{
"type": "entry",
"published": "2023-04-26T21:30:00+0100",
"url": "https://www.jvt.me/mf2/2023/04/zoxqk/",
"category": [
"fediverse"
],
"bookmark-of": [
"https://justingarrison.com/blog/2023-04-24-mastodon-is-doomed/"
],
"author": {
"type": "card",
"name": "Jamie Tanna",
"url": "https://www.jvt.me",
"photo": "https://www.jvt.me/img/profile.png"
},
"post-type": "bookmark",
"refs": {
"https://justingarrison.com/blog/2023-04-24-mastodon-is-doomed/": {
"type": "entry",
"summary": "Mastodon won't be the next Twitter, and it's not because of Bluesky. The ideals and execution won't scale.",
"url": "https://justingarrison.com/blog/2023-04-24-mastodon-is-doomed/",
"featured": "https://justingarrison.com/img/mastodon-doomed-banner.png",
"name": "Mastodon Is Doomed",
"post-type": "article"
}
},
"_id": "36816643",
"_source": "2169",
"_is_read": false
}
Some technologies just keep coming back… Currently writing XML-RPC code, this time for JavaScript. Despite the new-ish JSON APIs in WordPress, not to mention Micropub, MetaWeblog is still the best way to talk to WordPress without any extra plugins or configuration.
{
"type": "entry",
"author": {
"name": "Manton Reece",
"url": "https://www.manton.org/",
"photo": "https://micro.blog/manton/avatar.jpg"
},
"url": "https://www.manton.org/2023/04/26/some-technologies-just.html",
"content": {
"html": "<p>Some technologies just keep coming back\u2026 Currently writing XML-RPC code, this time for JavaScript. Despite the new-ish JSON APIs in WordPress, not to mention Micropub, MetaWeblog is still the best way to talk to WordPress without any extra plugins or configuration.</p>",
"text": "Some technologies just keep coming back\u2026 Currently writing XML-RPC code, this time for JavaScript. Despite the new-ish JSON APIs in WordPress, not to mention Micropub, MetaWeblog is still the best way to talk to WordPress without any extra plugins or configuration."
},
"published": "2023-04-26T09:50:04-05:00",
"post-type": "note",
"_id": "36809431",
"_source": "12",
"_is_read": false
}
I didn't like how all these interests looked in my profile, so I'm putting them in a post.
#Nerd, #Virginia, #DMV, #InfoSec, #IndieWeb, #Privacy, #CatDad, #Mac, #Apple, #PopCulture, #TV, #Music, #KayScarpetta, #IndieFolk, #EDM, #Photography, #Gay, #LGBT, #Movies, #OpenStack, #macOS, #iOS, #Ubuntu, #FOSS, #fedi22
{
"type": "entry",
"author": {
"name": "@kevin",
"url": "https://itskevin.social/@kevin",
"photo": null
},
"url": "https://itskevin.social/@kevin/110266455530282607",
"content": {
"html": "<p>I didn't like how all these interests looked in my profile, so I'm putting them in a post.</p><p><a href=\"https://itskevin.social/tags/Nerd\">#<span>Nerd</span></a>, <a href=\"https://itskevin.social/tags/Virginia\">#<span>Virginia</span></a>, <a href=\"https://itskevin.social/tags/DMV\">#<span>DMV</span></a>, <a href=\"https://itskevin.social/tags/InfoSec\">#<span>InfoSec</span></a>, <a href=\"https://itskevin.social/tags/IndieWeb\">#<span>IndieWeb</span></a>, <a href=\"https://itskevin.social/tags/Privacy\">#<span>Privacy</span></a>, <a href=\"https://itskevin.social/tags/CatDad\">#<span>CatDad</span></a>, <a href=\"https://itskevin.social/tags/Mac\">#<span>Mac</span></a>, <a href=\"https://itskevin.social/tags/Apple\">#<span>Apple</span></a>, <a href=\"https://itskevin.social/tags/PopCulture\">#<span>PopCulture</span></a>, <a href=\"https://itskevin.social/tags/TV\">#<span>TV</span></a>, <a href=\"https://itskevin.social/tags/Music\">#<span>Music</span></a>, <a href=\"https://itskevin.social/tags/KayScarpetta\">#<span>KayScarpetta</span></a>, <a href=\"https://itskevin.social/tags/IndieFolk\">#<span>IndieFolk</span></a>, <a href=\"https://itskevin.social/tags/EDM\">#<span>EDM</span></a>, <a href=\"https://itskevin.social/tags/Photography\">#<span>Photography</span></a>, <a href=\"https://itskevin.social/tags/Gay\">#<span>Gay</span></a>, <a href=\"https://itskevin.social/tags/LGBT\">#<span>LGBT</span></a>, <a href=\"https://itskevin.social/tags/Movies\">#<span>Movies</span></a>, <a href=\"https://itskevin.social/tags/OpenStack\">#<span>OpenStack</span></a>, <a href=\"https://itskevin.social/tags/macOS\">#<span>macOS</span></a>, <a href=\"https://itskevin.social/tags/iOS\">#<span>iOS</span></a>, <a href=\"https://itskevin.social/tags/Ubuntu\">#<span>Ubuntu</span></a>, <a href=\"https://itskevin.social/tags/FOSS\">#<span>FOSS</span></a>, <a href=\"https://itskevin.social/tags/fedi22\">#<span>fedi22</span></a></p>",
"text": "I didn't like how all these interests looked in my profile, so I'm putting them in a post.#Nerd, #Virginia, #DMV, #InfoSec, #IndieWeb, #Privacy, #CatDad, #Mac, #Apple, #PopCulture, #TV, #Music, #KayScarpetta, #IndieFolk, #EDM, #Photography, #Gay, #LGBT, #Movies, #OpenStack, #macOS, #iOS, #Ubuntu, #FOSS, #fedi22"
},
"published": "2023-04-26T18:09:45+00:00",
"post-type": "note",
"_id": "36809238",
"_source": "7235",
"_is_read": false
}
There's a lot of great explanation sites about the fediverse and its various communities, and I wanted to take a stab at this myself.
https://jointhefediverse.net
The site (very much work in progress) is aimed at a more casual audience. Let me know what you think!
#fediverse #SocialMedia #OpenWeb #IndieWeb #JoinTheFediverse
{
"type": "entry",
"author": {
"name": "@stefan",
"url": "https://stefanbohacek.online/@stefan",
"photo": null
},
"url": "https://stefanbohacek.online/@stefan/110265867199360216",
"content": {
"html": "<p>There's a lot of great explanation sites about the fediverse and its various communities, and I wanted to take a stab at this myself.</p><p><a href=\"https://jointhefediverse.net\"><span>https://</span><span>jointhefediverse.net</span><span></span></a></p><p>The site (very much work in progress) is aimed at a more casual audience. Let me know what you think!</p><p><a href=\"https://stefanbohacek.online/tags/fediverse\">#<span>fediverse</span></a> <a href=\"https://stefanbohacek.online/tags/SocialMedia\">#<span>SocialMedia</span></a> <a href=\"https://stefanbohacek.online/tags/OpenWeb\">#<span>OpenWeb</span></a> <a href=\"https://stefanbohacek.online/tags/IndieWeb\">#<span>IndieWeb</span></a> <a href=\"https://stefanbohacek.online/tags/JoinTheFediverse\">#<span>JoinTheFediverse</span></a></p>",
"text": "There's a lot of great explanation sites about the fediverse and its various communities, and I wanted to take a stab at this myself.https://jointhefediverse.netThe site (very much work in progress) is aimed at a more casual audience. Let me know what you think!#fediverse #SocialMedia #OpenWeb #IndieWeb #JoinTheFediverse"
},
"published": "2023-04-26T15:40:08+00:00",
"post-type": "note",
"_id": "36805253",
"_source": "7235",
"_is_read": false
}
A new post that sounds self-celebratory, while in reality it's an ode to the #SmallWeb and the #indieweb.
I cleaned the structure and merged the content according to how I see my website: a personal place, rather than some brand's shop window.
I also discovered a lot of new marvellous personal sites, so my next task will be to upgrade the blogroll I just brought back.
https://minutestomidnight.co.uk/blog/rebuilding-the-website/
Also, the main title of the post doesn't reflect the URL, I used to fret over these SEO bullshit.
{
"type": "entry",
"author": {
"name": "@m2m",
"url": "https://indieweb.social/@m2m",
"photo": null
},
"url": "https://indieweb.social/@m2m/110265774778640661",
"content": {
"html": "<p>A new post that sounds self-celebratory, while in reality it's an ode to the <a href=\"https://indieweb.social/tags/SmallWeb\">#<span>SmallWeb</span></a> and the <a href=\"https://indieweb.social/tags/indieweb\">#<span>indieweb</span></a>.</p><p>I cleaned the structure and merged the content according to how I see my website: a personal place, rather than some brand's shop window.</p><p>I also discovered a lot of new marvellous personal sites, so my next task will be to upgrade the blogroll I just brought back.</p><p><a href=\"https://minutestomidnight.co.uk/blog/rebuilding-the-website/\"><span>https://</span><span>minutestomidnight.co.uk/blog/r</span><span>ebuilding-the-website/</span></a></p><p>Also, the main title of the post doesn't reflect the URL, I used to fret over these SEO bullshit.</p>",
"text": "A new post that sounds self-celebratory, while in reality it's an ode to the #SmallWeb and the #indieweb.I cleaned the structure and merged the content according to how I see my website: a personal place, rather than some brand's shop window.I also discovered a lot of new marvellous personal sites, so my next task will be to upgrade the blogroll I just brought back.https://minutestomidnight.co.uk/blog/rebuilding-the-website/Also, the main title of the post doesn't reflect the URL, I used to fret over these SEO bullshit."
},
"published": "2023-04-26T15:16:38+00:00",
"post-type": "note",
"_id": "36805254",
"_source": "7235",
"_is_read": false
}
I just finished adding Webmention on my website which is built with @eleventy
It is amazing that everything works without JavaScript being sent to the users.
Webmention + Eleventy = Ultimate Website
#webmention #11ty #indieweb
https://vanzasetia.site/
{
"type": "entry",
"author": {
"name": "@vanzasetia",
"url": "https://mastodon.social/@vanzasetia",
"photo": null
},
"url": "https://mastodon.social/@vanzasetia/110265441720333513",
"content": {
"html": "<p>I just finished adding Webmention on my website which is built with <span class=\"h-card\"><a class=\"u-url\" href=\"https://fosstodon.org/@eleventy\">@<span>eleventy</span></a></span> </p><p>It is amazing that everything works without JavaScript being sent to the users.</p><p>Webmention + Eleventy = Ultimate Website</p><p><a href=\"https://mastodon.social/tags/webmention\">#<span>webmention</span></a> <a href=\"https://mastodon.social/tags/11ty\">#<span>11ty</span></a> <a href=\"https://mastodon.social/tags/indieweb\">#<span>indieweb</span></a><br /><a href=\"https://vanzasetia.site/\"><span>https://</span><span>vanzasetia.site/</span><span></span></a></p>",
"text": "I just finished adding Webmention on my website which is built with @eleventy It is amazing that everything works without JavaScript being sent to the users.Webmention + Eleventy = Ultimate Website#webmention #11ty #indieweb\nhttps://vanzasetia.site/"
},
"published": "2023-04-26T13:51:56+00:00",
"post-type": "note",
"_id": "36803731",
"_source": "7235",
"_is_read": false
}
@mori something #indieweb already does with #webmentions which is very cool!
And in some way @manton is making both accessible via https://micro.blog
I haven't seen a "indieweb" ready theme in available from one-click install but it shouldn't be too hard to use existing Hugo themes to do just that (I'm trying and documenting my progress)
{
"type": "entry",
"author": {
"name": "@rmdes",
"url": "https://mstdn.social/@rmdes",
"photo": null
},
"url": "https://mstdn.social/@rmdes/110264252289406902",
"content": {
"html": "<p><span class=\"h-card\"><a class=\"u-url\" href=\"https://mastodon.au/@mori\">@<span>mori</span></a></span> something <a href=\"https://mstdn.social/tags/indieweb\">#<span>indieweb</span></a> already does with <a href=\"https://mstdn.social/tags/webmentions\">#<span>webmentions</span></a> which is very cool!</p><p>And in some way <span class=\"h-card\"><a class=\"u-url\" href=\"https://manton.org/activitypub/manton\">@<span>manton</span></a></span> is making both accessible via <a href=\"https://micro.blog\"><span>https://</span><span>micro.blog</span><span></span></a></p><p>I haven't seen a \"indieweb\" ready theme in available from one-click install but it shouldn't be too hard to use existing Hugo themes to do just that (I'm trying and documenting my progress)</p>",
"text": "@mori something #indieweb already does with #webmentions which is very cool!And in some way @manton is making both accessible via https://micro.blogI haven't seen a \"indieweb\" ready theme in available from one-click install but it shouldn't be too hard to use existing Hugo themes to do just that (I'm trying and documenting my progress)"
},
"published": "2023-04-26T08:49:26+00:00",
"post-type": "note",
"_id": "36797843",
"_source": "7235",
"_is_read": false
}
I’m so excited to publish my new #PersonalWebsite:
https://sidney.me/?ref=Mastodon
I’ve spent the last few months crafting my own home on the Web, and I wanted to make sure it presented me as a *human*, not defined solely by my work as a #DesignEngineer / #WebDev.
This has also been a great opportunity to finally use #Svelte & #SvelteKit in a project. I love how easy it was to learn and how intuitive it is, as someone who started with vanilla HTML and CSS
#PersonalSites #IndieWeb #FrontEnd #WebDesign
{
"type": "entry",
"author": {
"name": "@notsidney",
"url": "https://indieweb.social/@notsidney",
"photo": null
},
"url": "https://indieweb.social/@notsidney/110262392783902865",
"content": {
"html": "<p>I\u2019m so excited to publish my new <a href=\"https://indieweb.social/tags/PersonalWebsite\">#<span>PersonalWebsite</span></a>:<br /><a href=\"https://sidney.me/?ref=Mastodon\"><span>https://</span><span>sidney.me/?ref=Mastodon</span><span></span></a></p><p>I\u2019ve spent the last few months crafting my own home on the Web, and I wanted to make sure it presented me as a *human*, not defined solely by my work as a <a href=\"https://indieweb.social/tags/DesignEngineer\">#<span>DesignEngineer</span></a> / <a href=\"https://indieweb.social/tags/WebDev\">#<span>WebDev</span></a>.</p><p>This has also been a great opportunity to finally use <a href=\"https://indieweb.social/tags/Svelte\">#<span>Svelte</span></a> & <a href=\"https://indieweb.social/tags/SvelteKit\">#<span>SvelteKit</span></a> in a project. I love how easy it was to learn and how intuitive it is, as someone who started with vanilla HTML and CSS</p><p><a href=\"https://indieweb.social/tags/PersonalSites\">#<span>PersonalSites</span></a> <a href=\"https://indieweb.social/tags/IndieWeb\">#<span>IndieWeb</span></a> <a href=\"https://indieweb.social/tags/FrontEnd\">#<span>FrontEnd</span></a> <a href=\"https://indieweb.social/tags/WebDesign\">#<span>WebDesign</span></a></p>",
"text": "I\u2019m so excited to publish my new #PersonalWebsite:\nhttps://sidney.me/?ref=MastodonI\u2019ve spent the last few months crafting my own home on the Web, and I wanted to make sure it presented me as a *human*, not defined solely by my work as a #DesignEngineer / #WebDev.This has also been a great opportunity to finally use #Svelte & #SvelteKit in a project. I love how easy it was to learn and how intuitive it is, as someone who started with vanilla HTML and CSS#PersonalSites #IndieWeb #FrontEnd #WebDesign"
},
"published": "2023-04-26T00:56:33+00:00",
"post-type": "note",
"_id": "36792072",
"_source": "7235",
"_is_read": false
}
I've been updating my site at https://starbreaker.org/ with #IndieWeb #microformats.
#IndieAuth for starbreaker.org works.
h-card is implemented.
https://indiewebify.me/validate-h-card/?url=https%3A%2F%2Fstarbreaker.org%2F
h-entry validation still needs a bit of work.
https://indiewebify.me/validate-h-entry/?url=https%3A%2F%2Fstarbreaker.org%2Fblog%2Fspiral-architect%2Fchapter-003%2F
And I haven't gotten around to #WebMentions yet, but there's a #npm package I can run on one of my machines at home as a cron job to check my #RSS feed and send them. Receiving them will entail some more work...
{
"type": "entry",
"author": {
"name": "@starbreaker",
"url": "https://indieweb.social/@starbreaker",
"photo": null
},
"url": "https://indieweb.social/@starbreaker/110260956987929410",
"content": {
"html": "<p>I've been updating my site at <a href=\"https://starbreaker.org/\"><span>https://</span><span>starbreaker.org/</span><span></span></a> with <a href=\"https://indieweb.social/tags/IndieWeb\">#<span>IndieWeb</span></a> <a href=\"https://indieweb.social/tags/microformats\">#<span>microformats</span></a>.</p><p><a href=\"https://indieweb.social/tags/IndieAuth\">#<span>IndieAuth</span></a> for starbreaker.org works.</p><p>h-card is implemented. </p><p><a href=\"https://indiewebify.me/validate-h-card/?url=https%3A%2F%2Fstarbreaker.org%2F\"><span>https://</span><span>indiewebify.me/validate-h-card</span><span>/?url=https%3A%2F%2Fstarbreaker.org%2F</span></a></p><p>h-entry validation still needs a bit of work.</p><p><a href=\"https://indiewebify.me/validate-h-entry/?url=https%3A%2F%2Fstarbreaker.org%2Fblog%2Fspiral-architect%2Fchapter-003%2F\"><span>https://</span><span>indiewebify.me/validate-h-entr</span><span>y/?url=https%3A%2F%2Fstarbreaker.org%2Fblog%2Fspiral-architect%2Fchapter-003%2F</span></a></p><p>And I haven't gotten around to <a href=\"https://indieweb.social/tags/WebMentions\">#<span>WebMentions</span></a> yet, but there's a <a href=\"https://indieweb.social/tags/npm\">#<span>npm</span></a> package I can run on one of my machines at home as a cron job to check my <a href=\"https://indieweb.social/tags/RSS\">#<span>RSS</span></a> feed and send them. Receiving them will entail some more work...</p>",
"text": "I've been updating my site at https://starbreaker.org/ with #IndieWeb #microformats.#IndieAuth for starbreaker.org works.h-card is implemented. https://indiewebify.me/validate-h-card/?url=https%3A%2F%2Fstarbreaker.org%2Fh-entry validation still needs a bit of work.https://indiewebify.me/validate-h-entry/?url=https%3A%2F%2Fstarbreaker.org%2Fblog%2Fspiral-architect%2Fchapter-003%2FAnd I haven't gotten around to #WebMentions yet, but there's a #npm package I can run on one of my machines at home as a cron job to check my #RSS feed and send them. Receiving them will entail some more work..."
},
"published": "2023-04-25T18:51:24+00:00",
"post-type": "note",
"_id": "36785678",
"_source": "7235",
"_is_read": false
}
{
"type": "entry",
"author": {
"name": "@midzer",
"url": "https://chaos.social/@midzer",
"photo": null
},
"url": "https://chaos.social/@midzer/110258382836995928",
"content": {
"html": "<p><span class=\"h-card\"><a class=\"u-url\" href=\"https://sueden.social/@kojote\">@<span>kojote</span></a></span> Long live the <a href=\"https://chaos.social/tags/indieweb\">#<span>indieweb</span></a></p>",
"text": "@kojote Long live the #indieweb"
},
"published": "2023-04-25T07:56:46+00:00",
"post-type": "note",
"_id": "36772895",
"_source": "7235",
"_is_read": false
}
I decided to show a little love to my venue pages after reading Tantek’s post about venues and reviews.
As part of keeping track of the events I attend, I create a venue page and link the event to it. The venue page previously would only show the name, address, and link. I updated it to also show a list of past events so it’s easier to see at a glance and navigate between them.
Example: Soda Bar, San Diego, CA
{
"type": "entry",
"published": "2023-04-24 17:47-0700",
"url": "https://gregorlove.com/2023/04/i-decided-to-show/",
"category": [
"indieweb"
],
"content": {
"text": "I decided to show a little love to my venue pages after reading Tantek\u2019s post about venues and reviews.\n\nAs part of keeping track of the events I attend, I create a venue page and link the event to it. The venue page previously would only show the name, address, and link. I updated it to also show a list of past events so it\u2019s easier to see at a glance and navigate between them.\n\nExample: Soda Bar, San Diego, CA",
"html": "<p>I decided to show a little love to my venue pages after reading <a class=\"h-card\" href=\"https://tantek.com\">Tantek</a>\u2019s <a href=\"http://tantek.com/2023/114/t1/venues-reviews-personal-pages\">post about venues and reviews</a>.</p>\n\n<p>As part of keeping track of the events I attend, I create a venue page and link the event to it. The venue page previously would only show the name, address, and link. I updated it to also show a list of past events so it\u2019s easier to see at a glance and navigate between them.</p>\n\n<p>Example: <a href=\"https://gregorlove.com/venues/soda-bar/\">Soda Bar, San Diego, CA</a></p>"
},
"author": {
"type": "card",
"name": "gRegor Morrill",
"url": "https://gregorlove.com/",
"photo": "https://gregorlove.com/site/assets/files/6268/profile-2021-square.300x0.jpg"
},
"post-type": "note",
"_id": "36770223",
"_source": "179",
"_is_read": false
}
I decided to show a little love to my venue pages after reading Tantek’s post about venues and reviews.
As part of keeping track of the events I attend, I create a venue page and link the event to it. The venue page previously would only show the name, address, and link. I updated it to also show a list of past events so it’s easier to see at a glance and navigate between them.
Example: Soda Bar, San Diego, CA
{
"type": "entry",
"published": "2023-04-24 17:47-0700",
"url": "https://gregorlove.com/2023/04/i-decided-to-show/",
"category": [
"indieweb"
],
"content": {
"text": "I decided to show a little love to my venue pages after reading Tantek\u2019s post about venues and reviews.\n\nAs part of keeping track of the events I attend, I create a venue page and link the event to it. The venue page previously would only show the name, address, and link. I updated it to also show a list of past events so it\u2019s easier to see at a glance and navigate between them.\n\nExample: Soda Bar, San Diego, CA",
"html": "<p>I decided to show a little love to my venue pages after reading <a class=\"h-card\" href=\"https://tantek.com\">Tantek</a>\u2019s <a href=\"http://tantek.com/2023/114/t1/venues-reviews-personal-pages\">post about venues and reviews</a>.</p>\n\n<p>As part of keeping track of the events I attend, I create a venue page and link the event to it. The venue page previously would only show the name, address, and link. I updated it to also show a list of past events so it\u2019s easier to see at a glance and navigate between them.</p>\n\n<p>Example: <a href=\"https://gregorlove.com/venues/soda-bar/\">Soda Bar, San Diego, CA</a></p>"
},
"author": {
"type": "card",
"name": "gRegor Morrill",
"url": "https://gregorlove.com/",
"photo": "https://gregorlove.com/site/assets/files/6268/profile-2021-square.300x0.jpg"
},
"post-type": "note",
"_id": "36769821",
"_source": "95",
"_is_read": false
}
{
"type": "entry",
"author": {
"name": "@pablo",
"url": "https://social.lifeofpablo.com/@pablo",
"photo": null
},
"url": "https://social.lifeofpablo.com/@pablo/110256361359106763",
"content": {
"html": "<p>Here\u2019s my latest blog post on setting up Vouch Proxy to add OAuth to your website and services using <a href=\"https://social.lifeofpablo.com/tags/Google\">#<span>Google</span></a>.</p><p><a href=\"https://lifeofpablo.com/blog/setting-up-vouch-proxy-using-nginx\"><span>https://</span><span>lifeofpablo.com/blog/setting-u</span><span>p-vouch-proxy-using-nginx</span></a></p><p><a href=\"https://social.lifeofpablo.com/tags/vouch\">#<span>vouch</span></a> <a href=\"https://social.lifeofpablo.com/tags/vouchproxy\">#<span>vouchproxy</span></a> <a href=\"https://social.lifeofpablo.com/tags/sso\">#<span>sso</span></a> <a href=\"https://social.lifeofpablo.com/tags/oauth\">#<span>oauth</span></a> <a href=\"https://social.lifeofpablo.com/tags/blog\">#<span>blog</span></a> <a href=\"https://social.lifeofpablo.com/tags/indieweb\">#<span>indieweb</span></a> <a href=\"https://social.lifeofpablo.com/tags/tech\">#<span>tech</span></a> <a href=\"https://social.lifeofpablo.com/tags/opensource\">#<span>opensource</span></a></p>",
"text": "Here\u2019s my latest blog post on setting up Vouch Proxy to add OAuth to your website and services using #Google.https://lifeofpablo.com/blog/setting-up-vouch-proxy-using-nginx#vouch #vouchproxy #sso #oauth #blog #indieweb #tech #opensource"
},
"published": "2023-04-24T23:22:40+00:00",
"post-type": "note",
"_id": "36767463",
"_source": "7235",
"_is_read": false
}
{
"type": "entry",
"author": {
"name": "@pablo",
"url": "https://social.lifeofpablo.com/@pablo",
"photo": null
},
"url": "https://social.lifeofpablo.com/@pablo/110256225731264242",
"content": {
"html": "<p>Here's my latest blog post on setting up Vouch Proxy to add OAuth to your website and services using <a href=\"https://social.lifeofpablo.com/tags/Google\">#<span>Google</span></a>.</p><p><a href=\"https://lifeofpablo.com/blog/setting-up-vouch-proxy-using-nginx\"><span>https://</span><span>lifeofpablo.com/blog/setting-u</span><span>p-vouch-proxy-using-nginx</span></a></p><p><a href=\"https://social.lifeofpablo.com/tags/vouch\">#<span>vouch</span></a> <a href=\"https://social.lifeofpablo.com/tags/vouch\">#<span>vouch</span></a>-proxy <a href=\"https://social.lifeofpablo.com/tags/sso\">#<span>sso</span></a> <a href=\"https://social.lifeofpablo.com/tags/oauth\">#<span>oauth</span></a> <a href=\"https://social.lifeofpablo.com/tags/blog\">#<span>blog</span></a> <a href=\"https://social.lifeofpablo.com/tags/indieweb\">#<span>indieweb</span></a> <a href=\"https://social.lifeofpablo.com/tags/tech\">#<span>tech</span></a> <a href=\"https://social.lifeofpablo.com/tags/opensource\">#<span>opensource</span></a></p>",
"text": "Here's my latest blog post on setting up Vouch Proxy to add OAuth to your website and services using #Google.https://lifeofpablo.com/blog/setting-up-vouch-proxy-using-nginx#vouch #vouch-proxy #sso #oauth #blog #indieweb #tech #opensource"
},
"published": "2023-04-24T22:48:11+00:00",
"post-type": "note",
"_id": "36766608",
"_source": "7235",
"_is_read": false
}
🌱 I have long been a fan of @Foursquare.com and @Swarmapp.com, having created many venues, posted many tips, and (checks profile) over 45,000 checkins. I recently joined @happycow.net and before I start posting new vegan (friendly) venues or reviews there, I really need to figure out my own personal site venue pages (including URL design) and review posts design and authoring workflow.
I’m pretty sure I can and should post h-review posts as a variant of articles (with usual h-entry markup) with an explicit article name, since most review destinations request a title (name) for the review (e.g. HappyCow, TripAdvisor), and for others with only review text (e.g. Google Maps), I can include the name at the start.
Different review destinations have different text requirements (minimum and/or maximum lengths), and I’ll take time to document those first.
The first destination I’ll likely try automatically syndicating to is a site created by #IndieWeb community member @jamesg.blog (@capjamesg@indieweb.social): @breakfastand.coffee
It’s still quite new, but the thing that makes Breakfast & Coffee innovative and unique is that it encourages you to post your venue (e.g. cafe) description or review on your own site with a meaningful slug, link to https://breakfastand.coffee/ and then send a Webmention to indicate that you’d like to syndicate your venue or review into Breakfast & Coffee, like into an aggregator.
Before I get to that point however, I feel there’s quite a few challenges in publishing a “decent” restaurant / cafe venue page, because there really is a dearth of good examples of doing so with simple semantic HTML + CSS. You really don’t need JS to post info about a restaurant.
Setting aside the economic / intermediation challenges of "delivery apps" for now, people really want a few simple things from a restaurant site / page that could all be marked up with simple semantic HTML (thus resulting in good web search rankings) and styled in a quickly readable and mobile-friendly way.
* hours open (perhaps kitchen hours if different)
* location (address that links to a map UI or map embed w/o cookies/tracking)
* nearest bus/tram/rail stop
* payment restrictions (e.g. if only cash, or only credit) or options if you prefer
* contact info (including a note about catering if that’s an option)
* links to social media profiles
* links to restaurant review sites/aggregator pages (e.g. venue permalink on Google Maps, TripAdvisor, Foursquare, Swarm, HappyCow)
* menu with item name, description, price, optional-thumbnail, and dietary/allergy notations
No you really don’t need the full mess of made-up things at schema-org.
The community at OpenStreetMap has done A LOT (most? nearly all?) of the work figuring out the ways to express the above types of information, e.g.:
https://wiki.openstreetmap.org/wiki/Key:opening_hours
Yet has anyone actually seen a simple semantic HTML page that publishes this kind of information?
I’ve web searched many search terms and phrases and found nothing good.
Stylistically dated templates for sale. Examples with numerous unnecessary scripts (no your typical user does not care about your clever animated 3D-carousel of pretty photos, certainly not waiting for a megabyte of framework scripts for it). Something built on Bootstrap, unnecessary for today’s mobile-friendly HTML+CSS.
I did find one (ONE) blog post from 2007 (those were the days) for semantic markup for a restaurant menu: https://jonchristopher.us/blog/a-semantic-breakdown-of-restaurant-menus/
Unless I find an existing solution soon, I’m going to create something from scratch with h-card (since a restaurant is an organization / venue) and add semantic HTML & class names for various fields, re-using from OpenStreetMap Keys whenever possible.
That leaves the URL design, where to publish my restaurant pages on my own site, and rather than rethink it, I will likely go with what I decided in my Whistle short URL design¹ many years ago, which is /v/ at the top level of my site, followed by a slug of my short name for the venue. This way I can play with static HTML pages there, with a shared style sheet in that same directory, without impacting anything else on my site.
I have some other thoughts around iconography for various diet preferences / allergen warnings for menu items that I’ve tried (or considered), though perhaps I’ll leave those for another post.
Or maybe I’ll braindump them now, however incomplete, to see if they resonate or anyone has better suggestions (restaurants and menus really have no standard for these)
🌱 vegan & gluten-free
🌱🌾 vegan + gluten
🌱🥜 vegan + nuts
🌱🍫 vegan + chocolate
🌱🍯 vegetarian (has honey)
🌱🧈 vegetarian (has butter)
🌱🥛 vegetarian (has milk, cream, or yogurt)
🌱🧀 vegetarian (has cheese)
🌱🥚 vegetarian (has egg)
with combinations as necessary.
For example, a breakfast sandwich at Devil’s Teeth Bakery²:
* Regular Breakfast Sandwich (no bacon!) $10.00 🌱🌾🧈🧀🥚
Or a chocolate croissant at Arsicault³:
* Chocolate Croissant $5.75 🌱🌾🧈🍫
Non-vegetarian items would omit the plant 🌱 icon/emoji, but could still include allergen icons.
If you are posting restaurants (or any other venues) to your personal site, please add a few of their permalinks to the IndieWeb Examples here: https://indieweb.org/venue#Indieweb_Examples
This is day 40 of #100DaysOfIndieWeb. #100Days
← Day 39: https://tantek.com/2023/112/t2/account-migration-post-blog-archive-format
→ 🔮
Glossary
article
https://indieweb.org/article
checkin
https://indieweb.org/checkin
h-card
https://microformats.org/wiki/h-card
h-entry
https://microformats.org/wiki/h-entry
h-review
https://microformats.org/wiki/h-review
POSSE
https://indieweb.org/POSSE
review
https://indieweb.org/review
URL design
https://indieweb.org/URL_design
venue
https://indieweb.org/venue
References
¹ https://tantek.com/w/Whistle#design
² https://www.devilsteethbakingcompany.com/menu
³ https://arsicault-bakery.com/menus
{
"type": "entry",
"author": {
"name": "#indieweb",
"url": "https://mastodon.social/tags/indieweb",
"photo": null
},
"url": "https://fed.brid.gy/r/https://tantek.com/2023/114/t1/venues-reviews-personal-pages",
"content": {
"html": "\ud83c\udf31 I have long been a fan of <a href=\"https://Foursquare.com\">@Foursquare.com</a> and <a href=\"https://Swarmapp.com\">@Swarmapp.com</a>, having created many venues, posted many tips, and (checks profile) over 45,000 checkins. I recently joined <a href=\"https://happycow.net\">@happycow.net</a> and before I start posting new vegan (friendly) venues or reviews there, I really need to figure out my own personal site venue pages (including URL design) and review posts design and authoring workflow.<br /><br />I\u2019m pretty sure I can and should post h-review posts as a variant of articles (with usual h-entry markup) with an explicit article name, since most review destinations request a title (name) for the review (e.g. HappyCow, TripAdvisor), and for others with only review text (e.g. Google Maps), I can include the name at the start.<br /><br />Different review destinations have different text requirements (minimum and/or maximum lengths), and I\u2019ll take time to document those first.<br /><br />The first destination I\u2019ll likely try automatically syndicating to is a site created by <a href=\"https://indieweb.social/tags/IndieWeb\">#<span class=\"p-category\">IndieWeb</span></a> community member <a href=\"https://jamesg.blog\">@jamesg.blog</a> (<a href=\"https://indieweb.social/@capjamesg\">@capjamesg@indieweb.social</a>): <a href=\"https://breakfastand.coffee\">@breakfastand.coffee</a><br /><br />It\u2019s still quite new, but the thing that makes Breakfast & Coffee innovative and unique is that it encourages you to post your venue (e.g. cafe) description or review on your own site with a meaningful slug, link to <a href=\"https://breakfastand.coffee/\">https://breakfastand.coffee/</a> and then send a Webmention to indicate that you\u2019d like to syndicate your venue or review into Breakfast & Coffee, like into an aggregator.<br /><br />Before I get to that point however, I feel there\u2019s quite a few challenges in publishing a \u201cdecent\u201d restaurant / cafe venue page, because there really is a dearth of good examples of doing so with simple semantic HTML + CSS. You really don\u2019t need JS to post info about a restaurant.<br /><br />Setting aside the economic / intermediation challenges of \"delivery apps\" for now, people really want a few simple things from a restaurant site / page that could all be marked up with simple semantic HTML (thus resulting in good web search rankings) and styled in a quickly readable and mobile-friendly way.<br /><br />* hours open (perhaps kitchen hours if different)<br />* location (address that links to a map UI or map embed w/o cookies/tracking)<br />* nearest bus/tram/rail stop<br />* payment restrictions (e.g. if only cash, or only credit) or options if you prefer<br />* contact info (including a note about catering if that\u2019s an option)<br />* links to social media profiles<br />* links to restaurant review sites/aggregator pages (e.g. venue permalink on Google Maps, TripAdvisor, Foursquare, Swarm, HappyCow)<br />* menu with item name, description, price, optional-thumbnail, and dietary/allergy notations<br /><br />No you really don\u2019t need the full mess of made-up things at schema-org.<br /><br />The community at OpenStreetMap has done A LOT (most? nearly all?) of the work figuring out the ways to express the above types of information, e.g.:<br /><br /><a href=\"https://wiki.openstreetmap.org/wiki/Key:opening_hours\">https://wiki.openstreetmap.org/wiki/Key:opening_hours</a><br /><br />Yet has anyone actually seen a simple semantic HTML page that publishes this kind of information? <br /><br />I\u2019ve web searched many search terms and phrases and found nothing good. <br /><br />Stylistically dated templates for sale. Examples with numerous unnecessary scripts (no your typical user does not care about your clever animated 3D-carousel of pretty photos, certainly not waiting for a megabyte of framework scripts for it). Something built on Bootstrap, unnecessary for today\u2019s mobile-friendly HTML+CSS.<br /><br />I did find one (ONE) blog post from 2007 (those were the days) for semantic markup for a restaurant menu: <a href=\"https://jonchristopher.us/blog/a-semantic-breakdown-of-restaurant-menus/\">https://jonchristopher.us/blog/a-semantic-breakdown-of-restaurant-menus/</a> <br /><br />Unless I find an existing solution soon, I\u2019m going to create something from scratch with h-card (since a restaurant is an organization / venue) and add semantic HTML & class names for various fields, re-using from OpenStreetMap Keys whenever possible.<br /><br />That leaves the URL design, where to publish my restaurant pages on my own site, and rather than rethink it, I will likely go with what I decided in my Whistle short URL design\u00b9 many years ago, which is /v/ at the top level of my site, followed by a slug of my short name for the venue. This way I can play with static HTML pages there, with a shared style sheet in that same directory, without impacting anything else on my site.<br /><br />I have some other thoughts around iconography for various diet preferences / allergen warnings for menu items that I\u2019ve tried (or considered), though perhaps I\u2019ll leave those for another post. <br /><br />Or maybe I\u2019ll braindump them now, however incomplete, to see if they resonate or anyone has better suggestions (restaurants and menus really have no standard for these)<br /><br />\ud83c\udf31 vegan & gluten-free<br />\ud83c\udf31\ud83c\udf3e vegan + gluten<br />\ud83c\udf31\ud83e\udd5c vegan + nuts<br />\ud83c\udf31\ud83c\udf6b vegan + chocolate<br />\ud83c\udf31\ud83c\udf6f vegetarian (has honey)<br />\ud83c\udf31\ud83e\uddc8 vegetarian (has butter)<br />\ud83c\udf31\ud83e\udd5b vegetarian (has milk, cream, or yogurt)<br />\ud83c\udf31\ud83e\uddc0 vegetarian (has cheese)<br />\ud83c\udf31\ud83e\udd5a vegetarian (has egg)<br /><br />with combinations as necessary. <br /><br />For example, a breakfast sandwich at Devil\u2019s Teeth Bakery\u00b2:<br />* Regular Breakfast Sandwich (no bacon!) $10.00 \ud83c\udf31\ud83c\udf3e\ud83e\uddc8\ud83e\uddc0\ud83e\udd5a<br /><br />Or a chocolate croissant at Arsicault\u00b3:<br />* Chocolate Croissant $5.75 \ud83c\udf31\ud83c\udf3e\ud83e\uddc8\ud83c\udf6b<br /><br />Non-vegetarian items would omit the plant \ud83c\udf31 icon/emoji, but could still include allergen icons.<br /><br />If you are posting restaurants (or any other venues) to your personal site, please add a few of their permalinks to the IndieWeb Examples here: <a href=\"https://indieweb.org/venue#Indieweb_Examples\">https://indieweb.org/venue#Indieweb_Examples</a><br /><br /><br />This is day 40 of <a href=\"https://indieweb.social/tags/100DaysOfIndieWeb\">#<span class=\"p-category\">100DaysOfIndieWeb</span></a>. <a href=\"https://indieweb.social/tags/100Days\">#<span class=\"p-category\">100Days</span></a><br /><br />\u2190 Day 39: <a href=\"https://tantek.com/2023/112/t2/account-migration-post-blog-archive-format\">https://tantek.com/2023/112/t2/account-migration-post-blog-archive-format</a><br />\u2192 \ud83d\udd2e<br /><br /><br />Glossary<br /><br />article<br />\u00a0<a href=\"https://indieweb.org/article\">https://indieweb.org/article</a><br />checkin<br />\u00a0<a href=\"https://indieweb.org/checkin\">https://indieweb.org/checkin</a><br />h-card<br />\u00a0<a href=\"https://microformats.org/wiki/h-card\">https://microformats.org/wiki/h-card</a><br />h-entry<br />\u00a0<a href=\"https://microformats.org/wiki/h-entry\">https://microformats.org/wiki/h-entry</a><br />h-review<br />\u00a0<a href=\"https://microformats.org/wiki/h-review\">https://microformats.org/wiki/h-review</a><br />POSSE<br />\u00a0<a href=\"https://indieweb.org/POSSE\">https://indieweb.org/POSSE</a><br />review <br />\u00a0<a href=\"https://indieweb.org/review\">https://indieweb.org/review</a><br />URL design<br />\u00a0<a href=\"https://indieweb.org/URL_design\">https://indieweb.org/URL_design</a><br />venue<br />\u00a0<a href=\"https://indieweb.org/venue\">https://indieweb.org/venue</a><br /><br />References<br /><br />\u00b9 <a href=\"https://tantek.com/w/Whistle#design\">https://tantek.com/w/Whistle#design</a> <br />\u00b2 <a href=\"https://www.devilsteethbakingcompany.com/menu\">https://www.devilsteethbakingcompany.com/menu</a><br />\u00b3 <a href=\"https://arsicault-bakery.com/menus\">https://arsicault-bakery.com/menus</a>",
"text": "\ud83c\udf31 I have long been a fan of @Foursquare.com and @Swarmapp.com, having created many venues, posted many tips, and (checks profile) over 45,000 checkins. I recently joined @happycow.net and before I start posting new vegan (friendly) venues or reviews there, I really need to figure out my own personal site venue pages (including URL design) and review posts design and authoring workflow.\n\nI\u2019m pretty sure I can and should post h-review posts as a variant of articles (with usual h-entry markup) with an explicit article name, since most review destinations request a title (name) for the review (e.g. HappyCow, TripAdvisor), and for others with only review text (e.g. Google Maps), I can include the name at the start.\n\nDifferent review destinations have different text requirements (minimum and/or maximum lengths), and I\u2019ll take time to document those first.\n\nThe first destination I\u2019ll likely try automatically syndicating to is a site created by #IndieWeb community member @jamesg.blog (@capjamesg@indieweb.social): @breakfastand.coffee\n\nIt\u2019s still quite new, but the thing that makes Breakfast & Coffee innovative and unique is that it encourages you to post your venue (e.g. cafe) description or review on your own site with a meaningful slug, link to https://breakfastand.coffee/ and then send a Webmention to indicate that you\u2019d like to syndicate your venue or review into Breakfast & Coffee, like into an aggregator.\n\nBefore I get to that point however, I feel there\u2019s quite a few challenges in publishing a \u201cdecent\u201d restaurant / cafe venue page, because there really is a dearth of good examples of doing so with simple semantic HTML + CSS. You really don\u2019t need JS to post info about a restaurant.\n\nSetting aside the economic / intermediation challenges of \"delivery apps\" for now, people really want a few simple things from a restaurant site / page that could all be marked up with simple semantic HTML (thus resulting in good web search rankings) and styled in a quickly readable and mobile-friendly way.\n\n* hours open (perhaps kitchen hours if different)\n* location (address that links to a map UI or map embed w/o cookies/tracking)\n* nearest bus/tram/rail stop\n* payment restrictions (e.g. if only cash, or only credit) or options if you prefer\n* contact info (including a note about catering if that\u2019s an option)\n* links to social media profiles\n* links to restaurant review sites/aggregator pages (e.g. venue permalink on Google Maps, TripAdvisor, Foursquare, Swarm, HappyCow)\n* menu with item name, description, price, optional-thumbnail, and dietary/allergy notations\n\nNo you really don\u2019t need the full mess of made-up things at schema-org.\n\nThe community at OpenStreetMap has done A LOT (most? nearly all?) of the work figuring out the ways to express the above types of information, e.g.:\n\nhttps://wiki.openstreetmap.org/wiki/Key:opening_hours\n\nYet has anyone actually seen a simple semantic HTML page that publishes this kind of information? \n\nI\u2019ve web searched many search terms and phrases and found nothing good. \n\nStylistically dated templates for sale. Examples with numerous unnecessary scripts (no your typical user does not care about your clever animated 3D-carousel of pretty photos, certainly not waiting for a megabyte of framework scripts for it). Something built on Bootstrap, unnecessary for today\u2019s mobile-friendly HTML+CSS.\n\nI did find one (ONE) blog post from 2007 (those were the days) for semantic markup for a restaurant menu: https://jonchristopher.us/blog/a-semantic-breakdown-of-restaurant-menus/ \n\nUnless I find an existing solution soon, I\u2019m going to create something from scratch with h-card (since a restaurant is an organization / venue) and add semantic HTML & class names for various fields, re-using from OpenStreetMap Keys whenever possible.\n\nThat leaves the URL design, where to publish my restaurant pages on my own site, and rather than rethink it, I will likely go with what I decided in my Whistle short URL design\u00b9 many years ago, which is /v/ at the top level of my site, followed by a slug of my short name for the venue. This way I can play with static HTML pages there, with a shared style sheet in that same directory, without impacting anything else on my site.\n\nI have some other thoughts around iconography for various diet preferences / allergen warnings for menu items that I\u2019ve tried (or considered), though perhaps I\u2019ll leave those for another post. \n\nOr maybe I\u2019ll braindump them now, however incomplete, to see if they resonate or anyone has better suggestions (restaurants and menus really have no standard for these)\n\n\ud83c\udf31 vegan & gluten-free\n\ud83c\udf31\ud83c\udf3e vegan + gluten\n\ud83c\udf31\ud83e\udd5c vegan + nuts\n\ud83c\udf31\ud83c\udf6b vegan + chocolate\n\ud83c\udf31\ud83c\udf6f vegetarian (has honey)\n\ud83c\udf31\ud83e\uddc8 vegetarian (has butter)\n\ud83c\udf31\ud83e\udd5b vegetarian (has milk, cream, or yogurt)\n\ud83c\udf31\ud83e\uddc0 vegetarian (has cheese)\n\ud83c\udf31\ud83e\udd5a vegetarian (has egg)\n\nwith combinations as necessary. \n\nFor example, a breakfast sandwich at Devil\u2019s Teeth Bakery\u00b2:\n* Regular Breakfast Sandwich (no bacon!) $10.00 \ud83c\udf31\ud83c\udf3e\ud83e\uddc8\ud83e\uddc0\ud83e\udd5a\n\nOr a chocolate croissant at Arsicault\u00b3:\n* Chocolate Croissant $5.75 \ud83c\udf31\ud83c\udf3e\ud83e\uddc8\ud83c\udf6b\n\nNon-vegetarian items would omit the plant \ud83c\udf31 icon/emoji, but could still include allergen icons.\n\nIf you are posting restaurants (or any other venues) to your personal site, please add a few of their permalinks to the IndieWeb Examples here: https://indieweb.org/venue#Indieweb_Examples\n\n\nThis is day 40 of #100DaysOfIndieWeb. #100Days\n\n\u2190 Day 39: https://tantek.com/2023/112/t2/account-migration-post-blog-archive-format\n\u2192 \ud83d\udd2e\n\n\nGlossary\n\narticle\n\u00a0https://indieweb.org/article\ncheckin\n\u00a0https://indieweb.org/checkin\nh-card\n\u00a0https://microformats.org/wiki/h-card\nh-entry\n\u00a0https://microformats.org/wiki/h-entry\nh-review\n\u00a0https://microformats.org/wiki/h-review\nPOSSE\n\u00a0https://indieweb.org/POSSE\nreview \n\u00a0https://indieweb.org/review\nURL design\n\u00a0https://indieweb.org/URL_design\nvenue\n\u00a0https://indieweb.org/venue\n\nReferences\n\n\u00b9 https://tantek.com/w/Whistle#design \n\u00b2 https://www.devilsteethbakingcompany.com/menu\n\u00b3 https://arsicault-bakery.com/menus"
},
"published": "2023-04-24T20:34:00+00:00",
"post-type": "note",
"_id": "36766609",
"_source": "7235",
"_is_read": false
}
🌱 I have long been a fan of @Foursquare.com and @Swarmapp.com, having created many venues, posted many tips, and (checks profile) over 45,000 checkins. I recently joined @happycow.net and before I start posting new vegan (friendly) venues or reviews there, I really need to figure out my own personal site venue pages (including URL design) and review posts design and authoring workflow.
I’m pretty sure I can and should post h-review posts as a variant of articles (with usual h-entry markup) with an explicit article name, since most review destinations request a title (name) for the review (e.g. HappyCow, TripAdvisor), and for others with only review text (e.g. Google Maps), I can include the name at the start.
Different review destinations have different text requirements (minimum and/or maximum lengths), and I’ll take time to document those first.
The first destination I’ll likely try automatically syndicating to is a site created by #IndieWeb community member @jamesg.blog (@capjamesg@indieweb.social): @breakfastand.coffee
It’s still quite new, but the thing that makes Breakfast & Coffee innovative and unique is that it encourages you to post your venue (e.g. cafe) description or review on your own site with a meaningful slug, link to https://breakfastand.coffee/ and then send a Webmention to indicate that you’d like to syndicate your venue or review into Breakfast & Coffee, like into an aggregator.
Before I get to that point however, I feel there’s quite a few challenges in publishing a “decent” restaurant / cafe venue page, because there really is a dearth of good examples of doing so with simple semantic HTML + CSS. You really don’t need JS to post info about a restaurant.
Setting aside the economic / intermediation challenges of "delivery apps" for now, people really want a few simple things from a restaurant site / page that could all be marked up with simple semantic HTML (thus resulting in good web search rankings) and styled in a quickly readable and mobile-friendly way.
* hours open (perhaps kitchen hours if different)
* location (address that links to a map UI or map embed w/o cookies/tracking)
* nearest bus/tram/rail stop
* payment restrictions (e.g. if only cash, or only credit) or options if you prefer
* contact info (including a note about catering if that’s an option)
* links to social media profiles
* links to restaurant review sites/aggregator pages (e.g. venue permalink on Google Maps, TripAdvisor, Foursquare, Swarm, HappyCow)
* menu with item name, description, price, optional-thumbnail, and dietary/allergy notations
No you really don’t need the full mess of made-up things at schema-org.
The community at OpenStreetMap has done A LOT (most? nearly all?) of the work figuring out the ways to express the above types of information, e.g.:
https://wiki.openstreetmap.org/wiki/Key:opening_hours
Yet has anyone actually seen a simple semantic HTML page that publishes this kind of information?
I’ve web searched many search terms and phrases and found nothing good.
Stylistically dated templates for sale. Examples with numerous unnecessary scripts (no your typical user does not care about your clever animated 3D-carousel of pretty photos, certainly not waiting for a megabyte of framework scripts for it). Something built on Bootstrap, unnecessary for today’s mobile-friendly HTML+CSS.
I did find one (ONE) blog post from 2007 (those were the days) for semantic markup for a restaurant menu: https://jonchristopher.us/blog/a-semantic-breakdown-of-restaurant-menus/
Unless I find an existing solution soon, I’m going to create something from scratch with h-card (since a restaurant is an organization / venue) and add semantic HTML & class names for various fields, re-using from OpenStreetMap Keys whenever possible.
That leaves the URL design, where to publish my restaurant pages on my own site, and rather than rethink it, I will likely go with what I decided in my Whistle short URL design¹ many years ago, which is /v/ at the top level of my site, followed by a slug of my short name for the venue. This way I can play with static HTML pages there, with a shared style sheet in that same directory, without impacting anything else on my site.
I have some other thoughts around iconography for various diet preferences / allergen warnings for menu items that I’ve tried (or considered), though perhaps I’ll leave those for another post.
Or maybe I’ll braindump them now, however incomplete, to see if they resonate or anyone has better suggestions (restaurants and menus really have no standard for these)
🌱 vegan & gluten-free
🌱🌾 vegan + gluten
🌱🥜 vegan + nuts
🌱🍫 vegan + chocolate
🌱🍯 vegetarian (has honey)
🌱🧈 vegetarian (has butter)
🌱🥛 vegetarian (has milk, cream, or yogurt)
🌱🧀 vegetarian (has cheese)
🌱🥚 vegetarian (has egg)
with combinations as necessary.
For example, a breakfast sandwich at Devil’s Teeth Bakery²:
* Regular Breakfast Sandwich (no bacon!) $10.00 🌱🌾🧈🧀🥚
Or a chocolate croissant at Arsicault³:
* Chocolate Croissant $5.75 🌱🌾🧈🍫
Non-vegetarian items would omit the plant 🌱 icon/emoji, but could still include allergen icons.
If you are posting restaurants (or any other venues) to your personal site, please add a few of their permalinks to the IndieWeb Examples here: https://indieweb.org/venue#Indieweb_Examples
This is day 40 of #100DaysOfIndieWeb. #100Days
← Day 39: https://tantek.com/2023/112/t2/account-migration-post-blog-archive-format
→ 🔮
Glossary
article
https://indieweb.org/article
checkin
https://indieweb.org/checkin
h-card
https://microformats.org/wiki/h-card
h-entry
https://microformats.org/wiki/h-entry
h-review
https://microformats.org/wiki/h-review
POSSE
https://indieweb.org/POSSE
review
https://indieweb.org/review
URL design
https://indieweb.org/URL_design
venue
https://indieweb.org/venue
References
¹ https://tantek.com/w/Whistle#design
² https://www.devilsteethbakingcompany.com/menu
³ https://arsicault-bakery.com/menus
{
"type": "entry",
"published": "2023-04-24 13:34-0700",
"url": "http://tantek.com/2023/114/t1/venues-reviews-personal-pages",
"category": [
"IndieWeb",
"100DaysOfIndieWeb",
"100Days"
],
"content": {
"text": "\ud83c\udf31 I have long been a fan of @Foursquare.com and @Swarmapp.com, having created many venues, posted many tips, and (checks profile) over 45,000 checkins. I recently joined @happycow.net and before I start posting new vegan (friendly) venues or reviews there, I really need to figure out my own personal site venue pages (including URL design) and review posts design and authoring workflow.\n\nI\u2019m pretty sure I can and should post h-review posts as a variant of articles (with usual h-entry markup) with an explicit article name, since most review destinations request a title (name) for the review (e.g. HappyCow, TripAdvisor), and for others with only review text (e.g. Google Maps), I can include the name at the start.\n\nDifferent review destinations have different text requirements (minimum and/or maximum lengths), and I\u2019ll take time to document those first.\n\nThe first destination I\u2019ll likely try automatically syndicating to is a site created by #IndieWeb community member @jamesg.blog (@capjamesg@indieweb.social): @breakfastand.coffee\n\nIt\u2019s still quite new, but the thing that makes Breakfast & Coffee innovative and unique is that it encourages you to post your venue (e.g. cafe) description or review on your own site with a meaningful slug, link to https://breakfastand.coffee/ and then send a Webmention to indicate that you\u2019d like to syndicate your venue or review into Breakfast & Coffee, like into an aggregator.\n\nBefore I get to that point however, I feel there\u2019s quite a few challenges in publishing a \u201cdecent\u201d restaurant / cafe venue page, because there really is a dearth of good examples of doing so with simple semantic HTML + CSS. You really don\u2019t need JS to post info about a restaurant.\n\nSetting aside the economic / intermediation challenges of \"delivery apps\" for now, people really want a few simple things from a restaurant site / page that could all be marked up with simple semantic HTML (thus resulting in good web search rankings) and styled in a quickly readable and mobile-friendly way.\n\n* hours open (perhaps kitchen hours if different)\n* location (address that links to a map UI or map embed w/o cookies/tracking)\n* nearest bus/tram/rail stop\n* payment restrictions (e.g. if only cash, or only credit) or options if you prefer\n* contact info (including a note about catering if that\u2019s an option)\n* links to social media profiles\n* links to restaurant review sites/aggregator pages (e.g. venue permalink on Google Maps, TripAdvisor, Foursquare, Swarm, HappyCow)\n* menu with item name, description, price, optional-thumbnail, and dietary/allergy notations\n\nNo you really don\u2019t need the full mess of made-up things at schema-org.\n\nThe community at OpenStreetMap has done A LOT (most? nearly all?) of the work figuring out the ways to express the above types of information, e.g.:\n\nhttps://wiki.openstreetmap.org/wiki/Key:opening_hours\n\nYet has anyone actually seen a simple semantic HTML page that publishes this kind of information? \n\nI\u2019ve web searched many search terms and phrases and found nothing good. \n\nStylistically dated templates for sale. Examples with numerous unnecessary scripts (no your typical user does not care about your clever animated 3D-carousel of pretty photos, certainly not waiting for a megabyte of framework scripts for it). Something built on Bootstrap, unnecessary for today\u2019s mobile-friendly HTML+CSS.\n\nI did find one (ONE) blog post from 2007 (those were the days) for semantic markup for a restaurant menu: https://jonchristopher.us/blog/a-semantic-breakdown-of-restaurant-menus/ \n\nUnless I find an existing solution soon, I\u2019m going to create something from scratch with h-card (since a restaurant is an organization / venue) and add semantic HTML & class names for various fields, re-using from OpenStreetMap Keys whenever possible.\n\nThat leaves the URL design, where to publish my restaurant pages on my own site, and rather than rethink it, I will likely go with what I decided in my Whistle short URL design\u00b9 many years ago, which is /v/ at the top level of my site, followed by a slug of my short name for the venue. This way I can play with static HTML pages there, with a shared style sheet in that same directory, without impacting anything else on my site.\n\nI have some other thoughts around iconography for various diet preferences / allergen warnings for menu items that I\u2019ve tried (or considered), though perhaps I\u2019ll leave those for another post. \n\nOr maybe I\u2019ll braindump them now, however incomplete, to see if they resonate or anyone has better suggestions (restaurants and menus really have no standard for these)\n\n\ud83c\udf31 vegan & gluten-free\n\ud83c\udf31\ud83c\udf3e vegan + gluten\n\ud83c\udf31\ud83e\udd5c vegan + nuts\n\ud83c\udf31\ud83c\udf6b vegan + chocolate\n\ud83c\udf31\ud83c\udf6f vegetarian (has honey)\n\ud83c\udf31\ud83e\uddc8 vegetarian (has butter)\n\ud83c\udf31\ud83e\udd5b vegetarian (has milk, cream, or yogurt)\n\ud83c\udf31\ud83e\uddc0 vegetarian (has cheese)\n\ud83c\udf31\ud83e\udd5a vegetarian (has egg)\n\nwith combinations as necessary. \n\nFor example, a breakfast sandwich at Devil\u2019s Teeth Bakery\u00b2:\n* Regular Breakfast Sandwich (no bacon!) $10.00 \ud83c\udf31\ud83c\udf3e\ud83e\uddc8\ud83e\uddc0\ud83e\udd5a\n\nOr a chocolate croissant at Arsicault\u00b3:\n* Chocolate Croissant $5.75 \ud83c\udf31\ud83c\udf3e\ud83e\uddc8\ud83c\udf6b\n\nNon-vegetarian items would omit the plant \ud83c\udf31 icon/emoji, but could still include allergen icons.\n\nIf you are posting restaurants (or any other venues) to your personal site, please add a few of their permalinks to the IndieWeb Examples here: https://indieweb.org/venue#Indieweb_Examples\n\n\nThis is day 40 of #100DaysOfIndieWeb. #100Days\n\n\u2190 Day 39: https://tantek.com/2023/112/t2/account-migration-post-blog-archive-format\n\u2192 \ud83d\udd2e\n\n\nGlossary\n\narticle\n\u00a0https://indieweb.org/article\ncheckin\n\u00a0https://indieweb.org/checkin\nh-card\n\u00a0https://microformats.org/wiki/h-card\nh-entry\n\u00a0https://microformats.org/wiki/h-entry\nh-review\n\u00a0https://microformats.org/wiki/h-review\nPOSSE\n\u00a0https://indieweb.org/POSSE\nreview \n\u00a0https://indieweb.org/review\nURL design\n\u00a0https://indieweb.org/URL_design\nvenue\n\u00a0https://indieweb.org/venue\n\nReferences\n\n\u00b9 https://tantek.com/w/Whistle#design \n\u00b2 https://www.devilsteethbakingcompany.com/menu\n\u00b3 https://arsicault-bakery.com/menus",
"html": "\ud83c\udf31 I have long been a fan of <a href=\"https://Foursquare.com\">@Foursquare.com</a> and <a href=\"https://Swarmapp.com\">@Swarmapp.com</a>, having created many venues, posted many tips, and (checks profile) over 45,000 checkins. I recently joined <a href=\"https://happycow.net\">@happycow.net</a> and before I start posting new vegan (friendly) venues or reviews there, I really need to figure out my own personal site venue pages (including URL design) and review posts design and authoring workflow.<br /><br />I\u2019m pretty sure I can and should post h-review posts as a variant of articles (with usual h-entry markup) with an explicit article name, since most review destinations request a title (name) for the review (e.g. HappyCow, TripAdvisor), and for others with only review text (e.g. Google Maps), I can include the name at the start.<br /><br />Different review destinations have different text requirements (minimum and/or maximum lengths), and I\u2019ll take time to document those first.<br /><br />The first destination I\u2019ll likely try automatically syndicating to is a site created by #<span class=\"p-category\">IndieWeb</span> community member <a href=\"https://jamesg.blog\">@jamesg.blog</a> (<a href=\"https://indieweb.social/@capjamesg\">@capjamesg@indieweb.social</a>): <a href=\"https://breakfastand.coffee\">@breakfastand.coffee</a><br /><br />It\u2019s still quite new, but the thing that makes Breakfast & Coffee innovative and unique is that it encourages you to post your venue (e.g. cafe) description or review on your own site with a meaningful slug, link to <a href=\"https://breakfastand.coffee/\">https://breakfastand.coffee/</a> and then send a Webmention to indicate that you\u2019d like to syndicate your venue or review into Breakfast & Coffee, like into an aggregator.<br /><br />Before I get to that point however, I feel there\u2019s quite a few challenges in publishing a \u201cdecent\u201d restaurant / cafe venue page, because there really is a dearth of good examples of doing so with simple semantic HTML + CSS. You really don\u2019t need JS to post info about a restaurant.<br /><br />Setting aside the economic / intermediation challenges of \"delivery apps\" for now, people really want a few simple things from a restaurant site / page that could all be marked up with simple semantic HTML (thus resulting in good web search rankings) and styled in a quickly readable and mobile-friendly way.<br /><br />* hours open (perhaps kitchen hours if different)<br />* location (address that links to a map UI or map embed w/o cookies/tracking)<br />* nearest bus/tram/rail stop<br />* payment restrictions (e.g. if only cash, or only credit) or options if you prefer<br />* contact info (including a note about catering if that\u2019s an option)<br />* links to social media profiles<br />* links to restaurant review sites/aggregator pages (e.g. venue permalink on Google Maps, TripAdvisor, Foursquare, Swarm, HappyCow)<br />* menu with item name, description, price, optional-thumbnail, and dietary/allergy notations<br /><br />No you really don\u2019t need the full mess of made-up things at schema-org.<br /><br />The community at OpenStreetMap has done A LOT (most? nearly all?) of the work figuring out the ways to express the above types of information, e.g.:<br /><br /><a href=\"https://wiki.openstreetmap.org/wiki/Key:opening_hours\">https://wiki.openstreetmap.org/wiki/Key:opening_hours</a><br /><br />Yet has anyone actually seen a simple semantic HTML page that publishes this kind of information? <br /><br />I\u2019ve web searched many search terms and phrases and found nothing good. <br /><br />Stylistically dated templates for sale. Examples with numerous unnecessary scripts (no your typical user does not care about your clever animated 3D-carousel of pretty photos, certainly not waiting for a megabyte of framework scripts for it). Something built on Bootstrap, unnecessary for today\u2019s mobile-friendly HTML+CSS.<br /><br />I did find one (ONE) blog post from 2007 (those were the days) for semantic markup for a restaurant menu: <a href=\"https://jonchristopher.us/blog/a-semantic-breakdown-of-restaurant-menus/\">https://jonchristopher.us/blog/a-semantic-breakdown-of-restaurant-menus/</a> <br /><br />Unless I find an existing solution soon, I\u2019m going to create something from scratch with h-card (since a restaurant is an organization / venue) and add semantic HTML & class names for various fields, re-using from OpenStreetMap Keys whenever possible.<br /><br />That leaves the URL design, where to publish my restaurant pages on my own site, and rather than rethink it, I will likely go with what I decided in my Whistle short URL design<a href=\"http://tantek.com/#t5QX1_note-1\">\u00b9</a> many years ago, which is /v/ at the top level of my site, followed by a slug of my short name for the venue. This way I can play with static HTML pages there, with a shared style sheet in that same directory, without impacting anything else on my site.<br /><br />I have some other thoughts around iconography for various diet preferences / allergen warnings for menu items that I\u2019ve tried (or considered), though perhaps I\u2019ll leave those for another post. <br /><br />Or maybe I\u2019ll braindump them now, however incomplete, to see if they resonate or anyone has better suggestions (restaurants and menus really have no standard for these)<br /><br />\ud83c\udf31 vegan & gluten-free<br />\ud83c\udf31\ud83c\udf3e vegan + gluten<br />\ud83c\udf31\ud83e\udd5c vegan + nuts<br />\ud83c\udf31\ud83c\udf6b vegan + chocolate<br />\ud83c\udf31\ud83c\udf6f vegetarian (has honey)<br />\ud83c\udf31\ud83e\uddc8 vegetarian (has butter)<br />\ud83c\udf31\ud83e\udd5b vegetarian (has milk, cream, or yogurt)<br />\ud83c\udf31\ud83e\uddc0 vegetarian (has cheese)<br />\ud83c\udf31\ud83e\udd5a vegetarian (has egg)<br /><br />with combinations as necessary. <br /><br />For example, a breakfast sandwich at Devil\u2019s Teeth Bakery<a href=\"http://tantek.com/#t5QX1_note-2\">\u00b2</a>:<br />* Regular Breakfast Sandwich (no bacon!) $10.00 \ud83c\udf31\ud83c\udf3e\ud83e\uddc8\ud83e\uddc0\ud83e\udd5a<br /><br />Or a chocolate croissant at Arsicault<a href=\"http://tantek.com/#t5QX1_note-3\">\u00b3</a>:<br />* Chocolate Croissant $5.75 \ud83c\udf31\ud83c\udf3e\ud83e\uddc8\ud83c\udf6b<br /><br />Non-vegetarian items would omit the plant \ud83c\udf31 icon/emoji, but could still include allergen icons.<br /><br />If you are posting restaurants (or any other venues) to your personal site, please add a few of their permalinks to the IndieWeb Examples here: <a href=\"https://indieweb.org/venue#Indieweb_Examples\">https://indieweb.org/venue#Indieweb_Examples</a><br /><br /><br />This is day 40 of #<span class=\"p-category\">100DaysOfIndieWeb</span>. #<span class=\"p-category\">100Days</span><br /><br />\u2190 Day 39: <a href=\"https://tantek.com/2023/112/t2/account-migration-post-blog-archive-format\">https://tantek.com/2023/112/t2/account-migration-post-blog-archive-format</a><br />\u2192 \ud83d\udd2e<br /><br /><br />Glossary<br /><br />article<br />\u00a0<a href=\"https://indieweb.org/article\">https://indieweb.org/article</a><br />checkin<br />\u00a0<a href=\"https://indieweb.org/checkin\">https://indieweb.org/checkin</a><br />h-card<br />\u00a0<a href=\"https://microformats.org/wiki/h-card\">https://microformats.org/wiki/h-card</a><br />h-entry<br />\u00a0<a href=\"https://microformats.org/wiki/h-entry\">https://microformats.org/wiki/h-entry</a><br />h-review<br />\u00a0<a href=\"https://microformats.org/wiki/h-review\">https://microformats.org/wiki/h-review</a><br />POSSE<br />\u00a0<a href=\"https://indieweb.org/POSSE\">https://indieweb.org/POSSE</a><br />review <br />\u00a0<a href=\"https://indieweb.org/review\">https://indieweb.org/review</a><br />URL design<br />\u00a0<a href=\"https://indieweb.org/URL_design\">https://indieweb.org/URL_design</a><br />venue<br />\u00a0<a href=\"https://indieweb.org/venue\">https://indieweb.org/venue</a><br /><br />References<br /><br /><a href=\"http://tantek.com/#t5QX1_ref-1\">\u00b9</a> <a href=\"https://tantek.com/w/Whistle#design\">https://tantek.com/w/Whistle#design</a> <br /><a href=\"http://tantek.com/#t5QX1_ref-2\">\u00b2</a> <a href=\"https://www.devilsteethbakingcompany.com/menu\">https://www.devilsteethbakingcompany.com/menu</a><br /><a href=\"http://tantek.com/#t5QX1_ref-3\">\u00b3</a> <a href=\"https://arsicault-bakery.com/menus\">https://arsicault-bakery.com/menus</a>"
},
"author": {
"type": "card",
"name": "Tantek \u00c7elik",
"url": "http://tantek.com/",
"photo": "https://aperture-media.p3k.io/tantek.com/acfddd7d8b2c8cf8aa163651432cc1ec7eb8ec2f881942dca963d305eeaaa6b8.jpg"
},
"post-type": "note",
"_id": "36766196",
"_source": "1",
"_is_read": false
}