Do You Have Blind Spots in Your Website Design? Accessibility
- Kimberly Lyn Vanzi
- Dec 20, 2024
- 6 min read
Updated: May 8
This became my life for a while — reading and listening to captions.
Have you ever considered what it feels like to navigate the digital world when your senses don’t work the way they used to? For millions of people, features like alt text and captions are not optional—they’re lifelines.
Accessibility Through My Eyes: Why Alt Text Matters
In 2007, my life changed in ways I could never have anticipated. At 37 years old, I was diagnosed with an autoimmune disease after months of unexplained illness. The treatment—a high dosage of cortisone—brought unexpected challenges. Simple tasks I once took for granted became daily struggles as I faced the loss of both hearing and vision.
I lost hearing in my left ear, and my right ear was deteriorating; I went blind in my right eye. The senses we often overlook became a source of fear and uncertainty. Those months were terrifying.
I suddenly found myself relying heavily on captions to stay connected—to follow conversations, understand videos, and engage with the digital world around me. These moments taught me how vital accessibility is in bridging gaps created by sensory loss.
Fortunately, my vision, though blurry, returned, and doctors were able to prevent complete hearing loss in my right ear. These experiences taught me that accessibility isn’t just about convenience—it’s about inclusion. For people with disabilities, features like alt text and captions are not optional; they can be the difference between isolation and engagement in a digital world.
The Emotional Toll of Losing Vision and Hearing
Losing my vision and hearing didn’t just mean losing two senses—it felt like losing my confidence, independence, and sense of control. Everyday tasks that once felt effortless became overwhelming. I struggled to navigate websites with small text, missed important phone notifications, and found it difficult to follow conversations or videos without captions. The fear of missing something critical was a constant source of anxiety, but even worse was the isolation that came from feeling disconnected.
Without the ability to see or hear clearly, I often felt cut off from the world around me. Losing my vision created a barrier to participating in everyday life, while losing my hearing turned even simple conversations into frustrating struggles. I worried that the partial silence might become permanent if my right ear followed suit, amplifying my sense of loneliness.
Simple moments became battles:
Deciphering small text on screens.
Straining to hear phone notifications or calls.
Relying on captions to understand TV shows or online videos.
The lack of connection left me feeling isolated as if the world was moving on without me. The frustration was constant, but the scariest part was the exclusion I felt. It’s a kind of loneliness no one should have to experience—especially in a world where technology has the power to foster connection and inclusion for everyone.
Discovering Text Readers and Accessibility Apps
Discovering text readers and accessibility apps became a turning point. They were my lifeline, helping me read text messages, navigate websites, and interact with the world again.
However, these tools are only as effective as the websites and videos they interact with.
For example:
Without Alt Text: I couldn’t “see” what was in product images when shopping online.
Without Clear Navigation: I couldn’t "find" the checkout button.
Without Captions, I could not "understand" what the video was discussing, which prevented me from accessing vital information.
Accessibility tools like text readers, alt text, and captions only work when websites are designed with these features in mind.
The Power of Alt Text, Captions, and Accessibility Tools
Here’s how alt text and captions work together to create an inclusive digital experience:
Alt Text (for Images):
Good Example: A woman wearing a red floral dress, standing in a sunlit garden, part of the summer collection.
Bad Example: Red dress sale, best deals, trendy fashion shopping. (Keyword stuffing without context)
Captions (for Videos):
Include full dialogue and important audio cues (e.g., “[Upbeat music playing]” or “[Door slams]”).
Avoid auto-generated captions without reviewing them for accuracy—errors can confuse or exclude viewers.
When these features are implemented well, they create a seamless experience for all users.
Best Practices for Alt Text and Captions
Here’s how you can make your website inclusive by crafting effective alt text and captions:
Alt Text for Images
Alt text describes images for people who can’t see them, ensuring they still understand the content’s context. Good alt text provides clear, specific details without overloading the user or stuffing keywords.
Good Example:
“A woman wearing a red floral dress, standing in a sunlit garden, part of the summer collection.”
Why: It provides a clear description of what’s in the image while giving context (e.g., the summer collection).
“A golden retriever puppy sitting on a blue rug, chewing a yellow tennis ball.”
Why: It describes the subject (puppy), setting (blue rug), and action (chewing a tennis ball).
Bad Example:
“Red dress sale, best deals, trendy fashion shopping.”
Why: It doesn’t describe the image and focuses on stuffing keywords.
“Puppy on a rug.”
Why: It’s too vague and doesn’t provide enough information about the image.
💡 Pro Tip: Avoid using phrases like “Image of…” or “Picture showing…” in alt text. Screen readers already indicate that it’s an image.
Alt Text for Functional Images
Not all images are decorative; some serve functional purposes, like buttons or icons.
Good Example:
For a “Submit” button: “Submit your information.”
For a magnifying glass icon: “Search the site.”
Bad Example:
“Button”
Why: It doesn’t explain the button’s purpose.
“Magnifying glass”
Why: It describes the icon but doesn’t convey its function.
💡 Pro Tip: For purely decorative images, leave the alt text empty (alt="") to prevent screen readers from reading unnecessary details.
Alt Text for Complex Images
Charts, graphs, and infographics need detailed descriptions to make them accessible.
Good Example:
A line graph showing website traffic growth:
“Line graph showing website traffic increasing steadily from January to June, with a peak of 10,000 visitors in May.”
An infographic about healthy eating:
“Infographic titled ‘Top 5 Healthy Foods,’ showing images of avocados, spinach, salmon, blueberries, and almonds, with a short description of each food’s benefits.”
Bad Example:
“Chart of website traffic.”
Why: It doesn’t provide meaningful information about the data.
"Healthy eating infographic with food images.”
Why: This description is vague and fails to provide specific details about the content or purpose of the infographic. It doesn't communicate what foods are depicted or what information the infographic is trying to convey, leaving users with no meaningful context.
💡 Pro Tip: For very detailed visuals, include a longer description in the text of your article or link to a page with more information.
Captions for Videos
Captions provide text equivalents of spoken words and sound cues, making videos accessible for people who are deaf or hard of hearing.
Good Practices for Captions:
Include all spoken dialogue.
Add descriptions of non-verbal audio cues (e.g., “[Laughter]” or “[Phone ringing]”).
For music, indicate mood or genre (e.g., “[Upbeat jazz music playing]”).
Good Example:
[Dialogue] “Welcome to our tutorial on accessibility.”
[Sound cue] [Door creaks open]
[Music] [Soft piano music fades in]
Bad Example:
Auto-generated captions: “Welcome to our trial on accessible tea.”
Why: Errors in auto-generated captions can confuse the viewer and distort the meaning.
Captions for Complex Audio Content
For webinars, tutorials, or videos with lots of background noise, accurate captions are critical.
Good Example:
Webinar on SEO:
“Today, we’ll discuss the top three SEO trends: mobile-first indexing, voice search, and content quality. [Typing sound in the background.]”
Bad Example:
Webinar on SEO:
“Today, we’ll discuss SEO trends.” (Leaves out context and key sound cues.)
💡 Pro Tip: Review captions thoroughly to ensure they match the audio, and check that timestamps align correctly with spoken content.
When These Features Work Well
When alt text and captions are done right, they provide a seamless experience for everyone:
A visually impaired user can understand a product image and make an informed purchase.
A deaf user can follow a tutorial with captions, learning just as effectively as hearing viewers.
A user with a slow internet connection can rely on captions to understand the content, even if the video lags.
By making small, thoughtful changes like these, you ensure your website and content are accessible to a wider audience.
Accessibility is Empowerment
People with disabilities need access to the same essentials as everyone else—food, clothing, transportation, communication, and entertainment. When a website is designed with accessibility in mind, it becomes a tool of empowerment.
Accessibility features like alt text and captions aren’t just about compliance—they’re about inclusion. It says:
We see you. You are valued. You belong here.
When websites include thoughtful accessibility features, they provide independence and inclusion for people with disabilities. Let’s make the digital world a place where everyone feels welcome.
A Call to Action: Let’s Make the Digital World Inclusive
Do you have blind spots in your website design? Are you unintentionally locking out users who need your services the most?
As someone who has lived with vision and hearing challenges, I know how vital accessibility features like alt text and captions are—not just for compliance but for connection and empowerment.
Gain practical insights and tools at my live Q&A session on January 13, 2025:
How to implement accessibility features like alt text and captions.
Preparing for the European Accessibility Act and its 2025 deadline.
Practical steps to ensure your website and videos are inclusive for everyone.
"The European Accessibility Act, set to take effect in 2025, mandates accessibility in digital content and services, ensuring inclusivity for users with disabilities." Read More
Don’t wait to make a difference!
Start transforming your website into a more inclusive and empowering space today. Contact me for tailored guidance, or join my live Q&A on January 13 to learn practical strategies and stay ahead of accessibility standards.
Comments