Explore My Notes

Be the main character, but not the antagonist | TomSka

I'm a fan of TomSka. Have been for a long time. I did not expect to be pulling a quote from one of his 2023 "Last Month" vlogs on the nature of personal goals and relationships, but here we are. (I've tidied this up a little, as video narration does not immediately translate to written text.)

You need to be the main character in your own story. You need to advocate for yourself. You need to push yourself forward, towards your goals. Just keep your story moving, and keep it entertaining. Approach life like you are a protagonist; conduct yourself in a manner befitting a main character.

However, you also need to do this with the humility and understanding that you are still a side character in everyone else's story.

You need to figure out when this is a "you" episode. When it's a "you" episode – a key moment in your story, your plot – you need to be the main character. But when you're in someone else's episode, you're just a side character. You need to play a support role; maybe comic relief, maybe a love interest (if you're lucky).

Because if you try to bring too much main character energy into someone else's life, you become the antagonist, you become the bad guy. You're stealing the spotlight. You're making things all about you. And you're making their life harder.

Main character in your own life; support role in other people's.

A GitHub content editor | Prose.io

Prose is a service that connects with any GitHub repo you want, and then lets you edit Markdown and plain text files directly from a dedicated text editor. Particularly useful for people using GitHub as a static site host, as Prose can be used as a sort of CMS back-end for editing and creating new content.

Make any feed an RSS feed | RSS Anything

A clever service that takes any input URL and attempts to identify lists of links (i.e. a feed) and then convert this into an RSS feed that anyone can subscribe to. Great for pulling content out of newsletter archives, news websites, and even personal sites that don't have dedicated feeds (for whatever reason).

WikiFlix | Wikimedia

A Netflix-inspired UI for public domain films, animations, shorts, and similar media that the Wikimedia project has archived and catalogued in some way. Contains some real classics, including much of Buster Keaton's and Charlie Chaplin's films, one-offs like Nosferatu and Metropolis, and many of the first animations ever made for film. Also contains more modern shorts, mainly from YouTube.

Core web vitals reporting | Looker Studio

A semi-official reporting tool to interrogate trends in web technologies versus Core Web Vitals (including the upcoming INP metric). Things look particularly bad for React-based frameworks, but there's a lot more that can be dug into beyond those headlines.

Dark hotels

A simple mapping project that overlays light pollution data with available accommodation pulled from AirBnB and Booking.com, allowing you to find places to stay that will also be great for star gazing.

Making a digital shoebox | Henrique Dias

Henrique has added a "shoebox" section to their site; a kind of miscellaneous category to shove all of the articles, side projects, archives, and other assorted "extras" that you might want to use online. What a neat idea, and a nice real-world comparison.

It fills that niche space of things I have on this website, but don’t really fit any other category.

I feel particularly seen by this comment 😅:

I too keep around (shoe)boxes with the most random things.

Temperate trees and shrubs | Trees & Shrubs Online

A vast encyclopedia, free for all to use online, aiming to detail all woody plants that grow in temperate regions. Written by experts, it is the single largest horticultural work ever created, and is specifically designed to help amateurs better understand the trees in their backyard.

Root and branch | House & Garden

Notes from an interview of Dr. John Grimshaw, director of the Yorkshire Arboretum, on tree planting, climate pledges, and conservation, published in House & Garden September 2023.

On the issues with big-number charity tree-planting with no thought for where and how the trees are planted:

Just blindly planting thousands of trees to hit targets can end in disaster, as was shown by a scheme next to the A14 in Cambridgeshire, where 860,000 trees were planted, three-quarters of which died within a year of being put in the ground because of a lack of aftercare.

On the concerns of planting trees today that will die tomorrow, as the climate shifts:

People are being encouraged to plant native trees, but many of these are no longer thriving in our climate. We need to be looking ahead 40 or 50 years and thinking about what the climate will be like then... Choose native species that are growing successfully further south.

The many benefits of tree planting:

A good, healthy tree canopy helps the climate by moderating temperatures, reducing pollution, mitigating flooding and providing habitats for wildlife.

Make free stuff | Max Böck

A lovely argument for using the web to simply make stuff and then show other people, without entering into the hustle and grind of late-stage capitalism.

The idea that ownership fundamentally means that nobody else can have the same thing you have just doesn’t apply here. This is a world where anything can easily be copied a million times and distributed around the globe in a second. If that were possible in the real world, we’d call it Utopia.

Time to rethink mobile-first CSS? | A List Apart

An interesting look at whether the current mobile-first paradigm is problematic. Ultimately, the title feels a little like click-bait; to me the solution proposed remains mobile-first, but suggests some modern enhancements and some additional (and unrelated) changes to current common practices, such as splitting CSS bundles.

On using media-query ranges to "donut scope" styles for better maintainability:

To this end, closed media query ranges are our best friend. If we need to make a change to any given view, we make it in the CSS media query range that applies to the specific breakpoint.

.my-block { 
    padding: 20px; 
    @media (min-width: 768px) and (max-width: 1023.98px) { 
        padding: 40px; 
    } 
}
On splitting CSS into bundles for different viewport ranges:
With HTTP/2 and HTTP/3 now on the scene, the number of requests is no longer the big deal it used to be. This allows us to separate the CSS into multiple files by media query. The clear benefit of this is the browser can now request the CSS it currently needs with a higher priority than the CSS it doesn’t.
with the CSS separated into different files linked and marked up with the relevant media attribute, the browser can prioritize the files it currently needs.
<link href="default.css" rel="stylesheet">
<link href="mobile.css" media="screen and (max-width: 767.98px)" rel="stylesheet">
<link href="tablet.css" media="screen and (min-width: 768px) and (max-width: 1083.98px)" rel="stylesheet">