April 2020

My favourite git tool GitUp, which allows me to do everything with the keyboard and still has a UI has just received an update and if I had not read the release notes I wouldn't have known that now the "Fix double clicking title not expanding window" landed. I had already trained my muscle memory and would probably not have realized.

There is nothing new about websites being backwards compatible. The HMTL Design Principles from the W3C are from November 2007 and they are not outdated!

Jeremy Keith nailed it again:

While hunting for accessibility resources, especially the reasons why designs need to be flexible I came across this article Accessible CSS on WebAIM.org. And their warning sign just needs to be shown around the web even more.

I found a couple hints, but this one might be the best one. https://github.com/puppeteer/puppeteer/blob/master/docs/troubleshooting.md#running-puppeteer-in-docker I actually changed parts

You need to

I use docker images to provide the environment for development. My nodejs is installed only inside the docker image. That means I always map my working directory into the container. This means I don't need to send no build context to the docker deamon.

I still often type document.querySelector() or document.querySelectorAll() even though even before this was available in the browser the developer consoles, FireBugs or whatever they were called had a shorter version available $ and $$. Yep, it works almost exactly the same, just that one returns a NodeList the other an array. Just try it. It works in all browsers as far as I know, I tried Firefox, Safari, Chrome and Edge. See the image below for how it works in Firefox.

I always struggled with it. Actually I looked it up a couple days ago and until today I was under the assumption "than" was for time and ordering, I had been confused and wrong.

https://webaim.org/ with lots of interesting resources and stuff to learn.

I read the real book a long time ago, but I just moved this blog to use proper <aside>, <article> and alikes today, I had forgotten a lot. But I remember it being the best HTML(5) in depth I ever saw. https://diveinto.html5doctor.com/ a must read!

Various HTML validator I found:

Click below to see the code which creates this kinda dropdown, it is the <details> element.

Wondering how to layout and use <section>, <h1>, <h2>, etc. I came across the first place one should read on MDN Using HTML sections and outlines also very insightful and more specific is this on the W3C wiki HTML/Usage/Headings/Missing. If you have 27 minutes to learn how to use all those semantic tags watch Brian Haferkamp's Semantic Elements and Structure a very well explained video.

I read it multiple times already in Measure What Matters by John Doerr, that OKRs are flexible. I normally underline those things, but now I have to note it somewhere where I can find it again without physically needing the book. On page 54 he writes

I didn't know that for English "sources disagree on the details of capitalizing prepositions". I read so often "capitalize all words of four letters or more". What an arbitrary rule is that? Ok, I will try to follow this and capitalizing all "major words", they call them.
There are a couple (SEO) sites that capitalize your headline correctly, you'll find them when you need 'em.

TL;DR use any/all of docker system prune, docker container prune, docker image prune, docker volume prune or docker network prune to free the according space.

Run npm install <package>@latest to update to the latest version of a package, no matter the minor, major version, it always goes to the latest.

diff --recursive <dir1> <dir2> to diff the files and their contents in two directories I just needed to do some golden master tests after updating a dependency

MacOS: Woa, I didn't know you can take screenshots of windows with transparent backround by doing CMD+Shift+4 and then hitting the space bar. 🤯 pic.twitter.com/WjdV15q4H0

— Nikolai Onken (@nonken) April 21, 2020

When my build process slows down my work and I think about how to build just parts of a project instead of the entire project, my time is spent wrong. I should speed up the entire project's build process, not optimize for building parts. Read on about how I build, measured, sped up and will repeat for site-stitcher, the project that builds this site.

Uku creator of plausible.io had written a nice article on how to design, even though one is a miserable designer, as I am. A must read if you own the same skill deficiency ;).

I am a big fan of structured data and making the data we have on the web more accessible, easier to use, simply more worth it is a very useful thing. How useful is it investing in outlining your website's today? I found a couple articles and quotes on the web.

Having a useful and pleasant to read README does sometimes make a difference in deciding to spend more time with a package or project. The tips by James Scott really help, having a template like he provides is actually a really good idea. Thanks.

There is a uXSS bug in Chrome on iOS, which is actually a WebKit bug. But Chrome fixes it on iOS by crashing the browser, because this was the fastest way to fix it. Alright ...

TestStitcher can now not only handle one file but any number of files (see the commit that finished it) and show the tests in a structured way, see the README for all details.