Notes

A collection of thoughts, ideas and everything else that doesn't need a lot of words.

Post type: share Color And Contrast

This is a nice and comprehensive article from Erik looking at color contrast ratios and explains how they work. Even if you don‘t care about the double contrast ticks in DevTools, it‘s worth a read. Guaranteed you‘ll learn a thing or two.

The color contrast ratios mentioned in WCAG can give you an insight in how usable your color palette is. How that works isn't very transparent. Learn more about how the color contrast ratio is determined, and what that means for you (and your palette).

Read the full article here

Post type: share The Provenance Framework

The open-source rulebook for communicating impact and avoiding greenwashing is a good resource to check against claims made by brands, which often are unclear to what e.g. fully recyclable, climate neutral, etc. actually encompass.

This rulebook helps brands make shopper-facing social and environmental impact claims with integrity. It can also help consumers to better understand what certain claims mean and how it can be measured.

Read about the framework or jump straight in.

Screenshot of the provenance.org website

Post type: share Kirby 3.6 Image Block with Support for webp, avif & Lazy Loading

I’ve been running the new Kirby 3.6 alpha for a few versions now and my favorite new feature is the support for AVIF and WEBP image generation. I’m a sucker for better web performance and finally finished my small improvement to the image block. This version of the image block outputs a picture element with an AVIF, WEBP and the original format image. The width and quality parameters are currently hard-coded at 1200px and 60%/55%, respectively, which works well for me so far. Mileage might vary.

For a future iteration I want to add a field for image width and quality, but for now this simple version will do.

Find the code in this Gist.

Post type: share Preload, Preconnect, Prefetch

Recently I’ve been playing around with preload and prefetch to optimise request priorities on uforepublic.com and the below snippet shall serve as a little future sneak peek for myself.

The excerpt below is from Prioritize resources on web.dev where you can find further information on these new link types and how to use them.

There are three different declarative solutions, which are all relatively new  types.

<link rel="preload"> informs the browser that a resource is needed as part of the current navigation, and that it should start getting fetched as soon as possible.
<link rel="preconnect"> informs the browser that your page intends to establish a connection to another origin, and that you'd like the process to start as soon as possible.
<link rel="prefetch"> is somewhat different from <link rel="preload"> and <link rel="preconnect">, in that it doesn't try to make something critical happen faster; instead, it tries to make something non-critical happen earlier, if there's a chance.

Post type: share Pantone Color Hong Kong Tram Green

Such a nice story in these rather depressing times.

Recently Pantone Color Institute collaborated with HK TRAMWAYS to create a new signature green shade that pays tribute to the Hong Kong Tram and its historical and cultural significance within Hong Kong.
The Pantone Colored HK Tram - Photo Credit: HK Tramways
HK Tram Green is a vivid and verdant deep grassy green shade that celebrates the heritage and cultural significance of HK Tramways and its unique distinction as a globally recognized iconic mobile landmark.
Pantone Chip Card for Hong Kong Tram Green

The full announcement can be found on the Pantone website.

Post type: share Going First

I can‘t remember where exactly I found this article, but I’m glad I did. It’s one of the better ones I have read in a while and I really like the idea of “going first”, it’s an interesting experiment and a nice thing to incorporate into daily life. I have started to (try) do this on a daily basis, yet as always it’s not easy to make it a new habit.

“I’ll go first. If I’m at checking out at the store I’ll say hello first, if I’m coming across someone making eye-contact I’ll smile first. Not all times, but most times — it comes in your favor.” — Gabrielle Reece

Give it a read here. It’s worth it.

The effect you have on others is one of the greatest gifts you can offer in life. Don’t waste it. Go first, take a leap. After all, when you go first, more than nothing can happen.

Post type: share The Performance Impact of Browser Extensions

An interesting look into the performance impact of browser extensions. It‘s been a known fact, but nevertheless good to see some real benchmarks and extensions which cause the most issues. After reading this, I deactivated some more which I will now only activate when needed, since I don't use them frequently enough—extensions on demand if you will.

Read the full article.

Post type: share Tool Tip: Renaming Files with Name Mangler on macOS

There are some tools in my box that have stayed with me over the years and I continue to keep using. I thought it might be a good idea to share these tools and what I use them for, since some people might find it beneficial, helpful, interesting. Here is the very first of my tool tips, as they will come in no particular order.

Whether it’s large batches or only a handful of files, renaming files is often necessary or other times simply a cosmetic duty.

NameMangler is a great tool that let’s you quickly rename files in various ways. The most notable options are Grep replacements, pre- and suffixing. It also allows you to chain different commands together, which can then be dragged to rearrange. A great tool for a small price that has really helped me out many times over and over.

Check it out here: https://manytricks.com/namemangler/

Screenshot of the Name Mangler User Interface
The simple user interface of Name Mangler

As pointed out after this post by Tom, macOS does have its own rename machine, apparently since 2015… I did not know! For further info on how that works, see osxdaily.com.

Post type: share Sans Bullshit Sans

Such a fantastic, fun idea, there should be more things like this. It also is a good reflection on how bullshit jargon made it into everyday life.

The font that replaces every buzzword by a Comic Sans-styled censorship bar.

Sans Bullshit Sans.

Post type: share Personality

As promised some time ago, I will publish all the drafts, which I have not finished or published before. This unpublished post was dated February 6th, 2020, which was shortly before I left for Phuket last year. In hindsight this is an interesting note to me, because I was already thinking about the ever-present design-sameness and a more creative direction for what we do. Read the draft for yourself:

This post got me thinking a little more about what a blog is and since it’s so personal, I think a blog has to also “be” and look more personal. I’ve been thinking about this for a quite some time, mainly with so much “sameness” out there. Over the months I have been changing a few things here and there, but it should probably be much more drastic changes to better reflect personality. It’s hard to do, but I will try to improve and change it over time more and more. It’ll be fully finished in infinity.

Post type: share Kirby 3.5.6

I eventually got around to update this site to Kirby 3.5.6. Not a huge update, but I like what came in the previous version 3.5.5. It allow setting the page cache expiry right from your controllers, which is quite a nice, new feature. Of course both versions came with fixes and other improvements.

Post type: share Kirby 3.5.4

Today I finally found the time to give this site a little love and updated to the latest version Kirby 3.5.4. This release is a security release, which luckily doesn't happen so often, but deserves to be installed for sure. I‘m posting this to mainly remind myself to write more again.

Post type: share Tweetbot Synch Issues

For the simple fact that this might help someone fix their issue, because I could not find anything current on the web this time: Simply turning iCloud off and on again in the iCloud settings on iOS fixed the Tweetbot synchronisation issue between macOS and iOS for me. Cheers and have a good day! ☀️

Post type: share How to Favicon in 2021

I’m a fan of simplicity and welcome ideas that decrease complexity instead of the other way around. Pretty sure we’ve all been in the situation of not knowing which icons to add when. Here’s the guide to “How to Favicon in 2021: Six files that fit most needs”. Enjoy!

Post type: share Geldingadalur Volcano Live Feed

I've been looking at this a few times over the last few days and the eruptions and the flow of lava are simply beautiful and fascinating.

A webcam is now broadcasting live from Fagradalsfjall, facing Geldingadalur, where a fissure eruption began last night.

Watch here.

Geldingadalur Volcano Live Feed
The view on the volcano at early sunrise

Post type: share Adventures in Typography

I really like the idea of this newsletter, "Adventures in Typography" by Robin Rendle. Anyone interested to learn things about, with and around typography should have a closer look.

A weekly love letter to the written word by Robin Rendle. Topics include: calligraphy, lettering, display type, micro type, books about fonts, type specimens, neon lights, posters, morse code, stamps, literature, web design, and books about seeds.

Have a look at the archives or sign up here.

Post type: share Coding Fonts

Every once in a while I do like to change my coding font, just to get a bit of a feeling of "new" into daily routines. Usually this happens when I come across a new typeface that I like, try it out and like right away.

Screenshot of Coding Fonts showing ont list and code preview of a font

Coding Fonts on CSS-Tricks and is a good resource with font choices, so we don't have to wait to come across a new find to change.

Post type: share The Webmentions Are Back

I finally found the time to update @sebastiangreger’s webmentions for Kirby 3. It’s been a pretty smooth process, including the migration, and it seems that everything works…

Post type: share Design Horoscopes

This is the best thing I have seen in a while, it made me laugh so hard. While this example might be on the other side of the extremes when it comes to what's possible with and on the web, I would love to see more of such things. Especially in times like these, it would be good to make more people laugh, be entertained or kept busy creating. Absolutely 💯

Enjoy a laugh with Pablito Planeta, Design Astrologist.