Link tags: end

2020

sparkline

Here’s what I didn’t know about :where() - Manuel Matuzović

I feel like I’m starting to understand how the CSS :where pseudo-class works and why it’s useful. The cogs are slowly turning in my brain.

No, Apple Did Not Crowdfund :focus-visible in Safari – Eric’s Archived Thoughts

Eric has a written a clear and measured explanation that I hope Alex and Jake will read, given their petty snarky reactions to Webkit shipping a feature (reactions that do more harm than good to their cause—refuting their bullshit has taken time and energy away from the legitimate criticisms of Apple’s rendering engine monopoly on iOS; this whole debacle has been one big distraction from far more important browser bugs).

Many of us are mad at Apple for a lot of good reasons, but please don’t let the process of venting that anger tar the goals and achievements of Open Prioritization.

Interfacecritique — Olia Lialina: From My To Me

Don’t see making your own web page as a nostalgia, don’t participate in creating the netstalgia trend. What you make is a statement, an act of emancipation. You make it to continue a 25-year-old tradition of liberation.

The monoculture web

Firefox as the asphyxiating canary in the coalmine of the web.

Chesterton’s Fence: A Lesson in Second Order Thinking - Farnam Street

Unless we know why someone made a decision, we can’t safely change it or conclude that they were wrong.

Friendly Indie micro-publishers

From Patrick Tanguay:

A list of small micro-publishers — most of them run by one person — putting out great content through their websites, newsletters, and podcasts.

Ban embed codes

Prompted by my article on third-party code, here’s a recommendation to ditch any embeds on your website.

How Flexbox Works

A really deep dive into flexbox. This is a great example of what I categorise as “thinking like a browser” (a skill I recommend for any front-end developer).

The Optional Chaining Operator, “Modern” Browsers, and My Mom - Jim Nielsen’s Blog

This is something I bump against over and over again: so-called evergreen browsers that can’t actually be updated because of operating system limits.

From what I could gather, the version of Chrome was tied to ChromeOS which couldn’t be updated because of the hardware. No new ChromeOS meant no new Chrome which meant stuck at version 76.

But what about the iPad? I discovered that my Mom’s iPad was a 1st generation iPad Air. Apple stopped supporting that device in iOS 12, which means it was stuck with whatever version of Safari last shipped with iOS 12.

So I had two older browsers that couldn’t be updated. It was device obsolescence because you couldn’t install the latest browser.

Websites stop working and the only solution is to buy a whole new device.

The UI fund

This is an excellent initiate spearheaded by Nicole and Sarah at Google! They want to fund research into important web UI work: accessibility, form controls, layout, and so on. If that sounds like something you’ve always wanted to do, but lacked the means, fill in the form.

The Year in Cheer

192 more stories of progress from 2021.

99 Good News Stories You Probably Didn’t Hear About in 2021

Some welcome perspective on healthcare, conservation, human rights, and energy.

Start at the beginning: the importance of learning the basics - localghost

I’d recommend going in the order HTML, CSS, JS. That way, you can build something in HTML, add CSS to it as you learn it, and finally soup it up with your new-found JS knowledge.

Excellent advice for anyone new to web develoment.

Once you start getting into interactive website territory, with API calls and fancy stuff, that’s where you need JavaScript (JS) knowledge. More specifically, vanilla JS: plain JS with no additional frameworks or plugins. The JS that your browser understands without having to do any pre-processing. It makes working with frameworks a whole lot easier, and it’ll help you to know when not to use a framework (and avoid making users download massive JS bundles when all you need is a tiny bit of code).

Add Less | CSS-Tricks - CSS-Tricks

Let the power of the browser work for you, and use less stuff!

Amen!

Your websites start fast until you add too much to make them slow. Do you need any framework at all? Could you do what you want natively in the browser?

Add a Service Worker to Your Site | CSS-Tricks - CSS-Tricks

Damn, I wish I had thought of giving this answer to the prompt, “What is one thing people can do to make their website better?”

If you do nothing else, this will be a huge boost to your site in 2022.

Chris’s piece is a self-contained tutorial!

Tailwind and the Femininity of CSS

So when it comes down to the root of the problem, perhaps it isn’t CSS itself but our unwillingness to examine our sexist ideas of what is worthy in web development.

Defensive CSS - Ahmad Shadeed

This is a smart collection of situations to consider and the CSS to resolve them. It’s all about unearthing assumptions.

Serve folder for web development

This is a very nifty use of a service worker—choose a local folder that you want to navigate using HTTP rather than the file system.

Embrace the Platform - CSS-Tricks

This is a wonderful piece by Bram. Half history lesson, and half practical advice for building resilient websites today:

By embracing what the web platform gives us — instead of trying to fight against it — we can build better websites.

Keep it simple. Apply the Rule of Least Power. Build with progressive enhancement in mind.

HTML, CSS, and JavaScript — in that order.