• 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

  • Testing the Performance of Social Media Embeds

    I’ve been writing and speaking about web sustainability quite a bit this past year. One thing I’ve done periodically for my talks is to test the data transfer size of various social media embeds — they’re pretty bad!

    Read more

  • Wrapping Up National Blog Posting Month 2023

    We made it! I tasked myself with writing 30 posts in 30 days for National Blog Posting Month, and somehow I just about managed it (well, including this post — yes, I cheated!). So, what have I learned?

    Read more

  • Quick tip

    Hide and Debug Empty Elements with CSS

    A tiny tip today, but a good one: use the :empty pseudo-class to hide pesky empty elements (commonly found in user-generated content).

    Read more

  • Oh No, Overflow!

    The overflow CSS property (shorthand for overflow-x and overflow-y) controls what happens when the stuff you put inside a box is bigger than the box itself. Should it bleed out of the box (overflow: visible, the default)? Hidden completely (overflow: hidden)? Or should the content be scrollable (overflow: scroll or overflow: auto)?

    Read more

  • Kicking the Excessive JavaScript Habit

    The video of Ryan Townsend’s talk from Performance Now(), The Unbearable Weight of Massive JavaScript is well worth a watch. Excessive JS, seemingly turbo-charged by JS frameworks, has long been a problem on the web, with bundle sizes showing no sign of decreasing.

    Read more

  • Quick note

    You Have Something to Say That’s Worth Hearing

    A recent post by Melinda Seckington, The Myth of not Having Anything To Talk About really resonated with me. I’ve been doing talks about CSS for a few years now, and for a while before that I was an organiser of web conferences, so I’ve seen a fair few talks. I can definitely say that some of the best talks I’ve seen are not necessarily by the people with the most expertise in a given subject, but by people who share their story, their perspective — whether it’s on a particular technology, design problem, workflow, project case study, or something else entirely. Making it personal makes it relateable. As Melinda says:

    Read more

  • Quick tip

    Preventing Scroll “Bounce” with CSS

    When you scroll rapidly to the top or bottom of a webpage you might notice a “bounce” effect, where the browser momentarily allows you to scroll beyond the uppermost or lowermost point, before bouncing you to correct position.

    Read more

  • Why You Should Hold Onto Your Devices For Longer

    My iPhone 8 is still going, four years after I bought it. That shouldn’t be a great achievement, but somehow it is. The battery life isn’t great (it’s already been replaced once), some apps are noticeably slower, and Apple have announced that the iPhone 8 won’t support the iOS 17 update, which means I’ll have to seriously consider upgrading in the not-too-distant future. I’m hoping to make it to the five-year mark, but we’ll see.

    Read more