Get It Seen The Simplest Way to Accessible Design

Get It Seen: The Simplest Way to Accessible Design 🔗 **Source:** [Get It Seen: The Simplest Way to Accessible Design](https://www.youtube.com/watch?v=i_CFW1UZOeA) > [!note]+ Document Notes > tags: [accessibility, web-design, alt-text] > author: Michelle Frechette > source: YouTube > reference: https://www.youtube.com/watch?v=i_CFW1UZOeA > date created: 2024-12-28 14:30 > > # 🏷️ Title: Get It Seen: The Simplest Way to Accessible Design >  ## 🧰 Action Inbox - [H1] Spell out acronyms at least once — context matters for understanding #accessibility - [H2] Write descriptive link text — avoid "click here" or "read more" #ux - [H3] Create contextual alt text — describe what matters for the purpose #images ## 🧭 Table of Contents - [📝 Summary](#-summary) - [📖 Main Content](#-main-content) - [🗒️ Notes](#️-notes) - [📚 References](#-references) - [🗣️ Paraphrase](#️-paraphrase) - [📰 Newsletter](#-newsletter) - [✅ Action Items](#-action-items) - [🧪 Hypotheses](#-hypotheses) - [📊 Methodology](#-methodology) - [❓ Questions](#-questions) - [🔮 Future Research](#-future-research) - [💡 Implications](#-implications) - [🧠 Learning Styles Assessment](#-learning-styles-assessment) - [📊 Accessibility Assessment](#-accessibility-assessment) - [🌍 DEIB Assessment](#-deib-assessment) - [✅ Logical Validity](#-logical-validity) - [🛡️ DARVO Analysis](#-darvo-analysis) - [🎯 Conclusion](#-conclusion) ### 🔗 References - [NASA Web Space Telescope Images Twitter](https://twitter.com/NASAHubble) - [We Rate Dogs Twitter](https://twitter.com/dog_rates) ## 📝 Summary - Discussion of accessible text design practices including alt text, acronyms, and link text - Alt text should be contextual rather than purely descriptive - purpose matters more than exhaustive detail - Acronyms create barriers for non-native speakers and people unfamiliar with industry jargon - Link text should describe destination rather than using generic phrases like "click here" - European Accessibility Act enforcement has begun with lawsuits against major retailers ## 📖 Main Content This session covers fundamental principles of accessible text design, focusing on three key areas: alt text for images, acronym usage, and link text best practices. **Alt Text Context Over Description**: The most important principle is that alt text should serve the content's purpose rather than exhaustively describe every visual element. A news article about weather canceling a horse race would describe the clear sky conditions, while a personal blog might focus on emotional connections to the location. NASA's space telescope images use poetic language to convey wonder and scientific detail that pure visual description cannot capture. **Acronym Accessibility**: Acronyms create significant barriers, especially for non-native English speakers and people unfamiliar with industry-specific terminology. Terms like CVD (Color Vision Deficiency) versus CVD (Cardiovascular Disease) demonstrate how context-dependent these abbreviations become. Some acronyms like radar, sonar, and laser have become standalone words, while others like LOL create generational and cultural divides. **Descriptive Link Text**: Screen reader users often navigate pages by jumping between links, making "click here" or "read more" completely meaningless out of context. Links should describe their destination or purpose, helping users understand where they'll be taken before clicking. ## 🗒️ Notes #### ⏱️ [00:02:30](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=150) — [H1] Text dominance on the web - Key idea: 95% of the internet is still text-based content - Evidence: "You can not do without text. You could do a whole web page without any images, without any video, but you couldn't do it without text" #### ⏱️ [00:05:45](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=345) — [H2] Alt text complexity and interpretation - Key idea: Alt text requires human interpretation that AI cannot fully replicate - Evidence: "What is crucial to all text is the context and how much to describe or not. Sometimes too much information is redundant" #### ⏱️ [00:08:12](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=492) — [H2] WordPress photo directory requirements - Key idea: Photo directory now requires alt text but quality varies significantly - Evidence: "You can't post a photo to the directory without supplying alt text for the image which is good but also challenging" #### ⏱️ [00:12:34](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=754) — [H1] Context-dependent alt text examples - Key idea: Same image needs different alt text depending on usage context - Evidence: "View of Piazza del Campo" becomes weather-focused for news or personal for blog posts #### ⏱️ [00:18:27](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=1107) — [H2] NASA's poetic alt text approach - Key idea: Alt text can convey wonder and scientific detail through creative language - Evidence: "The cloud-like structure of the nebula contains ridges, peaks and valleys, an appearance very similar to a mountain range" #### ⏱️ [00:22:15](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=1335) — [H3] Humor and creativity in alt text - Key idea: Alt text can be entertaining while remaining descriptive - Evidence: "His fuzzy ears stick straight up from his head. They are, it must be said, enormous" #### ⏱️ [00:26:43](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=1603) — [H2] Race and ethnicity in alt text - Key idea: Describing ethnicity in alt text requires careful contextual consideration - Evidence: "If I wouldn't say white because it's irrelevant because that's a bias, then I won't say any other ethnicity" #### ⏱️ [00:33:21](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=2001) — [H1] Acronyms as accessibility barriers - Key idea: Acronyms create significant barriers for non-native speakers - Evidence: "What's ETA? Estimated time of arrival. You should never assume anything" #### ⏱️ [00:37:52](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=2272) — [H3] Industry-specific acronym confusion - Key idea: Context determines acronym meaning, creating confusion across domains - Evidence: "CVD and I was like what is CVD... cardiovascular disease... it stood for color vision deficiency" #### ⏱️ [00:42:18](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=2538) — [H3] Acronyms that became words - Key idea: Some acronyms like radar, sonar, laser became standalone words - Evidence: "Radio detection and ranging radar... sound navigation and ranging" #### ⏱️ [00:46:35](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=2795) — [H2] Screen reader acronym pronunciation - Key idea: All caps makes screen readers spell out letters instead of pronouncing words - Evidence: "Screen readers read all caps as an acronym. You don't want to say S-O-N-A-R, you want to say sonar" #### ⏱️ [00:49:42](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=2982) — [H1] Link text accessibility principles - Key idea: Screen reader users navigate by links, requiring descriptive text - Evidence: "People that use a screen reader use links to navigate the page... those links need to be understandable out of context" #### ⏱️ [00:52:17](https://www.youtube.com/watch?v=i_CFW1UZOeA?t=3137) — [H3] European Accessibility Act enforcement - Key idea: Legal enforcement of accessibility has begun in Europe - Evidence: "Major retailers... told them sort your websites out by the 1st of September or we sue you" ## 📚 References - [We Rate Dogs Twitter Account](https://twitter.com/dog_rates) - [NASA Hubble Space Telescope Images](https://twitter.com/NASAHubble) - [WordPress Photo Directory](https://wordpress.org/photos/) - [European Accessibility Act](https://ec.europa.eu/social/main.jsp?catId=1202) ## 🗣️ Paraphrase - Alt text should serve the content's purpose rather than exhaustively describing every visual element, with context determining what details matter most for users - Acronyms create significant accessibility barriers, especially for non-native speakers and people unfamiliar with industry jargon, requiring explanation on first use - Link text must be descriptive enough to make sense when read out of context, as screen reader users often navigate pages by jumping between links ## 📰 Newsletter **Making Text Truly Accessible: Beyond the Basics** This week's accessibility focus tackles three fundamental areas where WordPress sites often fall short: alt text, acronyms, and link text. The key insight? Context matters more than completeness. **Alt Text That Serves Purpose**: Instead of describing every visual detail, focus on what matters for your content's goal. A product photo needs different alt text than the same image in a blog post about photography techniques. **Acronym Awareness**: Remember that CVD might mean "Color Vision Deficiency" to accessibility folks but "Cardiovascular Disease" to medical readers. Always spell out acronyms on first use. **Meaningful Links**: Screen reader users navigate by jumping between links. "Click here" tells them nothing, but "Download the 2024 accessibility audit checklist" sets clear expectations. Resources: [Learn WordPress](https://learn.wordpress.org/), [Developer Docs](https://developer.wordpress.org/), [WP-CLI](https://wp-cli.org/) ## ✅ Action Items #### WordPress - Core: Improve default "read more" link text generation with post titles - Documentation: Create alt text decision tree for different content contexts - Training: Develop accessibility lesson plans covering text, links, and acronyms - Photos: Enhance photo directory alt text review guidelines for moderators - Themes: Update theme review guidelines to check for descriptive link text - Accessibility: Audit existing documentation for unexplained acronyms #### Community - Maintainers: Review plugin documentation for accessible link text patterns - Contributors: Create first-issue programs focused on accessibility improvements - Sponsors: Fund accessibility audit tooling for automated link text checking ## 🧪 Hypotheses - Alt text quality improves when writers understand content context rather than following purely descriptive guidelines - Non-native English speakers struggle disproportionately with industry-specific acronyms in technical documentation - Screen reader navigation efficiency correlates with descriptive link text usage across WordPress sites - AI-generated alt text requires human review to capture contextual relevance and cultural sensitivity ### 📊 Methodology - Content analysis comparing alt text effectiveness across different usage contexts (news, personal blogs, e-commerce) - User testing with non-native speakers to identify acronym comprehension barriers - Screen reader user journey mapping to identify link text navigation pain points ### ❓ Questions - How can WordPress core better support contextual alt text without overwhelming content creators? - What automated tooling could help identify problematic acronym usage in documentation? - Should accessibility guidelines differ for global versus region-specific WordPress sites? ### 🔮 Future Research - AI-assisted alt text generation that considers content context and user intent - Cross-cultural accessibility testing for acronym and terminology usage - Integration between accessibility tools and content management workflows ### 💡 Implications - Practice: Content creators need context-specific alt text training rather than generic guidelines - Policy: European Accessibility Act enforcement will drive WordPress ecosystem improvements - Education: Accessibility training should emphasize cultural and linguistic barriers beyond technical compliance - Funding: Investment needed in human-AI collaboration tools for accessible content creation ### 🧠 Learning Styles Assessment Reading level estimate: Flesch-Kincaid Grade Level 8-9 #### 👀 Visual learners - Present: Screenshots of alt text examples, before/after link text comparisons - Improve: Flowchart for alt text decision-making, visual acronym impact examples #### 🔊 Aural learners - Present: Video format with clear verbal explanations and examples - Improve: Audio-only version focusing on screen reader user experience #### 🗣️ Verbal learners - Present: Multiple real-world examples, analogies comparing text accessibility to physical access - Improve: Glossary of accessibility terms, comparative examples across cultures #### 🧩 Kinesthetic learners - Present: Step-by-step alt text writing process, hands-on link text evaluation - Improve: Interactive alt text writing workshop, link audit checklist #### 🧠 Logical learners - Present: Context-based decision tree for alt text, systematic acronym guidelines - Improve: Accessibility compliance flowcharts, measurable improvement metrics #### 🧑‍🤝‍🧑 Social learners - Present: Collaborative discussion format, community examples and feedback - Improve: Peer review processes for alt text, group accessibility audits #### 🧘‍♀️ Solitary learners - Present: Individual examples and reflection prompts about personal experiences - Improve: Self-assessment tools, personal accessibility improvement tracking #### 🌿 Naturalistic learners - Present: Examples connecting digital accessibility to physical world barriers - Improve: Environmental metaphors for information accessibility ### 📊 Accessibility Assessment #### Screen reader semantics - Present: Clear heading structure, timestamped navigation, descriptive examples - Improve: ARIA labels for example sections, better landmark organization #### Keyboard navigation - Present: Standard video controls, logical tab order in transcript - Improve: Skip links for long examples, keyboard shortcuts documentation #### Contrast and readability - Present: High contrast text, readable font sizing - Improve: Dark mode compatibility, adjustable text sizing controls #### Text resizing and reflow - Present: Responsive video player, reflowing transcript text - Improve: Zoom compatibility testing, mobile-optimized viewing #### Media and captions - Present: Full transcript provided, clear audio quality - Improve: Time-synced captions, downloadable transcript formats #### Forms and interactions - Present: Basic video interaction controls - Improve: Accessible video speed controls, bookmark functionality ### 🌍 DEIB Assessment #### Cultural breadth - Present: Discussion of non-native English speaker challenges, global acronym confusion - Improve: More examples from non-Western contexts, multilingual accessibility considerations #### Inclusive language - Present: Thoughtful discussion of describing race/ethnicity in alt text - Improve: More guidance on cultural sensitivity, inclusive terminology examples #### Neurodiversity support - Present: Clear section breaks, consistent formatting, practical examples - Improve: Content warnings for potentially overwhelming examples, processing time considerations #### Representation - Present: Focus on barriers faced by different user groups - Improve: More diverse examples, voices from different disability communities #### Psychological safety - Present: Respectful discussion of accessibility challenges - Improve: Emphasis on learning versus judgment, safe spaces for questions ### ✅ Logical Validity #### Strong reasoning - Deductive strength: Context-dependent alt text principle well-established through multiple examples - Inductive strength: Acronym barriers demonstrated through personal experiences and cultural examples - Causal reasoning: Clear connection between descriptive link text and screen reader navigation - Analogical strength: Effective comparison between physical and digital accessibility barriers #### Fallacies - Hasty generalization: "95% of internet is text" claim acknowledged as unprovable but illustrative - Appeal to authority: NASA examples effective but could benefit from more diverse sources #### Tone of voice - Overall tone: Conversational and encouraging, emphasizing learning over compliance fear ### 🛡️ DARVO Analysis - Deny: No denial patterns detected - presenters acknowledge complexity and ongoing learning - Attack: No attacks on users or critics - focus remains on systemic improvements - Reverse victim/offender: No victim/offender reversals - clear focus on removing barriers - Emotional cues and rhetoric: Positive, solution-focused language encouraging accessibility adoption ## 🎯 Conclusion Accessible text design requires understanding context over completeness. Alt text shoul