Sign in

Accessibility Awareness

@a11yawareness.bsky.social
13K followers 1 following 2.4K posts

Helping you better understand web accessibility for people with disabilities. Created by @patrickmgarvin.bsky.social.

PostsRepliesMedia
Accessibility Awareness @a11yawareness.bsky.social · 5h
Don't forget transcripts for video and audio. These will help blind users and low-vision users, deaf and hard-of-hearing users, people with ADHD, and people with audio-processing disorders. Transcripts also benefit search engines, people in quiet spaces, and people in a hurry.
1156
Accessibility Awareness @a11yawareness.bsky.social · 7h
Screen reader users can navigate from heading to heading. If HTML headings are used correctly, this allows users to get a basic outline of content and find the information they’re looking for. The highest heading level is <h1> and <h6> is the lowest. developer.mozilla.org/en-US/docs/W...
developer.mozilla.org
<h1>–<h6> HTML section heading elements - HTML | MDN
The <h1> to <h6> HTML elements represent six levels of section headings. <h1> is the highest section level and <h6> is the lowest. By default, all heading elements create a block-level box in the…
094
Accessibility Awareness @a11yawareness.bsky.social · 10h
When creating a transcript, timestamps are useful, especially for synchronized transcripts. Include speaker names when there is more than one speaker in the video.
091
Accessibility Awareness @a11yawareness.bsky.social · 14h
Did you know each emoji has a coded description that gets read aloud by screen readers? This demo by Alexa Heinrich shows what happens when a screen reader encounters a post that uses an emoji to function as a bullet point. www.youtube.com/watch?v=MSMs...
youtube.com
Taylor Nation Emoji Bullet Point Tweet
Demonstration of what a tweet with emoji used as bullet points sounds like when read by a screen reader. The tweet also uses a "show more" cut, which isn't accessible when the tweet is seen in the…
11611
Accessibility Awareness @a11yawareness.bsky.social · 03/10/2026
For people just getting introduced to accessibility concepts, the number of resources can be overwhelming for people who don't know where to start. These 10 tips from Lireo Designs can be a good way to introduce your team to the basics. www.lireo.com/10-ways-to-i...
lireo.com
10 Ways to Improve Accessibility on Websites and Social Media - Lireo Designs
My 10 tips for making your website and social media more accessible, whether you're a blogger, photographer, writer, designer, or developer.
1187
Accessibility Awareness @a11yawareness.bsky.social · 03/10/2026
Automatic transcription can be much faster than manual transcription, but it's not as accurate. Humans can catch errors that software may miss because of background noise or poor audio quality. Always review and edit transcripts before publishing.
073
Accessibility Awareness @a11yawareness.bsky.social · 02/10/2026
Alt text is not the same as a photo caption. Captions are typically written to support a photo, and usually depend on users being able to see the photo. But alt text is meant to be the stand-in for the photo. The alt text is what a screen reader user gets in place of the photo.
19556
Accessibility Awareness @a11yawareness.bsky.social · 01/10/2026
Cognitive load refers to how much working memory or short-term memory someone is using at a time. Minimizing the cognitive load it takes to use your site makes it more accessible for people with cognitive disabilities. Limit what you're asking users to remember to use your site.
0222
Accessibility Awareness @a11yawareness.bsky.social · 01/10/2026
Don't use color alone to convey information. Marking required fields by only using colored labels won't help people who use screen readers or who can't distinguish colors. If using color, also add text like asterisks and/or "required." www.w3.org/WAI/tips/des...
w3.org
Designing for Web Accessibility – Tips for Getting Started
Summary
0114
Accessibility Awareness @a11yawareness.bsky.social · 01/10/2026
Hyperlink text should make sense when read out of context. Screen reader users can navigate from link to link, and can listen to links in a list. When navigating this way, only the link is read. So "click here" or "read more" won't make sense.
04520
Accessibility Awareness @a11yawareness.bsky.social · 01/10/2026
People often have difficulty reading content when there isn’t sufficient contrast, so it's important to have high color contrast. TPGi’s free color contrast checker tool allows you to determine the contrast ratio of two colors by using an eye-drop tool. developer.paciellogroup.com/color-contra...
developer.paciellogroup.com
Colour Contrast Analyser (CCA) - Vispero
Colour Contrast Analyser (CCA) Use Vispero’s free color contrast checker to optimize your content – including text and visual elements – for individuals with color-blindness or low vision…
053
Accessibility Awareness @a11yawareness.bsky.social · 30/09/2026
Beware of companies promising to make sites completely accessible, compliant, and immune from lawsuits with just a few lines of code. This just isn't possible. Disabled users have long said these tools don't actually help them, and can often make things worse.
0112
Accessibility Awareness @a11yawareness.bsky.social · 30/09/2026
For screen readers to recognize headings, heading text can't just be body text or normal text that's been made to look bigger and bolder. It must be formatted as a heading. In Microsoft Word and Google Docs, this can be done in the styles box. In HTML, use the tags h1 through h6.
0135
Accessibility Awareness @a11yawareness.bsky.social · 30/09/2026
Accessibility awareness and training are good first steps, but they aren't the end. Teams need to create accessibility policies and strategies based on that training and newfound knowledge. Managers must empower people to enforce policies to make sure everyone does their part.
074
Accessibility Awareness @a11yawareness.bsky.social · 30/09/2026
Overlays are widgets or technologies that promise to improve a site's accessibility with third-party source code. More than 1,000 accessibility advocates and web developers have signed an open letter to explain the limitations and dangers of these products. overlayfactsheet.com
overlayfactsheet.com
https://overlayfactsheet.com/en/
091
Accessibility Awareness @a11yawareness.bsky.social · 27/09/2026
Ensure text is readable in data visualizations and information graphics. Small text is generally harder to read, and should be avoided where possible. Make sure the text is not obstructed by other chart elements, and has sufficient contrast against its background.
092
Accessibility Awareness @a11yawareness.bsky.social · 27/09/2026
The same image can be used in multiple contexts and need to have different alt text in each instance. As Sheri Byrne-Haber points out in this blog post, context is a critical aspect of alt text that many people miss. www.sheribyrnehaber.com/context-is-t...
sheribyrnehaber.com
Context is the most critical aspect of alt-text everyone seems to miss - Sheri Byrne-Haber's Blog
This is the article I SWORE I would never write. But I have a different perspective on alt-text than most accessibility managers, so I decided to share it.
0179
Accessibility Awareness @a11yawareness.bsky.social · 27/09/2026
Automated captions and transcripts can save time so that you don't have to manually transcribe on your own. But automated captions and transcripts aren't 100% accurate, so they need manual editing before you publish them. www.w3.org/WAI/media/av...
w3.org
Captions/Subtitles
Helps you understand and create captions (also called “subtitles”) for audio and video media accessibility.
052
Accessibility Awareness @a11yawareness.bsky.social · 26/09/2026
When using Microsoft Word or Google Docs, don't just make text bigger and bolder to make it a heading. That will work for sighted users, but screen reader users will miss that and just hear it as normal paragraph text. Use actual heading styles, like level 1 through 6.
0155
Accessibility Awareness @a11yawareness.bsky.social · 26/09/2026
When picking fonts, use simple, familiar, and easily-parsed fonts. Avoid character complexity and ambiguity. Use a limited number of typefaces, fonts, and variations. Consider spacing and weight. Ensure sufficient contrast between the text and background. Avoid small font sizes.
092
Accessibility Awareness @a11yawareness.bsky.social · 25/09/2026
In charts and data visualizations, avoid overwhelming people with information. Keep the design simple and clear. Avoid animations as they can be distracting and disorienting. If you must include some type of movement or animation, provide a way for people to turn it off.
084
Accessibility Awareness @a11yawareness.bsky.social · 24/09/2026
Automatically updating content can be extremely distracting, especially for users with vestibular disorders or attention difficulties. This could force users to scroll through page content to not see the animation, or to just look away. Allow animations to be paused or stopped.
0133
Accessibility Awareness @a11yawareness.bsky.social · 24/09/2026
Avoid jargon whenever possible. When you have to use terms that might not be commonly known or used among your audience, explain what these terms mean. If you can't avoid a lot of specific terms, include a glossary of terms that users can refer to when needed.
1113
Accessibility Awareness @a11yawareness.bsky.social · 24/09/2026
Consistent layout makes websites easier to navigate and understand as it helps users learn what elements to expect and in what order. This is especially helpful to low vision users or blind users using a screen reader. It also helps those with cognitive and learning disabilities.
083
Accessibility Awareness @a11yawareness.bsky.social · 24/09/2026
The Xbox Accessibility Guidelines are a set of best practices compiled by industry experts, gamers, and disabled people. The guidelines have been written to help developers, designers, and testers make games more accessible to people with disabilities. learn.microsoft.com/en-us/gaming...
learn.microsoft.com
Xbox Accessibility Guidelines - Microsoft Game Dev
Game development documentation for creating accessible games.
030
Accessibility Awareness @a11yawareness.bsky.social · 23/09/2026
Don't use headings to arbitrarily style text. If you apply “Heading 4” style, you add a <h4> heading tag to the item. When screen reader users navigate from heading to heading, the item will be treated as a heading. This will be confusing. Only treat actual headings as headings.
0177
Accessibility Awareness @a11yawareness.bsky.social · 23/09/2026
The difference between "full verbatim" and "clean verbatim" transcripts: Full verbatim captures spoken word exactly as stated, including filler words, stutters and false starts. Clean verbatim has words exactly as stated, but edits the filler words, repeated words and stutters.
0202
Accessibility Awareness @a11yawareness.bsky.social · 23/09/2026
If you pair light colors (yellow text on white background) or dark colors (dark blue text on black background), users will struggle to read your content. Understanding color contrast will help you better serve all users, especially those with low vision. webaim.org/articles/con...
webaim.org
WebAIM: Contrast and Color Accessibility - Understanding WCAG 2 Contrast and Color Requirements
Search:
0141
Accessibility Awareness @a11yawareness.bsky.social · 23/09/2026
For beginners, it can be difficult to know what to put in alt text, as well as when alt text is needed and when it isn't. This decision tree from @w3c helps you determine what to do, based on specific situations. www.w3.org/WAI/tutorial...
w3.org
An alt Decision Tree
Accessibility resources free online from the international standards organization: W3C Web Accessibility Initiative (WAI).
01910
Accessibility Awareness @a11yawareness.bsky.social · 22/09/2026
If you use the clapping hands emoji between every word for emphasis, screen reader users will hear "clapping hands" after each word. This is true for any emoji. This will be distracting, annoying, and disorienting. The message you're trying to emphasize will likely be lost.
14920
Accessibility Awareness @a11yawareness.bsky.social · 22/09/2026
When writing alt text, be specific but also succinct. Stick to as few words as you can. Is the clothing relevant? Is the color of the plate important? What about the weather in the background? Decide whether this info adds or distracts from the context of the image.
0238
Accessibility Awareness @a11yawareness.bsky.social · 22/09/2026
People should be able to understand content the first time they read or hear it. No one should need a legal background or a Latin dictionary to understand a website. Users should be able to absorb content and instructions without needing to make sense of stuffy, stilted language.
1164
Accessibility Awareness @a11yawareness.bsky.social · 22/09/2026
Hyperlink text should make sense when read out of context. Screen reader users can navigate from link to link, and can listen to links in a list. When navigating this way, only the link is read. So "click here" or "read more" won't make sense.
01912
Accessibility Awareness @a11yawareness.bsky.social · 21/09/2026
Consistent layout makes websites easier to navigate and understand as it helps users learn what elements to expect and in what order. This is especially helpful to low vision users or blind users using a screen reader. It also helps those with cognitive and learning disabilities.
0196
Accessibility Awareness @a11yawareness.bsky.social · 21/09/2026
Capitalization affects how people read hashtags or how people hear them on screen readers. Use #camelCase or #PascalCase in hashtags instead of lowercase. You could have #DoctorWhoRewatch ("Doctor Who Rewatch") or #doctorwhorewatch ("doctor whore watch.")
02312
Accessibility Awareness @a11yawareness.bsky.social · 20/09/2026
Automatic transcription can be much faster than manual transcription, but it's not as accurate. Humans can catch errors that software may miss because of background noise or poor audio quality. Always review and edit transcripts before publishing.
0145
Accessibility Awareness @a11yawareness.bsky.social · 20/09/2026
Use labels or instructions whenever user input is required. Clear and unambiguous directions and labels help all users, but especially those with cognitive, language, and learning disabilities. Clear labels prevents users from making incomplete or incorrect form submissions.
072
Accessibility Awareness @a11yawareness.bsky.social · 20/09/2026
Templates could be designed and coded according to web accessibility standards, but this won't ensure that the final product would be accessible. Content creators still need to know about key accessibility concepts, including alt text, link text, and proper headings.
083
Accessibility Awareness @a11yawareness.bsky.social · 20/09/2026
Don't use headings to arbitrarily style text. If you apply “Heading 4” style, you add a <h4> heading tag to the item. When screen reader users navigate from heading to heading, the item will be treated as a heading. This will be confusing. Only treat actual headings as headings.
030
Accessibility Awareness @a11yawareness.bsky.social · 19/09/2026
Ensure text is readable in data visualizations and information graphics. Small text is generally harder to read, and should be avoided where possible. Make sure the text is not obstructed by other chart elements, and has sufficient contrast against its background.
073
Accessibility Awareness @a11yawareness.bsky.social · 19/09/2026
Beware of companies promising to make sites completely accessible, compliant, and immune from lawsuits with just a few lines of code. This just isn't possible. Disabled users have long said these tools don't actually help them, and can often make things worse.
12310
Accessibility Awareness @a11yawareness.bsky.social · 19/09/2026
For screen readers to recognize headings, heading text can't just be body text or normal text that's been made to look bigger and bolder. It must be formatted as a heading. In Microsoft Word and Google Docs, this can be done in the styles box. In HTML, use the tags h1 through h6.
0155
Accessibility Awareness @a11yawareness.bsky.social · 19/09/2026
Many struggle with writing alt text for charts and other other data visualizations. Amy Cesal's "Writing Alt Text for Data Visualization" hammers home the importance of explaining the chart type, the type of data, and the reason for the chart. medium.com/nightingale/...
medium.com
Writing Alt Text for Data Visualization
How do you write text that conveys the whole meaning of a visualization? You probably can’t. But that doesn’t mean that you shouldn’t try
0157
Accessibility Awareness @a11yawareness.bsky.social · 19/09/2026
The #NoMouse Challenge is a global effort to raise awareness about accessible web design. Try using your website without a mouse. Use the keyboard instead. Is it possible to access all features and operate all buttons, sliders, and other controls? nomouse.org
nomouse.org
The #NoMouse Challenge
The #NoMouse Challenge is a global effort to raise awareness about accessible web design. Just follow these three simple steps:
0217
Accessibility Awareness @a11yawareness.bsky.social · 18/09/2026
Like most other disciplines, accessibility takes practice, time, and patience. No one starts a new endeavor and is instantly excellent at it with nothing to learn. If your beginning goal is absolute perfection, you'll burn out. You'll find excuses to not try. Get started and try.
0214
Accessibility Awareness @a11yawareness.bsky.social · 18/09/2026
In charts and data visualizations, avoid overwhelming people with information. Keep the design simple and clear. Avoid animations as they can be distracting and disorienting. If you must include some type of movement or animation, provide a way for people to turn it off.
091
Accessibility Awareness @a11yawareness.bsky.social · 18/09/2026
Some will publish podcasts but wait up to 24 hours before adding transcripts instead of publishing them together. The end goal should be to have the transcript ready at the same time as the podcast. This will require multiple teams working together toward that goal.
0112
Accessibility Awareness @a11yawareness.bsky.social · 17/09/2026
When considering rainbow text, don't forget to consider readability and legibility. Text filled with rainbows can be difficult to read. Same with complex rainbow backgrounds. Putting each word or letter in a different color of the rainbow could force readers to work harder.
1112
Accessibility Awareness @a11yawareness.bsky.social · 16/09/2026
Make sure that interactive elements that can be accessed by using a mouse, pen, trackpad or touch are at least 24 by 24 CSS pixels. This helps people with low vision and/or limited motor control select the intended element without accidentally selecting nearby elements.
0157
Accessibility Awareness @a11yawareness.bsky.social · 16/09/2026
Headings serve as landmarks for users and help them understand how different pieces of information relate to each other. For example, a section with a level 3 headings probably provides information in support of information provided in the previous level 2 heading, and so on.
0111