One easy thing you can do for the earth is not use “AI” tools. Consider this as a programmer, web developer, web designer, copywriter, webmaster, etc. The tools include anything branded as generative AI, LLMs, computer vision tools, Copilot, ChatGPT, Bard, Grok, Dall-e, Midjourney, and so on. If you are also a user who needs to use one of these tools to generate an image description or simplify the reading level of content because the author has created a disabling experience, I am not including you in this broad sweep. I think Molly White summarizes the current utility of these tools quite w ..read more

TL;DR: Keep your image alternative text brief, devoid of special characters, empty of URLs, and ideally in one language. Here We Go Sometimes you can have too much alternative text, particularly for an <img>. I don’t mean there is a limit to what is allowed, I mean there is a limit to what is usable by humans. This long cat photo demonstrates that. It should be an easy image to describe. An author might want to include a lot of content, however. Perhaps the image credit, or a description of the meme, or a URL, or just good old-fashioned SEO keyword stuffing. Heck, it might be a screen s ..read more

Download a 4.4MB tagged PDF of my slides or try the embedded view if your browser displays PDF inline. The text in the slides is set in Atkinson Hyperlegible. The outdoor images are generated from Midjourney. The PDF is exported from PowerPoint, after confirming reading order and alternative text and converting every em-dash, ellipsis, apostrophe, and quote otherwise they were exported as images with no alternative text. The PDF itself has had no editing. Not perfect, I know. I use an iframe to embed the slides, but only after the user clicks to do so. Some users have their browser configured ..read more

It’s none. Clarification Let me clarify: don’t set a base font size. body { /* font-size: yeah, no */ } Got a linter or code checker or boss-man hassling you that you need to set something? Ok, use this: body { font-size: 100%; } Because This approach has the advantage of always inheriting the user’s preferred font size. The one they choose in their browser or on their system. Even if they did not explicitly choose one (because the default was maybe good enough). All other font sizes (headings, navigation, footer, etc.) should then use relative units. Ideally without being smaller tha ..read more

The world wide web has officially lasted 35 consecutive years, which means it’s catching up to its parent, the Internet, which itself is bearing down on 55. That’s an important distinction. The Internet is not the web; it is the foundation on which the web was born. Prior Years For the web’s 25 year birthday in 2014, the World Wide Web Consortium (the standards body behind HTML and CSS, among other standards) and the World Wide Web Foundation teamed up to create the site webat25.org. That site went offline and the domain was allowed to lapse (purchased by a rando). Conveniently WebAt25.org is ..read more

Yes, that is the bear from Jakob’s clearly spurious alternative text example and yes, that is The Fonz after jumping the shark. If you have been following the saga of Jakob Nielsen, there a few quotes I could use here: Battle not with monsters, lest ye become a monster (Nietzsche). They which play with the devils rattles, will be brought by degrees to wield his sword (Fuller). You either die a hero, or live long enough to see yourself become the villain (Dent). In time I expect this will happen to me. I will write some opinion piece or guidance that mostly just diminishes the audience I clai ..read more

Controls that can operate other controls in bulk are not new. One common example is a single checkbox that allows you to check or uncheck a group of checkboxes. Another example is a single button that lets you expand or collapse a set of disclosure widgets. When the user operates one from the set, the bulk control then reflects that. For example, you may choose “All toppings” for your ice cream sundae, which checks every checkbox for every topping. Then you uncheck “Butterscotch” because you want to exclude that terrible sauce. The “All toppings” checkbox should visually and programmatically c ..read more

Photo by studio tdes. Used under CC BY 2.0 Deed. Image cropped and contrast enhanced. A few days ago Benjy Stanton asked about breaking long words in tables. I offered a suggestion, which may or may not have worked. I never asked. My failure to follow up aside, it reminded me that I have had to walk clients through text wrapping and word breaking more than once. I decided I wanted a blog post dated 29 February, so I took a demo I had for word breaking, beat it up a bit, and rushed this post out. Demo I made a page that allows you to play around with a few variations on breaking words. I use lo ..read more

A rambling collection of thoughts from reading through the WebAIM Screen Reader User Survey #10 Results. Most of this was in a Masto thread, but I opted to post it here so I can laugh at myself later. Disability This opening nugget is important for understanding some of my commentary: Do you use a screen reader due to a disability? Response # of Respondents % of Respondents Yes 1372 89.9% No 154 10.1% I will be mostly quoting the narrative content after the charts and tables, however, since that is where some of the nuance becomes clear. Like this: Responses are predominantly very sim ..read more

This post is part of RSS Club, rewarding those who still use RSS to read and/or share content. These posts are embargoed from my regular post feed and the socials for an arbitrary number of weeks. You can see all the RSS-only posts at AdrianRoselli.com/category/RSS. Tell your friends (to get an RSS reader). Trying Markdown code indicators in my post title, not because I want it to convert, but because I am curious if people will ping me to tell me it broke their RSS readers. Oh, and so it converts to code when pasted into your GitHub issues. ARIA note Role A section whose content is parenthet ..read more