CSS { In Real Life }

A blog about CSS, front-end development, the web, and beyond.

Find out more
  • Design Patterns that Encourage Junk Data

    A post from Remy on Mastodon recently got me thinking:

    Read more

  • How I Solved My Font Rendering Problem

    Since I redesigned this website last year, an issue with the heading font has been bugging me. I’d noticed that, unlike in other browsers, in Safari on iOS the headings rendered poorly, slightly blurry, as if they’d been faux-bolded. Googling the problem was coming up with nothing, but I’m using a variable font, so I figured perhaps that had something to do with it not being a super-common issue.

    Read more

  • Quick note

    New and Improved Green Web Hosting Directory from the Green Web Foundation

    The Green Web Foundation has recently redesigned their green web hosting directory. Previously the directory was a useful resource for finding hosting platforms that at least claim some sustainable credentials but, as I’ve noted before the information provided by each web host was somewhat limited. From the directory alone it was impossible to discern which providers could claim to be running on renewable energy rather than buying carbon offsets, for instance, or which providers were doing the bare minimum of box-ticking, as opposed to making sustainability a key part of their offering. Finding a truly green web host is hard!

    Read more

  • Eleventy Starter Project Updates

    This blog uses static site generator Eleventy (or 11ty. I have no idea which one is the “official” spelling, and the docs appear to delight in switching gratuitously between the two! Let’s go with “Eleventy” for now.) under the hood. I like Eleventy because it allows me to write blog posts in markdown and use Nunjucks for templates, which get built into HTML file on deployment and served as static files, so it’s nice and lightweight on the client side. I also have an Eleventy starter project that’s been long-overdue for some maintenance. I recently made a few updates, so I thought I’d note them down here.

    Read more

  • Wrapping Up 2023

    I’ve held off publishing a “year in review” post until now because, to be honest, towards the end of last year I wasn’t feeling too optimistic about the state of the web. Normally I like to end the year with a (mostly) upbeat reflection on my experiences, and on new developments in CSS. But for the first time, I feel a sense of trepidation for my chosen profession, and the industry as a whole. It seems every week the headlines are filled with new ways that companies are using AI to exploit workers and fill the web with soulless marketing soup. Additionally, I’ve seen several friends and acquaintances laid off this year, and I have a feeling that trend might continue a while yet. It’s taken a bit of the shine of my enthusiasm for the web, even to the point of questioning whether my chosen profession is still where I want to be.

    Read more

  • Video: Building a Greener Web (Smashing Meets Goes Green)

    Just before Christmas I spoke at Smashing Meets Goes Green an online event focused on digital sustainability. The video of my talk is now online, so if you’d like to know more about this vast topic, jump right in!

    Read more

  • Where Do We Go From Here?

    A question I’ve been asking myself recently is “What is the purpose of this blog”? When I started writing in 2018 it didn’t occur to me that I’d still be doing it five years later. I picked the name “CSS { In Real Life }” because I loved CSS (I still do!), and that was what I was most interested in learning and writing about. But over the course of the years I’ve found myself expanding my writing into different areas: web sustainability, JS, dev ops, front-end in general, and work/life more broadly.

    Read more

  • Workshop Review: Data Visualisation Fundamentals with Andy Kirk

    Last week I had the privilege of attending an online workshop on Data Visualisation Fundamentals hosted by data visualisation expert Andy Kirk. The six-hour workshop was split across two days, and consisted of a mixture of teaching materials, examples and interactive exercises (both individually and in small groups). It can be tricky to find the right balance to hold people’s attention for an online workshop — speaking from my own experience, I find I sometimes struggle to stay engaged compared to attending in person. But the blend of content here, combined with Andy’s presentation style and his expertise and enthusiasm for the subject meant that in this case I felt fully immersed. It appeared the rest of the audience was similarly engaged too.

    Read more

  • How Do You Vertically Centre an Element in CSS? (Even More) Easily!

    Rachel Andrew shared a snippet of good news for CSS layout on her blog the other day: it’ll soon be possible to vertically centre an element inside a parent without the parent needing to be a flex or grid container, using the align-content property.

    Read more

  • Quick note

    Interview: Beyond the Spotlight

    Melinda Seckington has just launched a brand new blog series, Beyond the Spotlight, where she’ll be talking to conference speakers about their talk process, preparation and delivery. Melinda is an accomplished speaker , writer and engineering manager, so I was honoured to be the first speaker interviewed.

    Read more

  • Quick note

    Greenhouse Gas Emissions From Streaming Digital Content

    I’ve been speaking about web sustainability a bit recently, and a question that comes up fairly frequently is about the impact of audio and video streaming. Catherine Van Loo from Carnerstone consultancy is part of the team working on DIMPACT — a collaborative initiative between researchers and digital media companies with the aim of quantifying and reducing carbon emissions from digital content. She recently gave an illuminating talk at Green Tech South West on the subject.

    Read more

  • Quick note

    Reporting on Website Carbon Emissions

    Yesterday I spoke at Smashing Meets Goes Green, an online meetup themed around building a more sustainable web. In my talk I spoke a little about tools for measuring your website’s carbon emissions, and how it would be great if these metrics could be integrated with commonly-used developer tools for monitoring performance. As I also mentioned, it’s really hard to land on 100% accurate figures for this stuff, as there are so many variables.

    Read more