Guides
- In my apartment, I have some light switches that are in idiotically placed. I also have several lights I wish had more than one switch. So the fact that I can easily place switches wherever I want, by just sticking a little button to the wall (or whatever), is very nice. And so is the fact that it’s trivial to have one switch control several lights, or have several switches controlling one light.
- I want nothing to only be controllable by my phone. But I do think it’s nice that I can use it to control my lights ā even when I’m not home. I also like that I can create automations, like turning off the lights when I leave.
- I really, really like to vary the colour temperature of my lights throughout the day.
- quarters,
- halves,
- and wholes (not fullscreen mode).
- To protect the cards (kinda says so on the tin)
- To increase the sense of quality, much like component upgrades
- One million seconds ā 12 days
- One billion seconds ā 31 years
Game Changing CSS Trick (for Noobs Like Me)
OK, I just learned a brilliant CSS technique I wish I knew about much sooner! This is probably old news for most of you wizards out there - but maybe this little post can be useful for some fellow newbies?
This is one of my "Noob teaching noobs" posts. Some experts are excellent teachers - but not all. Hopefully, these posts can be helpful due to their layman nature, but please contact me if I'm misinforming!
Here are some examples of selectors I could see myself using:
h1 {}
-> Styling Header 1 (h1) elements.
h1:hover {}
-> Style when hovering h1.
h1::after {}
-> A pseudo-element (like a line) related to h1.
h1:hover::after {}
-> The pseudo-element when I hover over h1.
h1 a {}
-> A link (a) within an h1 element.
h1 a:hover {}
-> When I hover over one of those links.
.page-content h1:hover {}
-> When I hover an h1 that’s within .page-content.
Put into context, I could do:
š± Why Smart Bulbs > Smart Switches
I really like my smart light setup ā and later I will write a guide on how I set it up. (I promise!) But in this post, I want to explain why I think smart light sources are a better option than smart switches (with regular light sources).
(Click here to go to the TL;DR!)
Some notes on costs
Smart lights ain’t cheap. And while I will argue that I don’t think going for smart switches is that much cheaper than smart light sources ā my main focus is on what gives the best smart light experience. And then it’s up to each person to evaluate what feels “worth it”, or even possible, to them and their budgets.
I also think the experience is way better if you get the consistency of having (more or less) every light in your home be smart ā so keep that in mind as well. I’m not arguing against those who say “Yeah, I only wanted these four lights to be smart, and then it was cheaper to go for a couple of smart switches”. What I am arguing against is those who say going for smart switches is better than smart light sources ā and hopefully giving some valuable insights to those who haven’t decided yet.
Why smart lights at all, though?
To me, there are three main reasons (in no particular order):
The two approaches to smart lights
š± Some Quick Mastodon Client Reviews
One of my favourite things about Mastodon, is that, as opposed to most other social networks, the service is completely open for other developers to make their own clients. And this has lead to a remarkable ecosystem of third-party options.
Now the official ones, are pretty mediocre (especially the web app, IMO) ā but I like this prioritisation. They could’ve sacrificed precious dev time to make their own clients great ā but this would have to come at the expense of improving the core service. And the only thing we would gain, is “another great way to use Mastodon”.
“How good are the default apps?” is a far less important question than “How good are the best apps for Mastodon?”. Also, what’s a good app isn’t the same for everyone ā so why on earth should there only be one client (like Instagram, Facebook and, now, X)?
If you’re new (or old) to Mastodon ā don’t be afraid to test different clients! They can be used in complete parallel ā so you could just download a bunch on your phone, and log into each of them with your username. And then you could just “main” one of them for a couple of days (turning on notifications on that one, for instance), and then move to another one.
But let’s get to the main point: Some quick reviews of some of my favourite clients!
A Very Good All-Round Game Controller, With One Major Flaw (for Me)
A quick review of the 8BitDo Ultimate Bluetooth Controller
I mostly play boring strategy šļø games that are just as good to play with a trackpad as anything else.
But every so often, I’ll play something that’s best played with a controller. That’s usually on my Switch, where I’ve used the joy-cons with a charging grip ā but that’s never been great. Also, my joy-cons have started to driftā¦
So I wanted to buy a single controller that could fit all my use-cases, and my choice fell on the 8BitDo Ultimate Bluetooth Controller šļø. And it’s a great controller, with many smart features. But did you know that a controller can support 2.4 GHz, Bluetooth, Switch, PC, Steam Deck, Android, iOS and iPadOS, but not support macOS?? Well, I didn’t.
A Way To Get a Fancy Link Hover Effect
Jarrod, of (the great blog) HeyDingus.net, wanted to do something about the way his links appear on his website. He asked:
Since the first design of my site, Iāve stuck with blue text for my hyperlinks because that always seemed canonical with the web. Links = blue text, blue underline. But Iāve grown less certain with its readability with all that blue text interspersed. Iām considering a change. What do yāall think?
One thing he didn’t mention there, is that he also has a nice hover effect, that changes the underline to a gradient (that matches his logo and more) on hover.
My first idea for how to solve it sacrificed the gradient ā but that just wouldn’t do. But I think I found a pretty good solution in the end!
The solution and how to implement it
š± A Shortcut for lite-youtube-embed
YouTube embeds take up way too much on a site - so luckily someone has made lite-youtube-embed.
āRenders faster than a sneeze.ā
Provide videos with a supercharged focus on visual performance. This custom element renders just like the real thing but approximately 224Ć faster.
First you have to include some CSS and JS on your site. 1 And then when you want to embed a video, you could just add this piece to your post/page:
<lite-youtube videoid="CItvhGl__Mk" playlabel="Play: Beatenberg - Wheelbarrow (Official Music Video)"></lite-youtube>
This will embed the video, but over 200x faster - nice!
However, you have to manually add the videoid
and the video title.
And theyāve also made a variant named āPro-usage: load w/ JS deferred (aka progressive enhancement)ā, which I think is even more optimised. But then you have to add all of this:
<lite-youtube videoid="CItvhGl__Mk" params="controls=0&rel=0&enablejsapi=1" style="background-image: url('https://i.ytimg.com/vi/CItvhGl__Mk/sddefault.jpg');">
<a href="https://www.youtube.com/watch?v=CItvhGl__Mk" class="lty-playbtn" title="Play Beatenberg - Wheelbarrow (Official Music Video)">
<span class="lyt-visually-hidden">Play Video: Beatenberg - Wheelbarrow (Official Music Video)</span>
</a>
</lite-youtube>
Chromium and Nested Backdrop-Filters
If youāre like me, you sometimes get these small (often technical) problems, that you work on for so long ā and you refuse to surrender.
I had this with CSS a couple of months ago:
I had a menu, that had transparency and blur, and then I also had a submenu that I wanted to have the same. But the submenu just. wouldnāt. blur!
It works perfectly in Gecko and WebKit ā but after countless hours, I found the problem: If an element has a backdrop-filter, Chromium wonāt let its children have it as well. 1
I had to design around it, and moved on with my life.
A few moments laterā¦
I recently moved to Micro.blog. And one day I was scrolling down my timelineā¦
Then I opened the submenu:
There it was ā the same bug! Iām not alone!
The fix
š± A Good Way to Get Home Row Mods on a Mac
As part of my ergonomics voyage, Iāve been working on getting home row mods on my keyboard. This excellent guide provides tons of info on this, but the short version is this:
To contort your hands less when using modifiers (like shift and control), the letter keys on your home row serves double duty: Theyāre the letters if you tap them, but modifiers if you hold them.
Tapping vs holding
But whatās constitutes a tap and what constitutes a hold? Thatās the central question hereā¦
š± How I Manage Windows
Rafael Conde, posted on Mastodon today:
We’re sharing how we use the Desktop and how we size/position windows on our Macs on our work Slack and it’s absolute madness.
And, then followed it up with a poll:
Time to fess up, how do you primarily use windows “on your” Mac? Bonus points if you reply with a screenshot šø
ā Wherever the appear, I donāt know
ā Centered (think Apple marketing shot)
ā Fullscreen (as big as you can make them)
ā Tiled (in a grid, like taking up half the screen)
I, as many others, have strong feelings about this. And Iād love for this to become the next Ā«Default appsĀ»! So Iāll start.
Iām a big tiler.
I switch between my MacBooks 14 inch screen, and my Studio Displayās 27-inch screen. But no matter which Iām on, I move my apps around quite a lot, and almost always in
Here are some examples:
š± My Tech Setup
Iāll make separate posts for my software and bass guitar setups, but hereās my current tech hardware setup.
My Ergonomics Voyage: Part 1
Prologue, and the first steps
Iāve been a nerd my entire 34-year-long life. So naturally, much of it has been spent in front of computers using keyboards, and Iāve never experienced any discomfort related to this.1
I donāt know if itās due to my age, or just the fact that Iāve worked even more than usual on keyboards, but lately, Iāve started to notice discomfort. Especially in my left hand, but a bit in my right as well. Luckily, thereās nothing anywhere else, and itās not that bad. But I want to take action to try to stay ahead of it.
A bit about my current situation
The last couple of years, Iāve been working mostly in my small home office, which was OK, but not great. Just a couple of weeks ago, I finally got my own (external) office, so the situation has improved. However, Iāve been stupid, and also worked quite a bit on my laptop on our kitchen table lately.
Hereās my current office setup:
Good things about my setup
Pedal tuners and product design
Firstly, sorry about caring a bit too much about guitar tuners. You see, as a side gig, I help people with their pedalboards (especially people using multiple guitars on stage), and I often recommend that they get a new tuner. But no tuners are exactly like I want!
While this post is mostly hard core nerd out on pedal tuners, there are also some comments on product design in general. Letās go!
A new product series gives (false) hope
I prefer always-on tuners that you mute elsewhere (volume pedal or otherwise), and this makes foot-switches redundant. That’s why I like the idea behind Boss TU3-S.
So, when I saw the new(ish) Korg X tuners, I was stoked ā especially for the XS. The pedal to display size ratio is great, the switch design is cool, and I like that it’s more squared off than your typical mini pedal. This allows it to fit into odd slots on pedalboards.
š± Guide to card sleeves
Ā«Why?Ā»
Card protectors, or sleeves, are perhaps the most common accessory for games. There are two main reasons for sleeving your games:
The protection part is especially important if the cards are of high value and/or gets shuffled a lot. Both are true with most collectable card games (CCGs), like Magic The Gathering ā and this is why the sizes used for these games has the best selection. Shuffling with sleeved cards feels a lot better than unsleeved, so that affects both point 1 and 2. You can also get them with matte finish, to reduce glare.
Hereās a guide to how you should proceed if you want to sleeve:
š± Wallpapers for Home.app
Here’s a remake of backgrounds from this thread that I made since the links were dead. These were inspired by u/rzalexander and made with free illustrations from illustrations.co. I’ve tried to adapt the illustrations to iOS 16’s new home app, so that the text and icons are visible.
I’ve also made companion backgrounds for use with iPad and Mac. Since those windows resize all the time, using two tone and illustrations was a no-go. So they are just one colour backgrounds (I have one using the dark colour and one using the light one. I’ve used the latter).
š± Why 4k ā 5k
And what Apple means when they say Ā«RetinaĀ»
Iām pretty sure the Apple Studio Display is overpriced. Still, the discourse after its announcement has been plagued by people not quite understanding the difference between 4k and 5k on a 27-inch display. Itās just one kay difference ā why canāt you just buy a 4k screen thatās cheaper, brighter and/or has a higher refresh rate? Why do some Apple fans crave this extra kay so much??
Marc Edwards, of Bjango, wrote an excellent piece on this, and I especially like the visual examples of 4k vs. 5k on macOS. **Ā As a maths teacher, I find this problem interesting, and here I will bring some light to this issue the way I would to a high school class.** Perhaps this makes it easier to understand why the issues Edwards highlight appear.
Whatās in a kay?
To narrow things down, Iām mostly going to look at 27-inch screens with a 16:9 aspect ratio (so no super-wides here!). Letās compare the three most normal resolutions at this size: 1440p, 4k and 5k.
Humans are notoriously bad at comparing large numbers. Every day, thereās a new tweet trying to help us understand the difference between a million and a billion, by reminding us that:
So, itās forgiven that people think 4k and 5k are pretty close. However, 5k resolution has _a lotĀ _more pixels: