Martin Underhill (@tempertemper) header
Martin Underhill (@tempertemper) profile picture

Martin Underhill

@tempertemper

Accessibility specialist and blogger. I post links to my articles here; if you have any questions I'd love to hear from you on Bluesky, Mastodon, or LinkedIn.

 Newcastle via Glasgow
tempertemper.net
Joined April 2009
  • Tweets17K
  • Following139
  • Followers943
1.2KMedia
Photo by Martin Underhill (@tempertemper)Photo by Martin Underhill (@tempertemper)Photo by Martin Underhill (@tempertemper)Photo by Martin Underhill (@tempertemper)Photo by Martin Underhill (@tempertemper)Photo by Martin Underhill (@tempertemper)Photo by Martin Underhill (@tempertemper)Photo by Martin Underhill (@tempertemper)Photo by Martin Underhill (@tempertemper)Photo by Martin Underhill (@tempertemper)
✍️ Wanna know how to use this new select element styling? I've got ya covered! tempertemper.net/blog/fully-… #html #css #accessibility #a11y
Fully customise your select elements

Fully customise your select elements

For years and years, developers have had to come up with all sorts of creative workarounds to style select elements, but now you can do it properly.

tempertemper.net
1
78
✍️ I've been digging into the select HTML element. Here's something I've written about how the behaviour should work, if you're rolling your own (and why rolling your own is probably not a great idea anymore!) tempertemper.net/blog/a-bett… #accessibility #a11y
A better way to handle select behaviour

A better way to handle select behaviour

Building your own select means lots of code and difficult decisions about behaviour. Good news though: there’s a new way that makes things much simpler!

tempertemper.net
2
131
✍️ I’ve been digging into light-dark() over the last month. Not sure whether it’s worth it yet, but went with it on my website anyway. Thought I’d write about some of the gotchas I encountered along the way, so you can avoid them tempertemper.net/blog/using-… #css #accessibility #a11y
Using light-dark() without getting caught out

Using light-dark() without getting caught out

The light-dark() CSS function makes defining colour schemes tidier, but older browsers need some care. Here’s how I’ve handled the fallbacks.

tempertemper.net
41
✍️ Respecting your users’ preferences tempertemper.net/blog/respec… #accessibility #a11y
Respecting your users’ preferences

Respecting your users’ preferences

Our users have already chosen how they want their devices to behave; here’s how we can respect those preferences on the web.

tempertemper.net
128
There’s no going back tempertemper.net/blog/theres… #accessibility #a11y
There’s no going back

There’s no going back

The more I learn about accessibility, the harder it is to look back at some of my old work; but that cringe is a useful measure of progress.

tempertemper.net
60
Clickable table rows are a bad idea tempertemper.net/blog/clicka… #accessibility #a11y
Clickable table rows are a bad idea

Clickable table rows are a bad idea

Whole table rows might feel like obvious candidates to be clickable areas, but making them interactive creates real accessibility problems.

tempertemper.net
144
✍️ Safari 26.2 prompted me to write about the HTML5 document outline algorithm 🪦 tempertemper.net/blog/the-fi… #accessibility #a11y
The final nail in the HTML5 document outline coffin

The final nail in the HTML5 document outline coffin

All the main web browsers have finally dropped visual support for the HTML5 document outline algorithm. Here’s why that’s good news.

tempertemper.net
46
✍️ Should pagination take you to a new page? tempertemper.net/blog/should…
Should pagination take you to a new page?

Should pagination take you to a new page?

‘Pagination’ has comes from the word ‘page’, so yes, pagination should consist of pages. But the question is totally valid; worth digging into!

tempertemper.net
38
✍️ An accessible pagination pattern (or two) tempertemper.net/blog/an-acc… #accessibility #a11y
An accessible pagination pattern (or two)

An accessible pagination pattern (or two)

A couple of weeks ago I added pagination to my blog, and it was an interesting delve into the various designs and markup patterns that can be used.

tempertemper.net
42
Every idea comes from a good place, but some well-intended features are actually bad for usability; limiting form field input is one of those things ✍️ tempertemper.net/blog/dont-m… #accessibility #a11y
Don’t meddle with user input

Don’t meddle with user input

Every idea comes from a good place, but some well-intended features are actually bad for usability; limiting form field input is one of those things.

tempertemper.net
2
370
New profile pic #MayThe4thBeWithYou
My usual avatar showing a very low resolution pixellated version of me, this time with a helmet like the main character from The Mandalorian TV series, and Grogu (The Child) standing next to me.

ALT My usual avatar showing a very low resolution pixellated version of me, this time with a helmet like the main character from The Mandalorian TV series, and Grogu (The Child) standing next to me.

6
405
The whole point of VoiceOver is that it talks out loud, but sometimes you need it to be quiet for a moment… Here's how to get it to shut up when you need 📷 tempertemper.net/blog/gettin… #accessibility #a11y
Getting VoiceOver to shut up

Getting VoiceOver to shut up

The whole point of VoiceOver is that it talks out loud, but sometimes you need it to be quiet for a moment.

tempertemper.net
211
The difference between Increased Contrast Mode and Windows High Contrast Mode (Forced Colours Mode) ✍️ tempertemper.net/blog/the-di… #accessibility #a11y
The difference between Increased Contrast Mode and Windows High Contrast Mode (Forced Colours Mode)

The difference between Increased Contrast Mode and Windows High Contrast Mode (Forced Colours Mode)

I’ve written about Increased Contrast Mode and Windows High Contrast Mode, but what’s the difference? And where does Forced Colours Mode come in?

tempertemper.net
175
In order to make my website’s keyboard focus outlines pretty in Safari, I had inadvertently broken things for people who use Windows High Contrast Mode with the keyboard alone… ✍️ tempertemper.net/blog/window… #a11y #accessibility
Windows high contrast mode and focus outlines or: My focus indicators were inaccessible

Windows high contrast mode and focus outlines or: My focus indicators were inaccessible

In order to make my website’s keyboard focus outlines pretty in Safari, I inadvertently broke things for people who use Windows High Contrast Mode.

tempertemper.net
1
1
199
I just tapped (with great pleasure) Tweetbot’s “I Don’t Need a Refund” button daringfireball.net/2023/03/t…
131
When an interactive element like a button, link, or form field sits on top of another interactive element, accessibility (and usability) problems arise ✍️ tempertemper.net/blog/overla… #accessibility #a11y
Overlapping interactive areas

Overlapping interactive areas

When an interactive element like a button, link, and form field sits on top of another interactive element, accessibility (and usability) problems arise.

tempertemper.net
1
1
337
‘Alt’ text is vital for people who can’t see an image, but what about those who don’t use a screen reader but still struggle with low contrast images? ✍️ tempertemper.net/blog/images… #accessibility #a11y
Images, illustrations, and contrast

Images, illustrations, and contrast

‘Alt’ text is vital for people who can’t see an image, but what about those who don’t use a screen reader but still struggle with low contrast images?

tempertemper.net
1
1
349
Martin Underhill retweeted
Emma Dawson (@EmmaDawsonDev) profile picture
Emma Dawson@EmmaDawsonDev22 Dec 2022
Day 26 of #A11yAdvent - confused about when to use html section elements? @tempertemper gives a good explanation about how to make them accessible in this blog post tempertemper.net/blog/when-a…

When and how to use the section element

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

tempertemper.net
1
1
535
Check this beaut out! 😍
A solid looking metal garlic crusher with a black rubberised handle and a red plastic part to push the bits of garlic out of the holes.

ALT A solid looking metal garlic crusher with a black rubberised handle and a red plastic part to push the bits of garlic out of the holes.

2
Based on the price and apparent quality, I’m hoping this is the last garlic crusher I’ll ever buy.
1
I enjoy that it’s stuff like this I get excited about these days 😂
Load more