Explore My Notes

Testing microformats | Microformats.io

Very useful! A service that can take any URL and output the parsed results as JSON, letting you quickly see your site as a machine would. Helped me catch that my rel=me links were duplicating themselves due to a difference in capitalisation on two of them 👍

📆 19 Jul 2020  | 🔗

  • Frontend
  • IndieWeb
  • microformats
  • parsing
  • testing
  • tool 

What we talk about when we say "webmentions" | Marty McGuire

These are all fantastic things that are built on top of Webmention but that I often feel are conflated with Webmention.

I'm in the middle of (ahem) adding Webmention support to this site, so I found this take on some of the many things that can mean by Marty pretty interesting, particularly as someone who (on first glance) envisioned a bold-new, Webmention-driven world and rapidly discovered it's a lot more nuanced than all that. His conclusion, though, feels like a particularly useful frame of reference when thinking about the technology:

Maybe Webmention can be thought of as less of a "building block" and more like a glue. You can do so many things with glue, like combining a bunch of planks into a table, or building a parade float sculpture with papier-mâché, or doctoring the photo in a passport!

You wouldn't call them all "glue".

Adding Lighthouse scores to my site's footer | Zach Leat

...as a performance advocate, I feel that it’s important to keep myself honest and to have some transparency behind the sites I build.

Using a combination of Speedlify and Google Lighthouse tool, Zach is able to display web performance scores in his footer, bespoke for each page. He seems to be doing so client-side, though I don't fully understand the reasoning. He's using 11ty, so there's a build process involved. Zach points out that the Lighthouse score would be "stale" if pulled in during build time but that doesn't feel right. I'd expect the Lighthouse score of a static page to be constant until that page was updated, which would require another build anyway. I guess if he's doing a lot with client-side JS that may not be the case 🤷‍♂️ I also admit that he is the web perf specialist and I am not, so I am likely missing something.

Either way, it's a cool feature and a neat example of API-driven, Jamstack goodness 👍

Preload page links on hover | instant.page

Gatsby's page-fetching is a feature I consider a double-edged sword (though I'll admit I also don't fully understand it 😅). On the one hand, I'm all for anything that decreases load time between pages on a site. On the other, pre-caching a bunch of content that the user may never need feels like an extremely wasteful practice. InstantPage takes a slightly different approach, instead triggering the page request when a link is hovered (or touched on mobile). In their estimation that can reduce latency by 100s of milliseconds, so we're not talking huge wins here, but a minor UX bump. Assuming the page weight added from the client-side JS doesn't offset it, of course...

Sneak peek at Sunlit 3.0 | Manton Reece

A new product aiming to be an "Instagram replacement" and photo-blogging tool from the creator of Micro.blog‽ Colour me intrigued! 🤔 Sunlit looks very nice, will be interested to see how it develops.

Isolate parts of a music track | Stems

Another really neat music-related tool, Stems claims to be able to split tracks into their various components e.g. drums, piano, vocals, instrumentals etc. It's something I've always thought should be possible, yet wouldn't have the first clue where to start, so definitely bookmarking for some experimentation.

Turn music into visual magic | Astrofox

Astrofox looks like a really clever video editor, developed specifically with the aim of creating videos for music playlists and personal tracks. Nothing too fancy, but lots of options to animate elements in time with the music tempo, and some surprisingly nuanced creative controls mean this looks really excellent. Definitely want to give it a whirl at some point.

Array functions and the rule of least power | Jesse Duffield

The various array methods in JavaScript can be thought of on a scale of power, or really flexibility. At the top end you've got the for loop, at the bottom the highly-specific functions .every and .some. Jesse makes the argument that you should always choose the least powerful option and I agree. The article is also just a generally excellent overview of array manipulation in JavaScript.

Circle chart showing how each array function can effectively be nested in those more powerful, with the for loop around them all, then "for each", reduce, both map and filter at the same level, and within filter find, then every and same together.
An incredibly useful reference guide to array functions.

📆 16 Jul 2020  | 🔗

  • JavaScript
  • array
  • function
  • map
  • reduce
  • filter
  • find
  • forEach
  • for loop
  • JavaScript 

Digital garden seedlings | Maggie Appleton

Whilst falling down the rabbit-hole of digital gardening I found some of Maggie's tweets incredibly insightful and useful, yet somehow totally missed her own digital garden (and her entire related repo of topics/content/examples) 🤦‍♂️ I love the layout (not just here, but across her whole site too) but the part that really captured my imagination was her use of emoji-tags to differentiate topics into one of seedling, budding, or evergreen. It's just a neat metaphor for a topic in the garden literally growing through tending and care: 🌱 -> 🌿 -> 🌳 (though I feel slightly miffed that she chose not to use an actual evergreen for that category: 🌲 😂).

📆 07 Jul 2020  | 🔗

  • Content Design
  • Web Design
  • emoji
  • digital garden
  • second brain
  • content design
  • web design
  • plants
  • categorisation
  • GitHub
  • example
  • repository 

Selfauth | GitHub

A self-hosted, open-source IndieAuth authorisation endpoint. I still find myself running in circles as to whether IndieAuth worries me or excites me, but I find this project a really neat piece of work by Zegnat 👍

📆 07 Jul 2020  | 🔗

  • Frontend
  • tool
  • IndieAuth
  • IndieWeb
  • self hosted
  • repository
  • open source 

Designing teamwork | Slack

Some really nice thoughts and a generally solid write up of the latest Slack redesign, which has been trialled/prototyped by a diverse "working group" of customers. Great to see a tech company realising that they've grown beyond the tech sector, too.

Though, what is up with this duck in their footer 🤔

Bottom corner of the Slack Design website where, after a second or two, a duck in sunglasses pops up, disappears, and then a second duck wearing a trenchcoat, hat, and sunglasses appears with the text "design is my passion".
I've tried searching but... 🦆

How knot to hang a painting | Tom Scott / Up & Atom

How to hang a painting from two points, where removing either point causes the hanging to fail. Weird puzzle, excellent explanation of the fundamentals of knot theory in mathematics.

Made By Me, But Made Possible By:

CMS:

Build: Gatsby

Deployment: GitHub

Hosting: Netlify

Connect With Me:

Twitter Twitter

Instagram Instragram

500px 500px

GitHub GitHub

Keep Up To Date:

All Posts RSS feed.

Articles RSS feed.

Journal RSS feed.

Notes RSS feed.