Skip to main content

Accessibility

Accessibility and inclusive design should be the first considerations when designing a digital product, service or website. A full list of categories is also available.

  1. Links, missing href attributes, and over-engineered code

    Article posted 30th September 2021 in Accessibility, Development and HTML

    Links without an href attribute are ignored by browsers; making them ‘behave’ using JavaScript, CSS, and other HTML attributes is not a solution.

  2. Website version 6

    Article posted 6th July 2021 in Accessibility, Design and Development

    The last major version of this website was a complete behind-the-scenes rebuild. This version, on the other hand, is almost entirely visual.

  3. Using the Increased Contrast Mode CSS media query

    Article posted 21st June 2021 in Accessibility, CSS, Design and Development

    Satisfying the enhanced contrast AAA WCAG rule can be limiting; luckily prefers-contrast: more allows us more freedom with our default themes.

  4. Fixing Safari’s HTML-only Dark Mode bug

    Article posted 3rd June 2021 in Accessibility, CSS and HTML

    A bug with link text colours in Safari’s HTML-only Dark Mode theme means we need a bit of extra code. Here’s how to patch things until it’s fixed.

  5. HTML-only Dark Mode

    Article posted 2nd June 2021 in Accessibility, CSS and HTML

    When our CSS contains Dark Mode rules and the file fails to load, we’re left with plain old HTML. Luckily we can request Dark Mode in our markup!

  6. Accessible responsive tables

    Article posted 28th May 2021 in Accessibility, CSS, Development and HTML

    Tables can be tricky to make work responsively; they can also be tricky to make accessible. Here’s a step by step guide to making your tables both!

  7. Be careful with strikethrough

    Article posted 20th April 2021 in Accessibility, Development and HTML

    Struck-through text isn’t read by screen readers. This is true of all text-level semantics, but it’s worth drawing attention to strikethough.

  8. Bold and italics aren’t read by screen readers

    Article posted 2nd April 2021 in Accessibility

    Emphasis and other text-level semantics are normally ignored by screen readers, so it you’re relying on them for meaning you could be in trouble.

  9. Sentence case versus title case

    Article posted 31st March 2021 in Accessibility and Design

    I’m a fan of good typography, and something I come across a fair bit is whether sentence case or title case is better for headings.

  10. Why I stopped using ASCII art

    Article posted 10th March 2021 in Accessibility

    I love those old-school ASCII art characters, but I’ve stopped using them as they’re not accessible.

  11. When and how to use the section element

    Article posted 11th February 2021 in Accessibility and HTML

    So what on earth is a <section> element actually for? The answer isn’t as obvious as you might have hoped, but it’s definitely straightforward.

  12. Scrollbar marker colours on macOS

    Article posted 25th January 2021 in Accessibility and CSS

    The other day, I realised the scroll markers were invisible on my website in Light Mode. The fix was pretty easy once I knew what was going on.

  13. Using VoiceOver’s rotor on macOS

    Article posted 21st January 2021 in Accessibility and Apple

    If you’re new to VoiceOver, once you’ve got the hang of the basics, the next thing to learn is the ‘rotor’; a supercharged navigation tool.

  14. Getting started with VoiceOver on macOS

    Article posted 20th January 2021 in Accessibility and Apple

    Understanding how screen readers work is important for anyone who works on digital products. Here’s how to get started with VoiceOver on macOS.

  15. Accessible animated GIFs are pointless

    Article posted 8th January 2021 in Accessibility

    Animated GIFs are everywhere, but are they accessible to everyone? I’m afraid to say, they’re not, and we probably shouldn’t be using them.

  16. An unexpected accessibility benefit of video calls

    Article posted 30th December 2020 in Accessibility

    COVID-19 changed the way we work. Now that we all work from home, remote team members report feeling more included, and I’ve noticed another benefit.

  17. Voice Control for macOS commands cheatsheet

    Article posted 29th December 2020 in Accessibility and Apple

    I have a list of all the commands for Voice Control for macOS, and it comes in handy pretty much every time I do any speech recognition testing.

  18. Progressively enhanced animated content

    Article posted 2nd December 2020 in Accessibility and Development

    Respecting your users’ preferences with prefers-reduced-motion is great, but what about users with older operating systems and browsers?

  19. Form styling limitations are an accessibility issue

    Article posted 27th November 2020 in Accessibility, CSS and Development

    A summary of the things missing in CSS got me thinking about how lack of some form styling may have seriously damaged accessibility on the web.

  20. Accessibility issues when removing list markers

    Article posted 12th October 2020 in Accessibility, CSS and Development

    If we remove the list markers from an ordered or unordered list, we’re likely to run into some issues with VoiceOver.

  21. How to use the keyboard to navigate on Safari

    Article posted 6th October 2020 in Accessibility

    A great way to start accessibility testing is to navigate with the keyboard. Safari is limited by default, so here’s how get it working properly.

  22. Using the keyboard to navigate on macOS

    Article posted 5th October 2020 in Accessibility

    I’ve just set up a new Mac, and keyboard navigation is pretty limited by default. Here’s how to make it much more useful.

  23. Why you should (almost) always underline your links

    Article posted 3rd September 2020 in Accessibility and Design

    A link should look like the text around it, but with a couple of differences: maybe a bit of colour and (almost) always an underline.

  24. WebKit has fixed the implicit role on footers

    Article posted 24th August 2020 in Accessibility and Development

    Last year, I wrote about implicit ARIA roles; an issue I encountered was that VoiceOver didn’t give an implicit role to footers. Well, it’s fixed!

  25. iOS 14’s Back Tap; a better way to access Control Centre

    Article posted 21st August 2020 in Accessibility and Apple

    My most anticipated iOS 14 feature wasn’t mentioned at WWDC 2020, but will sort my biggest issue with iPhones X and above: Control Centre access.

  26. Using address in HTML won’t be problematic for much longer

    Article posted 22nd July 2020 in Accessibility, Development and HTML

    There’s a bug in Safari that adds an implicit role to <address> which causes problems for screen readers. The good news is, a fix is very close!

  27. When design breaks semantics

    Article posted 25th June 2020 in Accessibility, Design and Development

    Semantic HTML is great. But sometimes following the rules is tricky. Grab a cuppa and let me tell you a story about links that look like buttons.

  28. Using the HTML document outline

    Article posted 3rd April 2020 in Accessibility, Design and Development

    What is a document outline? Sounds complicated, but it’s really not – it’s just headings! Find out more about them and why they’re a good idea.

  29. Why is accessibility so often seen as a low priority?

    Article posted 20th February 2020 in Accessibility

    A couple of recent CSS-Tricks articles got me thinking about how website owners prioritise their legal (and moral!) obligations to their users.

  30. If it’s not progressively enhanced, it’s not accessible

    Article posted 6th November 2019 in Accessibility

    In his latest article, Adam Silver summarises the many ways JavaScript can fail, which, to me, is an accessibility issue.

  31. Colour contrast on tempertemper.net

    Article posted 14th October 2019 in Accessibility, Brand and Design

    Colour contrast on my site now meets WCAG AAA, in light or dark mode. There have been compromises but, if it’s more useable, I’m happy to make them.

  32. Years in, the accessibility learning curve continues

    Article posted 5th September 2019 in Accessibility and Development

    I’ve cared about accessibility for as long as I’ve been working in the web and, even after all these years, I still enjoy learning new things.

  33. What’s emphasis and what’s not

    Article posted 24th June 2019 in Accessibility and Development

    Semantic HTML is hard. We stopped using <i> and <b> elements in favour of <em> and <strong>, but are <i> and <b> still useful?

  34. Implicit ARIA landmark roles

    Article posted 14th June 2019 in Accessibility and Development

    ARIA landmarks give a screen reader user an easy way to orient themselves on a web page. Implicit roles are also great. Except when they’re not.

  35. Reducing motion

    Article posted 30th May 2019 in Accessibility, Design and Development

    Accessibility is important, so I’ve taken steps to minimise animation on my site, and even removed it completely for those who ‘prefer reduce motion’.

  36. Design and build for the worst case scenario

    Resource posted 29th June 2015 in Accessibility, Performance and Search

    Performance matters. If your website loads slowly it could be costing you business, so make sure it works for even the slowest of internet connections

  37. Mobile friendly markers

    Resource posted 6th April 2015 in Accessibility and Search

    You might have noticed that if you search for something on Google on your phone there’s a new ‘Mobile friendly’ label.

  38. Why I changed my baseline

    Resource posted 6th March 2014 in Accessibility and Content

    Every site I build is now mobile friendly and allows the editing of all content by default. This is for a few very good reasons.

  39. Should you go responsive?

    Resource posted 19th November 2012 in Accessibility

    Responsive web design is when the content of your website is laid out differently, depending on the size of the screen your visitor is using. Catering

  40. Disability on the web

    Resource posted 3rd November 2012 in Accessibility

    Just like in ‘real’ life, your visitors come in all shapes and sizes. Inclusivity is—rightly—front and centre for businesses these days.

  41. Image alt text

    Resource posted 28th August 2012 in Accessibility and Content

    Useful ‘alt’ text on images will not only keep your visitors happy but has happy knock-on effect on your search engine ranking.

  42. Older browsers

    Resource posted 26th August 2011 in Accessibility

    Some visitors to your site will use out of date browsers. Is it worth catering for these visitors? Here’s how to make an informed decision.

  43. Do I need a mobile website?

    Resource posted 28th July 2011 in Accessibility

    One of the biggest changes in recent years has been the use of smartphones. How should your website cater for these devices?

  44. What’s in a browser?

    Resource posted 27th July 2011 in Accessibility

    So what’s all this fuss about Internet Browsers? Maybe you, like a lot of people, you didn’t realise there was a choice…