(You may already know this, but I didn't. Every day is a school day.) HTML has the concept of the lang attribute. It allows you to say that a specific element contains text in a specific human language. For example, this page starts with: <html lang="en-GB"> That says the entire page is written in English, with the sub-type of Great Britain. This means your browser might offer to translate the page, if that isn't a language you can read. Or it might read the page aloud in a …
Continue reading →
Back in 2017, I noticed that the UK Post Office was doing very dodgy things with their alt text. Lots of their pages had this snippet of code: Rather than add properly accessible alt text, a developer added placeholder Latin text. Being a good webizen, I tried to report this. Terence Eden is on Mastodon@edentHi @PostOffice,Why is your website's alt text written in Latin? I don't think that is very accessible.shkspr.mobi/blog/2017/11/n… pic.x.com/9fQYq92P9g❤️ 8💬 0🔁 212:00 - Mon 13 November …
Continue reading →
There's an HTML element called <time>. It is a semantic element. That means robots can read and understand it. For example, if my code says: <p> The concert is <time datetime="2020-12-24">tomorrow</time> </p> Then the computer knows the specific date I'm talking about. A browser could offer to add the event to your calendar, or a search engine could find events which are happening on a specific date. Nifty! Problems in the wild The problem comes when people use abbreviations which may…
Continue reading →
It's rather dispiriting when you launch something, only to have people berate you for not launching sooner. A few months ago, I was involved in a medical questionnaire launch. Before it was released, I had several people send me polite (and not-so-polite) queries as to why it was taking so long. "I could build that in five minutes!" was the common refrain. Some people, dissatisfied with our progress, did just that. They quickly built their own questionnaires and opened them to the public.…
Continue reading →
Dark Mode is the new cool. Apps which automatically switch to an eye-friendly palette when lighting conditions are poor. Nifty! Most of the time, it's as simple as making the text a lightish colour, and the background a darkish colour. But all that fails when you use transparencies in images. Here's a quick example. Using the GitHub app in dark mode, I visited a repo which used a transparent image as an illustration: Yikes! I can't read most of that text, even if I whack up the brightness…
Continue reading →
In order to provide a video playback UI, WordPress uses the excellent MediaElement library. Recently, I discovered a slightly annoying flaw - I couldn't see the play button! Here's a screenshot of the video UI. In the middle of this screenshot is a white play button. I have trouble seeing it, because the video's background colour is predominantly white. The issue is with the mejs-controls.svg - the graphic which contains the interface controls. I think it could be made more accessible…
Continue reading →
My mate, the accessibility specialist Léonie Watson, has this to say about how we improve the world, piece-by-piece: Accessibility doesn't have to be perfect, it just has to be a little bit better than yesterday. Source: Twitter Damn straight! One of the best ways we can make tomorrow slightly better than today is by making small changes which make it easier for people to do the right thing. With that in mind, I've proposed a small change to the default behaviour in WordPress's media UI. …
Continue reading →
HTML is magic. It comes with all sorts of great usability and accessibility features. But people often ignore them or misuse them. Take a look at these checkboxen: If you click on this label, nothing happens. If you click on this label, the checkbox will toggle This is important. Tapping on tiny squares is hard for lots of people. Whether they have visual impairments, motor issues, or just a dirty touchscreen. You should give your user the biggest possible target area to interact with an…
Continue reading →
Apple's attitude to usability is... complex. The general attitude of "you're holding it wrong" seems to be prevalent across all their products. I like having a large mouse cursor. I find it easier to see on my large monitor, especially when sat at a safe distance. But, if I use a large cursor - I can't see the tool-tips underneath it. Annoyingly, Apple don't include the larger cursor sizes when taking a screenshot. So you get the joy of me pointing a camera at my screen like some kind of…
Continue reading →
Dark times, my friends. Dark times. It's up to all of us to pull together. And that means making vital health information accessible. One of the easiest things you can do is make your Twitter content accessible is by adding descriptions to your images. Go to twitter.com/settings/accessibility and turn on "Compose image descriptions". Here's why. This is a screenshot of a Tweet I recently saw. The images weren't loading because my area's 3G signal is overloaded. So I got the same experience…
Continue reading →
I've spent a week cosplaying as a disabled user. And I hate it. A couple of months ago, I attended a private talk given by a disabled colleague of mine. "Everyone should believe disabled people's stories about accessibility problems," she said. "But, given that people don't, here's what I want you to do. Spend one week pretending to be disabled. Pick a disability and try to interact with services as though you have that impairment. Build up some empathy." So I did. For a week, I pretended…
Continue reading →
I was in need of a new laptop, so I bought a cheap ChromeBook - mostly because Amazon could deliver it the same day. Sadly, the trackpad was broken. Before I sent it back, I thought I'd try using a mouse with it. That's when I discovered that accessibility is very much a second thought for all the young and healthy people Google employ. I have RSI and use a vertical mouse. After decades of regular left-clicking, my index finger is worn out. So I use a thumb button to click. Changing the…
Continue reading →
