# alt text Published articles for alt text. This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles. ## Copy-pasting more than just text DevFeed: [Copy-pasting more than just text]() Original publisher: [Read original article]() Author: Khan Academy Published: 2015-08-31T22:00:00Z Content type: tutorial Language: en Sources: [Khan Academy]() Topics: [Web Development](), [JavaScript](), [React](), [interactive website]() Tags: [alt-text](), [copy](), [engineering](), [interactive-content](), [javascript](), [news](), [web-frontend](), [widget]() ### AI overview Sam Lau describes how Khan Academy improved copy-pasting in Perseus, its interactive exercise and article editor, by moving widget metadata alongside copied text. The change preserves information such as image URLs and a number line's starting value, making it easier for content creators to move or duplicate widgets. ### Source excerpt By Sam Lau The Result I'll skip to the happy ending. This little feature implements more sophisticated copy-pasting ... Read more ## 6 Best WordPress Plugins for Improving Website Accessibility in 2026 DevFeed: [6 Best WordPress Plugins for Improving Website Accessibility in 2026]() Original publisher: [Read original article]() Author: Eric Karkovack Published: 2026-08-25T17:09:45Z Content type: article Language: en Sources: [Speckyboy Design Magazine]() Topics: [Accessibility](), [WordPress themes and plugins](), [WordPress](), [alt text](), [Artificial Intelligence]() Tags: [accessibility](), [ai](), [alt-text](), [best-practices](), [content](), [features](), [images](), [learn](), [media](), [post](), [tools](), [web-accessibility](), [wordpress](), [wordpress-plugins]() ### AI overview A guide to six WordPress plugins that can help identify and improve website accessibility issues, including missing attributes, skip links, labels, contrast, and image descriptions. The article notes that automated results require manual verification. ### Source excerpt We have a fantastic collection of WordPress plugins and tools to help you overcome the challenges that come along with website accessibility. The post 6 Best WordPress Plugins for Improving Website Accessibility in 2026 appeared first on Speckyboy Design Magazine. ## Your alt text passes automated checks. That doesn't mean it's any good. DevFeed: [Your alt text passes automated checks. That doesn't mean it's any good.]() Original publisher: [Read original article]() Author: Taarik Ashenafi Published: 2026-08-24T20:56:32Z Content type: article Language: en Sources: [GitHub]() Topics: [Accessibility](), [alt text](), [GitHub](), [Tooling]() Tags: [accessibility](), [alt-text](), [automation](), [blog](), [engineering](), [false-positives](), [github](), [github-actions](), [plugin](), [scanner](), [user-experience]() ### AI overview This article explains a GitHub Accessibility Scanner plugin for evaluating alt text. It distinguishes deterministic checks that automated tools can prove from contextual quality judgments that may require a model and image context. ### Source excerpt We built a plugin for the GitHub Accessibility Scanner to make sure your alt text is actually accessible. Here's how it works. The post Your alt text passes automated checks. That doesn't mean it's any good. appeared first on The GitHub Blog. ## Build new features using built-in AI in Chrome DevFeed: [Build new features using built-in AI in Chrome]() Original publisher: [Read original article]() Author: Thomas Steiner GitHub LinkedIn Mastodon Bluesky Homepage Published: 2026-05-26T07:00:00Z Content type: article Language: en Sources: [developer.chrome.com: Blog]() Topics: [AI Chat](), [SDKs](), [User interface design]() Tags: [accessibility](), [ai](), [alt-text](), [api](), [apis](), [chrome](), [firebase](), [inference](), [json](), [multimodal](), [offline](), [on-device](), [privacy](), [web-apps]() ### AI overview The article describes Chrome's built-in AI APIs for adding on-device writing, summarization, structured output, image accessibility, rewriting, and translation features to web applications. ### Source excerpt Learn more about the talk given at Google I/O 2026 by Thomas Steiner. ## Making Discord on Desktop Look Just Right: Display Settings to Ease the Eyes DevFeed: [Making Discord on Desktop Look Just Right: Display Settings to Ease the Eyes]() Original publisher: [Read original article]() Author: Locke Published: 2026-04-16T00:00:00Z Content type: article Language: en Sources: [Discord Blog]() Topics: [Discord](), [App](), [web applications](), [alt text]() Tags: [alt-text](), [app](), [article](), [blog](), [blog-post](), [desktop](), [discord](), [display](), [features](), [image](), [web]() ### AI overview This Discord article explains display and conversation settings that make media and app content more comfortable to view. It covers controlling when images, videos, embeds, and link previews appear, reducing color intensity, resizing content, and showing image descriptions through alt text across desktop, web, and mobile experiences. ### Source excerpt Learn all sorts of toggles, options, and features on Discord's desktop app to help you view media at your pace, lower the strength of colors across the app, and make app content easier to see. ## Word and PowerPoint Alt Text Roundup DevFeed: [Word and PowerPoint Alt Text Roundup]() Original publisher: [Read original article]() Author: Jon Whiting Published: 2025-10-31T19:14:54Z Content type: article Language: en Sources: [WebAIM Blog]() Topics: [Accessibility](), [microsoft 365](), [pdf](), [Microsoft]() Tags: [accessibility](), [alt-text](), [microsoft](), [microsoft-365](), [office](), [pdf](), [uncategorized]() ### AI overview This article reports tests of alternative-text support for non-text content in Microsoft Word and PowerPoint, including conversion to PDF through Microsoft and Adobe tools. It finds that alt text works well in Word and PowerPoint and in Microsoft's PDF export, while Adobe's PDF tools have problems with most tested image types. ### Source excerpt Introduction In Microsoft Word and PowerPoint, there are many types of non-text content that can be given alternative text. We tested the alternative text of everything that we could think of in Word and PowerPoint and then converted these files to PDFs using Adobe's Acrobat PDFMaker (the Acrobat Tab on Windows), Adobe's Create PDF cloud [...] ## StreetReaderAI: Towards making street view accessible via context-aware multimodal AI DevFeed: [StreetReaderAI: Towards making street view accessible via context-aware multimodal AI]() Original publisher: [Read original article]() Published: 2025-10-29T16:38:00Z Content type: article Language: en Sources: [The latest research from Google]() Topics: [Accessibility](), [multimodal-ai](), [Artificial Intelligence](), [Google](), [Image](), [alt text](), [real-time]() Tags: [accessibility](), [ai](), [alt-text](), [audio](), [gaming](), [generative-ai](), [human-computer-interaction-and-visualization](), [machine-intelligence](), [multimodal](), [multimodal-ai](), [natural-language-processing](), [navigation](), [real-time](), [research](), [screen](), [vision](), [voice]() ### AI overview Google Research introduces StreetReaderAI, a proof-of-concept accessible street view prototype that uses context-aware, real-time multimodal AI to interpret streetscape imagery. Designed with blind and sighted accessibility researchers, it provides audio-led exploration, keyboard and voice navigation, directional feedback, movement guidance, and descriptions of nearby places and geographic information. ### Source excerpt Generative AI ## Fashion Nova Settles Web Accessibility Lawsuit for $5.15 Million DevFeed: [Fashion Nova Settles Web Accessibility Lawsuit for $5.15 Million]() Original publisher: [Read original article]() Author: CJ Published: 2025-08-13T12:45:00Z Content type: news Language: en Sources: [Blog-Main]() Topics: [Accessibility](), [digital accessibility](), [Website](), [Web Content Accessibility Guidelines](), [alt text](), [screen]() Tags: [accessibility](), [accessibility-guidelines](), [alt-text](), [civil-rights](), [human-interest](), [industry-news](), [law](), [lawsuits-settlement](), [web-accessibility](), [web-content-accessibility-guidelines](), [website]() ### AI overview Fashion Nova agreed to pay $5.15 million in a class-action settlement involving alleged web accessibility barriers. Eligible legally blind individuals who attempted to access the retailer's website during the applicable period may receive up to $4,000 per household, and the company agreed to improve the site's accessibility while denying wrongdoing. ### Source excerpt Fashion Nova LLC will send checks for up to $4,000 to individuals with vision disabilities who were unable to use the retailer's website using screen reading software (screen readers). ## Why WCAG Conformance Doesn't Mean "Perfectly Accessible" DevFeed: [Why WCAG Conformance Doesn't Mean "Perfectly Accessible"]() Original publisher: [Read original article]() Author: Jordan Published: 2025-07-23T12:45:00Z Content type: article Language: en Sources: [Blog-Main]() Topics: [Web Content Accessibility Guidelines](), [Accessibility](), [Web Accessibility (a11y)](), [Web](), [alt text](), [Users]() Tags: [accessibility](), [accessibility-guidelines](), [accessibility-ux](), [accessible](), [alt-text](), [cause](), [content](), [lawsuit](), [markup](), [speech](), [tables](), [wcag](), [web-accessibility](), [web-content-accessibility-guidelines]() ### AI overview The article explains that WCAG conformance, including Level AA, is a valuable goal but does not guarantee a perfectly accessible experience. Pass-or-fail criteria can be met while websites still create barriers through poor alt text, difficult captions, incomprehensible table presentation, or layout shifts caused by slow page speeds. ### Source excerpt The Web Content Accessibility Guidelines (WCAG) are an excellent set of standards, and WCAG conformance is achievable -- regardless of the size of your website, the complexity of its features, or any other factors. ## 10 Tips to Make Your Blog Posts More Accessible DevFeed: [10 Tips to Make Your Blog Posts More Accessible]() Original publisher: [Read original article]() Author: Eevis Panula Published: 2025-07-18T11:44:00.644000Z Content type: tutorial Language: en Sources: [Eevis Blog]() Topics: [Accessibility](), [alt text](), [Code](), [HTML](), [Markdown]() Tags: [accessibility](), [accessible](), [alt-text](), [blog-post](), [code](), [tips](), [writing]() ### AI overview This article shares accessibility tips for blog authors, emphasizing that technical content should support developers with disabilities. It recommends presenting code as text in code blocks instead of images and providing text alternatives for graphics. ### Source excerpt Sometimes I encounter this weird idea that developers don't need accessibility at all. Some people seem to believe that our development tools and resources don't need to be accessible, because accessibility is just something to do with the end users of our services. If you're one of those people, you know, disabled software developers exist. You're reading text from one right now, and I know many developers with disabilities. Yes, even blind developers. I've been writing a blog since 2019, and as an accessibility specialist, I've tried to make my blog posts as accessible as possible. In this blog post, I decided to share some of the things I've learned over the years. So, without further ado, let's get started. Share Code as Text, not as Images If you're writing a technical blog post and sharing some code, always write it as text, never share it as an image. Why? There are multiple reasons. First of all, it's super annoying to copy the code from a blog post if it's an image. The reader would need to type it out, instead of just copying and pasting. At least for me, when I'm sharing code in a blog post, it's meant to be used, and the fastest way is to use copy and paste. Images of code are also an accessibility problem. With an image, there is no way to make the text bigger, change colors for better contrast, or modify the text row length. All of these are things people might need to make the web content more accessible for them. And then there's the text alternative part - if you're sharing an image of text, you should always include the text as text alternative (alt text) for the image. However, even if you include code, the way screen readers interact with alt texts makes it more challenging to use. E.g., navigating within the code is harder because screen readers read the text from the beginning, and it's not really possible to jump from one row to another. So, always put code into a code block as text. Most blogging platforms allow this, and if you have your own ## Experimenting with local alt text generation in Firefox Nightly DevFeed: [Experimenting with local alt text generation in Firefox Nightly]() Original publisher: [Read original article]() Author: Tarek Ziadé Published: 2024-05-31T16:43:46Z Content type: article Language: en Sources: [Mozilla Hacks - the Web developer blog]() Topics: [On-device AI](), [AI, ML & Data Engineering](), [cpu]() Tags: [ai](), [alt-text](), [artificial-intelligence](), [cpu](), [feature](), [featured-article](), [firefox](), [firefox-nightly](), [inference](), [machine-learning](), [on-device-ai](), [pdf]() ### AI overview Firefox Nightly is testing private, on-device AI that generates image alt text in its built-in PDF editor, with a longer-term goal of helping screen-reader users while browsing. ### Source excerpt Firefox 130 will introduce an experimental new capability to automatically generate alt-text for images using a fully private on-device AI model. The feature will be available as part of Firefox's built-in PDF editor, and our end goal is to make it available in general browsing for users with screen readers. The post Experimenting with local alt text generation in Firefox Nightly appeared first on Mozilla Hacks - the Web developer blog. ## Picture This: Open Source AI for Image Description DevFeed: [Picture This: Open Source AI for Image Description]() Original publisher: [Read original article]() Published: 2024-05-09T00:00:00Z Content type: article Language: en Sources: [The Fly Blog]() Topics: [Artificial Intelligence](), [Large Language Model](), [alt text](), [Open Source]() Tags: [ai](), [alt-text](), [cdn](), [close-to-users](), [deploy-app-servers](), [docker](), [elixir](), [fly](), [fly-io](), [heroku-alternative](), [heroku-competitor](), [hosting](), [i](), [image](), [llms](), [networking](), [open-source](), [postgresql-clusters](), [servers]() ### AI overview This article presents AI-generated image descriptions as an important accessibility aid for blind internet users. It describes how large language models can identify objects, describe scenes and menus, and summarize technical diagrams, while framing an extensible open-source project as something developers can build over a weekend. ### Source excerpt I'm Nolan, and I work on Fly Machines here at Fly.io. We're building a new public cloud--one where you can spin up CPU and GPU workloads, around the world, in a jiffy. Try us out; you can be up and running in minutes. This is a post about LLMs being really helpful, and an extensible project you can build with open source on a weekend. Picture this, if you will. You're blind. You're in an unfamiliar hotel room on a trip to Chicago. If you live in Chicago IRL, imagine the hotel in Winnipeg, the Chicago of the North. You've absent-mindedly set your coffee down, and can't remember where. You're looking for the thermostat so you don't wake up frozen. Or, just maybe, you're playing a fun-filled round of "find the damn light switch so your sighted partner can get some sleep already!" If, like me, you've been blind for a while, you have plenty of practice finding things without the luxury of a quick glance around. It may be more tedious than you'd like, but you'll get it done. But the speed of innovation in machine learning and large language models has been dizzying, and in 2024 you can snap a photo with your phone and have an app like Be My AI or Seeing AI tell you where in that picture it found your missing coffee mug, or where it thinks the light switch is. Creative switch locations seem to be a point of pride for hotels, so the light game may be good for a few rounds of quality entertainment, regardless of how good your AI is. This is big. It's hard for me to state just how exciting and empowering AI image descriptions have been for me without sounding like a shill. In the past year, I've: Found shit in strange hotel rooms. Gotten descriptions of scenes and menus in otherwise inaccessible video games. Requested summaries of technical diagrams and other materials where details weren't made available textually. I've been consistently blown away at how impressive and helpful AI-created image descriptions have been. Also... Which thousand words is this picture worth? As a bli ## Supercharge your apps with Firebase and the Gemini API DevFeed: [Supercharge your apps with Firebase and the Gemini API]() Original publisher: [Read original article]() Author: Alexander Nohe; Frank van Puffelen Published: 2024-02-15T00:00:00Z Content type: tutorial Language: en Sources: [Firebase Blog]() Topics: [Firebase](), [Generative AI](), [Google AI](), [Firestore](), [Chat Bot](), [Image]() Tags: [ai](), [ai-studio](), [alt-text](), [chatbots](), [extensions](), [firebase](), [firestore](), [gemini](), [generative-ai](), [how-to](), [learn](), [web]() ### AI overview This tutorial explains how Firebase Extensions can integrate the Gemini API into applications. It demonstrates building a conference-session chatbot and automatically generating accessible alt text for images, with data stored in Firestore and behavior guided by prompts. ### Source excerpt Learn how to easily integrate Google's powerful Gemini into your Firebase apps. Build conversational chatbots and auto-generate image alt text with code-free simplicity. ## Opportunities for AI in Accessibility DevFeed: [Opportunities for AI in Accessibility]() Original publisher: [Read original article]() Author: by Aaron Gustafson Published: 2024-02-07T14:00:00Z Content type: opinion Language: en Sources: [A List Apart: The Full Feed]() Topics: [Accessibility](), [Artificial Intelligence](), [alt text](), [Computer vision](), [foundation-models]() Tags: [accessibility](), [accessibility-code-content-workflow-tools](), [ai](), [alt-text](), [code](), [computer-vision](), [content](), [foundation-models](), [microsoft](), [workflow-tools]() ### AI overview The article argues that, despite serious risks and limitations, AI could support accessibility when used thoughtfully and inclusively. It focuses on computer-vision systems for generating alt text, noting their difficulty understanding image context and distinguishing meaningful images from decorative ones. The author supports human-in-the-loop workflows in which AI provides an initial suggestion that people can review and improve. ### Source excerpt In reading Joe Dolson's recent piece on the intersection of AI and accessibility, I absolutely appreciated the skepticism that he has for AI in general as well as for the ways that many have been using it. In fact, I'm very skeptical of AI myself, despite my role at Microsoft as an accessibility innovation strategist who helps run the AI for Accessibility grant program. As with any tool, AI can be used in very constructive, inclusive, and accessible ways; and it can also be used in destructive, exclusive, and harmful ones. And there are a ton of uses somewhere in the mediocre middle as well. I'd like you to consider this a "yes... and" piece to complement Joe's post. I'm not trying to refute any of what he's saying but rather provide some visibility to projects and opportunities where AI can make meaningful differences for people with disabilities. To be clear, I'm not saying that there aren't real risks or pressing issues with AI that need to be addressed--there are, and we've needed to address them, like, yesterday--but I want to take a little time to talk about what's possible in hopes that we'll get there one day. Alternative text Joe's piece spends a lot of time talking about computer-vision models generating alternative text. He highlights a ton of valid issues with the current state of things. And while computer-vision models continue to improve in the quality and richness of detail in their descriptions, their results aren't great. As he rightly points out, the current state of image analysis is pretty poor--especially for certain image types--in large part because current AI systems examine images in isolation rather than within the contexts that they're in (which is a consequence of having separate "foundation" models for text analysis and image analysis). Today's models aren't trained to distinguish between images that are contextually relevant (that should probably have descriptions) and those that are purely decorative (which might not need a description) eit ## How to Add Content Descriptions in Compose - A Guide for Android Devs DevFeed: [How to Add Content Descriptions in Compose - A Guide for Android Devs]() Original publisher: [Read original article]() Author: Eevis Panula Published: 2023-11-15T04:09:02.862000Z Content type: tutorial Language: en Sources: [Eevis Blog]() Topics: [Compose](), [Accessibility](), [Android](), [Android Studio](), [alt text]() Tags: [accessibility](), [alt-text](), [android](), [android-studio](), [compose](), [guide](), [how-to]() ### AI overview This guide explains how Android developers should use Compose contentDescription values as text alternatives for meaningful images, icons, and graphs. It covers accessibility for screen reader and voice access users, common mistakes such as using icon names, and the relationship between Android content descriptions and web alt text. ### Source excerpt When it comes to the contentDescription-attribute, I've noticed a couple of things Android devs do that are wrong and make apps harder to use with assistive technology. The first thing I see a lot is setting the content description of an icon to the icon name, such as icon_cat_sleeping. Another thing is suppressing the warnings Android Studio gives about missing content descriptions. I decided to write about this theme, and in this blog post, you'll learn about content descriptions: the problems and solutions. And yes, you'll understand why those things I mentioned in the previous paragraph are problematic. Let's start discussing content description, then continue with how to write one, and finally, how to set the content description. What Content Description Is When I talk about content description, I mean text alternative. If you have any background in web development or, e.g., using any social media platforms, you might have heard about the word "alt text". They mean the same thing and different environments have different names for this concept. In Android, the attribute is called contentDescription, and I think that content description is actually a very explanatory name for what we're trying to accomplish with it: describing the content of an image or a graphic. One thing that's important to remember is who we are describing the content for: Users who utilize the accessibility APIs. This means, for example, screen reader and voice access users. Screen reader users rely on the content descriptions for visual content (that they usually can't see, depending on their sight level), and voice access users can use these values as labels to interact with elements, such as buttons. Content descriptions should be added for meaningful visual elements like images, icons, and graphs. For some of the elements, it's more straightforward, but for, for example, different types of graphs, it's more complicated. This blog post won't go into details on adding content descriptions ## Announcing FigJam screen reader support DevFeed: [Announcing FigJam screen reader support]() Original publisher: [Read original article]() Author: Figma Published: 2023-05-16T00:00:00Z Content type: article Language: en Sources: [Figma Blog]() Topics: [Web Accessibility (a11y)](), [Figma](), [User interface design](), [Icon font](), [aria]() Tags: [accessibility](), [alt-text](), [aria](), [collaboration](), [figma](), [release](), [ui](), [updates](), [web-accessibility]() ### AI overview Figma announces official screen reader support for FigJam after a beta period. The update enables screen reader and keyboard-only users to navigate the canvas, menus, and screens while creating, editing, and reading file structures, text shapes, stickies, tables, and image alt text. Some features, including cursor chat, voting, widgets, and freeform vector nodes, are not yet supported. ### Source excerpt We sat down with the accessibility team to talk about the journey from beta to official release and share tips for anyone who'd like to use these updates to make their FigJam files more accessible. ## Are you making these five mistakes when writing alt text? DevFeed: [Are you making these five mistakes when writing alt text?]() Original publisher: [Read original article]() Author: Daniel Sage Published: 2023-03-02T00:00:00Z Content type: article Language: en Sources: [The A11Y Project]() Topics: [alt text](), [Accessibility](), [Search engine optimization (SEO)](), [User experience (UX)](), [HTML]() Tags: [accessibility](), [alt-text](), [article](), [html](), [seo](), [ux](), [writing]() ### AI overview This article examines common mistakes in writing alt text and explains why simply describing what an image looks like may not communicate its meaning or purpose. It introduces the distinction between an HTML alt attribute and the text placed inside it, including when an image should use an empty alt attribute. The discussion draws on accessibility, UX, SEO, and low-vision perspectives. ### Source excerpt There are many benefits to writing alt text for images, especially from accessibility and legal standpoints. But most don't know how to write alt text well. I should know because, for an awful number of years, I was one. I first learned about alt text in high school while building websites. But my proper lesson began when I took the Udacity Digital Marketing Nanodegree course, which was also my first introduction to marketing. Screenshot from the SEO module of the Udacity Marketing Nanodegree course. In this module, I learned about building easy navigation site structures, title tags, breadcrumbs, and meta descriptions--all the good stuff. We also learned about writing alt text and its importance. Their overall advice? Describe what you see. I thought that I finally understood it. Sometimes it is simplicity that kills When you ask them, most experts' advice also boils down to: Describe what you see. And while it's valid advice and may seem simple, it's not. Take the Udacity example earlier: Is this suitable alt text? Source: Udacity Nanodegree Marketing Course. If you close your eyes and someone reads out the words "eating apple heart disease" to you, does that in any way help you make sense of what's in the image? What about this example? Source: Business Insider. Does it? The answer is a big no. I used to just describe what I saw Then two weeks ago, I watched Tommy Walker, an ex-Shopify senior content marketer and editor, critique an article for its alt text usage. A snippet from The Cutting Room Show, hosted by Tom Walker. Notice that the alt text does not communicate what the audit results are. Ironically, the article was arguing for accessibility. But it made the point clearer. And for the first time, it dawned on me that I've been writing alt text the wrong way. This got me curious, so I started researching: I read numerous UX and SEO blogs, I spoke with practitioners in those fields, and I chatted with some members of the low vision community. Here's what I le ## How Can Backend Developers Improve Accessibility? DevFeed: [How Can Backend Developers Improve Accessibility?]() Original publisher: [Read original article]() Author: Eevis Panula Published: 2023-01-03T08:57:42.731000Z Content type: tutorial Language: en Sources: [Eevis Blog]() Topics: [Back end](), [Accessibility](), [API](), [Documentation](), [Database]() Tags: [accessibility](), [alt-text](), [api](), [backend](), [documentation](), [html](), [keyboard](), [language]() ### AI overview This article explains how backend developers can improve accessibility through API design, accessible documentation, localization, performance considerations, and backend-rendered pages. It gives examples such as requiring alt text or decorative-image indicators when images are uploaded. ### Source excerpt This question might feel a bit strange. Backend developers often touch the UI less, so they don't need to care, right? I beg to differ. This blog post will look at some practices backend developers can do to ensure the accessibility of the end product and documentation. We'll look into API structure, documentation, performance aspects, and backend rendered pages. This is in no way an exhaustive list of things, and there is definitely more backend devs can do, but let's start with these four. API structure There is actually a huge opportunity to improve accessibility when building APIs. This opportunity comes from reusable structures and ensuring that the content requires accessible roles, names, states, or properties. Also, APIs can enforce requiring things like having captions and transcripts for videos and audio content. One concrete example of API supporting accessibility is images. When uploading an image, the API should require an alternative text or information that the image is decorative. So, when validating the sent input, there should be a check for having the alt-text (for example, as a separate parameter). And if the image is purely decorative, and thus the alt-text is not needed, then, for example, a boolean value indicating that. Localization is another thing that helps with accessibility. Enabling people to use products in their native language can make barriers smaller. When designing an API, developers should consider localization and how that API can support it. I know there are cases where another service handles localization, or it's handled in the front end, but it's rarely only about the texts on the site. Often values stored in the database should be localizable too. Documentation Another aspect where backend developers can help with accessibility is the documentation. There are two sides to this: The site or platform, and the content. Platform or Site First of all, the site where the documentation is should be accessible. So, for example, the ## Don't Develop Just for Yourself - A Developer's Checklist to Accessibility DevFeed: [Don't Develop Just for Yourself - A Developer's Checklist to Accessibility]() Original publisher: [Read original article]() Author: Eevis Panula Published: 2023-01-03T08:57:24.089000Z Content type: tutorial Language: en Sources: [Eevis Blog]() Topics: [Accessibility](), [keyboard](), [Usability](), [alt text](), [aria](), [ui]() Tags: [accessibility](), [alt-text](), [aria](), [authoring](), [automated](), [blog-post](), [developer](), [keyboard](), [testing](), [usability](), [web](), [website]() ### AI overview A beginner-oriented accessibility checklist for developers. It recommends manually testing keyboard navigation, focus visibility, and other website interactions after automated testing, while noting that the process does not guarantee full accessibility. ### Source excerpt We, as developers, tend to develop sites unconsciously for people like ourselves. If we don't actively pay attention, the sites are often accessible only for certain types of people: Sighted mouse-users, who have good fine motor skills and are good at using computers. It leads to moments where no one who navigates the web with only a keyboard (or keyboard simulating device) can access and interact with the site. It is a pretty big group of people! We have a responsibility to make sites that work for all of our users. In some cases, it is required by law, but it is not the only reason we should care. This blog post is aimed for those at the beginning of their accessibility journey. You might know some things, like "always provide an alt-text for an image," but are unsure what to write there. Or you don't have any idea how to know if your site is accessible at all. Following this blog post won't make your site 100% accessible! The goal of this post is to provide some information about some things to check manually after using some automated testing. Keyboard Navigation First of all, abandon your mouse for a second. Don't use it. Try to navigate through the website using only the keyboard. Try to complete every task user needs to be able to complete on the website. Can you do it? Can you see where you are at the moment? Is the focus indicator (yes, that thing many designers and developers like to remove) visible enough? If you can't use the whole website with only a keyboard, that is an accessibility and usability problem. However, one thing to note here is that keyboard interaction is not necessarily accomplished with just tab and enter, as it has been at some point. The general pattern goes, as WAI-ARIA Authoring Practices state: A primary keyboard navigation convention common across all platforms is that the tab and shift+tab keys move focus from one UI component to another while other keys, primarily the arrow keys, move focus inside of components that include mult ## A step forward in our accessibility efforts DevFeed: [A step forward in our accessibility efforts]() Original publisher: [Read original article]() Author: Rachel Miller; KC Oh Published: 2022-05-19T00:00:00Z Content type: article Language: en Sources: [Figma Blog]() Topics: [Accessibility](), [Figma](), [alt text](), [Canvas](), [HTML](), [User interface design](), [Web]() Tags: [accessibility](), [alt-text](), [compliance](), [dark-mode](), [design](), [figma](), [html](), [prototypes](), [prototyping](), [web]() ### AI overview Figma announces a prototype screen reader beta designed to make prototyping more accessible to blind and low-vision users. The feature supports text notes, image alt text, prototype navigation, buttons, and keyboard actions. Figma converts prototypes into an HTML representation that screen readers can interpret, and the beta is intended to gather community feedback. ### Source excerpt Announcing a prototype screen reader beta as part of our vision to make design accessible to all. ## Starting a design with accessibility DevFeed: [Starting a design with accessibility]() Original publisher: [Read original article]() Author: Steve Barnett Published: 2021-08-25T00:00:00Z Content type: tutorial Language: en Sources: [The A11Y Project]() Topics: [Accessibility](), [HTML](), [alt text](), [html elements](), [Figma](), [Sketch]() Tags: [accessibility](), [alt-text](), [html](), [html-elements](), [presentation]() ### AI overview This article explains how to begin a design with accessibility in mind. It recommends creating a text-only design first to clarify content, structure, reading order, focus order, image information, link and button text, and form labels, followed by an HTML-only design using semantic elements before adding CSS or layout. ### Source excerpt Designing with accessibility in mind from the start is even better than reviewing a design for accessibility. It helps us consider the wide range of people who use our products and services. Here are three things we can do to start a design with accessibility. Do a text-only design Doing a text-only design to helps us clarify the order and content of a page. What to do We can write out the design in text before opening up our favorite design tool (like Sketch or Figma or Adobe XD). Start by making a numbered list with pen and paper, or in a text editor. Write out the: Section headings, Content and function of each image, Text of each link, Text of each button, and Name of each form element. Why to do it Writing the content in a numbered list lets us be clear on: The source order of elements in the HTML. This is the order that a screen reader will read the page in. The hierarchy of elements on the page. This helps us make choices about layouts on different screen sizes. The focus order of the page. This helps us make sure it's logical and meaningful. Writing headings lets us divide the page up into logical sections. Screen reader users often use headings as a way of navigating around a page. Writing the text of images means we'll already have alt text (or something that's a good start on it). It helps us be clear on what information (if any) the image is conveying. Writing the text for links highlights why "Click here" isn't helpful link text. Link text should describe where the person goes when they follow the link. Writing the text for buttons highlights why "Submit" usually isn't helpful button text. Button text should describe what happens when the person presses the button. Writing the names of form elements forces us to think of good labels. It forces us to think about the clearest name for each element. Do an HTML-only design Doing an HTML-only design helps us clarify the order and content of a page. It also helps us clarify the single function of each interac ## Everyday Accessibility DevFeed: [Everyday Accessibility]() Original publisher: [Read original article]() Author: Michele A Williams; PhD Published: 2021-06-15T00:00:00Z Content type: article Language: en Sources: [The A11Y Project]() Topics: [Accessibility](), [alt text]() Tags: [accessibility](), [alt-text](), [images](), [readability](), [social-media](), [speech](), [text-to-speech](), [writing]() ### AI overview This practical accessibility article explains how to make social media, digital, and multimedia content more inclusive. It recommends capitalizing words in hashtags, providing written text alongside images of text, adding concise alt text to images, limiting disruptive emoji use, and using built-in document styling features so assistive technologies can interpret content correctly. ### Source excerpt Even with the best of intentions, you may be making decisions that exclude disabled users. Below are practical, intentional steps you can start today to create and share more accessible social media, digital, and multimedia content. Watch this post as a video Social Media Posts Social media is central to the world's conversations, so ensure you're not leaving anyone out. Use capital letters in hashtags Punctuation helps text-to-speech tools like screen readers speak more accurately, and helps with readability overall. This includes in hashtags, where capital letters help distinguish words. Key Point: Make it a habit to #UseCapitalLetters rather than #hardtoreadlowercase. Don't share just images of text Images of text (such as your favorite quote or saying) can be difficult for people with visual impairments to read and don't allow people with reading difficulties to leverage text-to-speech read-aloud features. When posting these kinds of images, also write out the text in your post. Key Point: Typing out the text in an image makes the content more accessible. Use "alt text" features to describe images Pictures are significant in social media, but also inaccessible to visually impaired readers unless they have a text-based description. When uploading, find the "image description" or "alternative/alt text" feature in the software to write a description. For sample instructions, review Alt Text for Social Media. When adding descriptions, don't write every detail, just enough to ensure everyone can understand your post and share in the image's meaning. For examples, read Scott Vinkle's Considerations when writing alt text. Key Point: Features like Twitter's "Add description" allow adding "alt text" for visually impaired readers. Limit your emojis Emojis are great for emphasis and playfulness, but adding too many sounds cluttered with text-to-speech software. Also, when placed unconventionally (such as throughout a sentence) this is distracting and hard to read for those ## Alternate text and automation DevFeed: [Alternate text and automation]() Original publisher: [Read original article]() Author: Eric Bailey Published: 2021-03-23T00:00:00Z Content type: article Language: en Sources: [The A11Y Project]() Topics: [alt text](), [Accessibility](), [Web Content Accessibility Guidelines](), [Content Management System](), [Machine learning](), [Automation](), [WordPress]() Tags: [accessibility](), [alt-text](), [automation](), [code](), [computer-vision](), [machine-learning](), [web-content-accessibility-guidelines](), [wordpress]() ### AI overview The article explains that effective alt text helps people using assistive technology understand images and is required as part of WCAG. Although machine learning and computer vision can automate image descriptions in content management systems, automated descriptions may be inaccurate or incomplete, so human review remains necessary. ### Source excerpt Alternate (alt) text help people who use assistive technology understand images, and are a core part of the Web Content Accessibility Guidelines (WCAG). They require a human's input to be effective. To create alternate text, you add an alt attribute to an image that clearly and concisely describes what it is depicting: A bowl of tomato soup and a grilled cheese sandwich. Assistive technology such as a screen reader will read the text provided inside the alt attribute's opening and closing quotes. It may sound something like: Image. A bowl of tomato soup and a grilled cheese sandwich. This allows a person to know an image is present, and what the image's content contains. With this context, someone using assistive technology can understand the image's purpose the same way someone who is not using assistive technology would. It's up to the person writing the code to add an alt attribute. It's also up to them to look at the image they're using and write an accurate description. Many Content Management Systems (CMS) allow the people who use them to include alt text by writing it in a dedicated input field. WordPress' alt text input field for uploaded images. Automation Technologies such as machine learning and computer vision allow us to guess at what an image is based on its arrangements of pixels. For example, we might show a computer hundreds of thousands of photos of fire hydrants to train it to understand what configurations of pixels look "fire hydrant-ish." The idea is that you can take these technologies and apply them to a CMS or other publishing system. The publishing system would ideally then be able to automatically apply alternate text to any image uploaded by an author. The problem is that automated image description is not a perfect science. Many of these automated detection technologies are still new and unsophisticated. This means there's a good chance they haven't been taught what the image you ## Letters from Sarajevo DevFeed: [Letters from Sarajevo]() Original publisher: [Read original article]() Author: Stanko Published: 2020-03-26T00:00:00Z Content type: article Language: en Sources: [Stanko Tadić]() Topics: [Website](), [Jekyll](), [Open Source](), [GitHub](), [Netlify](), [JavaScript](), [alt text]() Tags: [alt-text](), [code](), [github](), [javascript](), [jekyll](), [netlify](), [open-source](), [website]() ### AI overview A personal project presents Letters from Sarajevo, a web adaptation of a book based on authentic family letters from Sarajevo during the war in the 1990s. The article describes redrawn illustrations, the site's open-source Jekyll setup, separate English and Serbian deployments, limited JavaScript, Netlify hosting, translation contributions, and its CC BY-NC 4.0 license. ### Source excerpt Today I have a very personal project to share with you all. Letters from Sarajevo is a web adaptation of the book of the same name. My brother wrote the book using authentic letters our father sent us while being stuck in Sarajevo during the war in the nineties. For more information about the book, please check about page. Illustrations # In the process of publishing the book, my father's original letters got lost. We were left with only low resolution scans. That's why I asked my friend Ivan, to redraw (and digitalize) all of the illustrations using scans as a reference. Ivan did an amazing job, just check the comparison below: Tech # The website is open source and the code is available on GitHub. The site is powered by Jekyll, and follows a very similar setup to my blog. The build process is a little bit more complicated, because there are two different versions deployed on two different domains. English versionSoon to become the international version with more translations. Serbian version There is almost no JavaScript at all, except the fix for vh units. I will probably sprinkle some JavaScript goodness, but only as a progressive enchainment. I don't want this to become a single page app. Everything is deployed on Netlify's free plan. Contributing # If you want to contribute, help with translations or you just have a suggestion, please open an issue here or leave a comment on this post. For translations, please note that each image has alt text as well. I'm super happy to say, the website is already being translated to more languages. Special kudos to my colleague Felipe who volunteered to provide Brazilian Portuguese translation. Everything on the website, including the code, is under CC BY-NC 4.0 license. I think the license is fair, as it allows people to share and adapt content as long the appropriate credit is given and it is for non-commercial purposes. Thank you # This project means a lot to my parents and myself. Please let us know if you enjoyed reading [Next page]()