CINXE.COM
Elias, retiree with low vision, hand tremor, and mild short-term memory loss | Web Accessibility Initiative (WAI) | W3C
<!DOCTYPE html> <html class="no-js" lang="en" dir="ltr" prefix="og: http://ogp.me/ns#"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <script> document.documentElement.className = document.documentElement.className.replace('no-js', 'has-js'); function downloadJSAtOnload() { var element = document.createElement("script"); element.src = "/WAI/assets/scripts/main.js?1739541174349523255"; document.body.appendChild(element); } window.addEventListener("load", downloadJSAtOnload, false); </script> <link rel="stylesheet" href="/WAI/assets/css/style.css?1739541174349523255"> <title> Elias, retiree with low vision, hand tremor, and mild short-term memory loss | Web Accessibility Initiative (WAI) | W3C</title><!-- Begin Jekyll SEO tag v2.8.0 --> <meta name="generator" content="Jekyll v4.3.3" /> <meta property="og:title" content="Elias, retiree with low vision, hand tremor, and mild short-term memory loss" /> <meta name="author" content="W3C Web Accessibility Initiative (WAI)" /> <meta property="og:locale" content="en" /> <meta name="description" content="Accessibility resources free online from the international standards organization: W3C Web Accessibility Initiative (WAI)." /> <meta property="og:description" content="Accessibility resources free online from the international standards organization: W3C Web Accessibility Initiative (WAI)." /> <link rel="canonical" href="https://www.w3.org/WAI/people-use-web/user-stories/story-nine/" /> <meta property="og:url" content="https://www.w3.org/WAI/people-use-web/user-stories/story-nine/" /> <meta property="og:site_name" content="Web Accessibility Initiative (WAI)" /> <meta property="og:image" content="https://www.w3.org/WAI/content-images/people-use-web/social.png" /> <meta property="og:type" content="website" /> <meta name="twitter:card" content="summary_large_image" /> <meta property="twitter:image" content="https://www.w3.org/WAI/content-images/people-use-web/social.png" /> <meta property="twitter:title" content="Elias, retiree with low vision, hand tremor, and mild short-term memory loss" /> <meta name="twitter:site" content="@w3c_wai" /> <meta name="twitter:creator" content="@W3C Web Accessibility Initiative (WAI)" /> <script type="application/ld+json"> {"@context":"https://schema.org","@type":"WebPage","author":{"@type":"Person","name":"W3C Web Accessibility Initiative (WAI)"},"description":"Accessibility resources free online from the international standards organization: W3C Web Accessibility Initiative (WAI).","headline":"Elias, retiree with low vision, hand tremor, and mild short-term memory loss","image":"https://www.w3.org/WAI/content-images/people-use-web/social.png","url":"https://www.w3.org/WAI/people-use-web/user-stories/story-nine/"}</script> <!-- End Jekyll SEO tag --> <link rel="alternate" type="application/rss+xml" href="/WAI/feed.xml"> </head> <body id="top" class="page-elias-retiree-with-low-vision-hand-tremor-and-mild-short-term-memory-loss "> <nav aria-label="Skip Link and Language Selector" id="controls" class="default-grid"> <ul> <li><a href="#main">Skip to Content</a></li> <li class="opt"> <a href="/WAI/meta/customize/">Change Text Size or Colors</a> </li> <li class="opt"> <a href="/WAI/translations/">All Translations <svg focusable="false" aria-hidden="true" class="icon-translations "><use xlink:href="/WAI/assets/images/icons.svg#icon-translations"></use></svg></a> </li> </ul></nav> <header id="site-header" class="default-grid with-gap"> <div class="logos"> <a lang="en" class="home w3c" href="https://www.w3.org/"> <svg role="img" aria-label="W3C" viewBox="0 0 68 34" xmlns="http://www.w3.org/2000/svg"><g><path d="m16.117 1.006 5.759 19.58 5.759-19.58h4.17 11.444v1.946l-5.879 10.128c2.065.663 3.627 1.868 4.686 3.615 1.059 1.748 1.589 3.799 1.589 6.155 0 2.914-.775 5.363-2.324 7.348s-3.555 2.978-6.017 2.978c-1.854 0-3.469-.589-4.845-1.767-1.377-1.178-2.396-2.773-3.058-4.786l3.256-1.35c.477 1.218 1.106 2.178 1.887 2.879.781.702 1.701 1.052 2.76 1.052 1.112 0 2.052-.622 2.82-1.866.768-1.245 1.152-2.74 1.152-4.489 0-1.933-.411-3.429-1.231-4.488-.954-1.244-2.45-1.867-4.489-1.867h-1.588v-1.906l5.56-9.612h-6.712l-.382.65-8.163 27.548h-.397l-5.958-19.937-5.957 19.937h-.397l-9.53-32.168h4.17l5.759 19.58 3.892-13.185-1.906-6.395z"/><path d="m64.92 1.006c-.819 0-1.554.295-2.111.861-.591.6-.92 1.376-.92 2.178s.313 1.545.887 2.128c.583.591 1.334.912 2.145.912.793 0 1.562-.321 2.161-.903.574-.557.887-1.3.887-2.136 0-.811-.321-1.57-.878-2.136-.584-.592-1.344-.904-2.171-.904zm2.643 3.065c0 .701-.271 1.351-.768 1.832-.524.507-1.174.777-1.892.777-.675 0-1.342-.278-1.84-.785s-.777-1.157-.777-1.849.287-1.368.802-1.891c.481-.49 1.131-.751 1.84-.751.726 0 1.376.271 1.883.785.49.489.752 1.147.752 1.882zm-2.559-1.807h-1.3v3.445h.65v-1.469h.642l.701 1.469h.726l-.769-1.57c.498-.102.785-.439.785-.929 0-.625-.472-.946-1.435-.946zm-.118.422c.608 0 .886.169.886.591 0 .405-.278.549-.87.549h-.549v-1.14z"/><path d="m59.807.825.676 4.107-2.391 4.575s-.918-1.941-2.443-3.015c-1.285-.905-2.122-1.102-3.431-.832-1.681.347-3.587 2.357-4.419 4.835-.995 2.965-1.005 4.4-1.04 5.718-.056 2.113.277 3.362.277 3.362s-1.452-2.686-1.438-6.62c.009-2.808.451-5.354 1.75-7.867 1.143-2.209 2.842-3.535 4.35-3.691 1.559-.161 2.791.59 3.743 1.403 1 .854 2.01 2.721 2.01 2.721z"/><path d="m60.102 24.063s-1.057 1.889-1.715 2.617c-.659.728-1.837 2.01-3.292 2.651s-2.218.762-3.656.624c-1.437-.138-2.772-.97-3.24-1.317s-1.664-1.369-2.34-2.322-1.733-2.859-1.733-2.859.589 1.91.958 2.721c.212.467.864 1.894 1.789 3.136.863 1.159 2.539 3.154 5.086 3.604 2.547.451 4.297-.693 4.73-.97s1.346-1.042 1.924-1.66c.603-.645 1.174-1.468 1.49-1.962.231-.36.607-1.092.607-1.092z"/></g></svg> </a> <a lang="en" class="home" href="/WAI/"> <span class="wai"><span class="wa">Web Accessibility</span> <span class="i"><span class="initieative">Initiative</span> <span>WAI</span></span></span> </a> <div class="claim"> <span>Strategies, standards, resources to make the Web accessible to people with disabilities</span> </div> <button class="button button-menu" aria-haspopup="true" aria-expanded="false" id="openmenu"><span><svg focusable="false" aria-hidden="true" class="icon-menu "><use xlink:href="/WAI/assets/images/icons.svg#icon-menu"></use></svg> Menu</span></button> </div> <div class="navigations"> <nav class="metanav" aria-label="Meta & Search" lang="en"> <ul> <li><a href="/WAI/about/participating/">Get Involved</a></li> <li><a href="/WAI/about/">About W3C WAI</a></li> <li> <form action="/WAI/search/" role="search"> <div> <label for="header-search"> <span class="visuallyhidden">Search:</span> <input id="header-search" type="search" name="q" placeholder="Search" aria-label="Search"> </label> <button class="button button-icon button-nobg button-noborder"><span><svg focusable="false" aria-label="Submit Search" class="icon-search "><use xlink:href="/WAI/assets/images/icons.svg#icon-search"></use></svg></span></button> </div> </form> </li> </ul> </nav> </div> </header><nav class="mainnav" aria-label="Main" lang="en"><ul><li><a lang="en" href="/WAI/fundamentals/"><span>Accessibility Fundamentals</span></a></li><li><a lang="en" href="/WAI/planning/"><span>Planning & Policies</span></a></li><li><a lang="en" href="/WAI/design-develop/"><span>Design & Develop</span></a></li><li><a lang="en" href="/WAI/test-evaluate/"><span>Test & Evaluate</span></a></li><li><a lang="en" href="/WAI/teach-advocate/"><span>Teach & Advocate</span></a></li><li><a lang="en" href="/WAI/standards-guidelines/"><span>Standards/<wbr>Guidelines</span></a></li></ul></nav><nav class="default-grid breadcrumb" aria-label="Breadcrumb" lang="en"> <ul style="align-self: center;"> <li><a href="/WAI/" lang="en">Home</a></li><li><a lang="en" href="/WAI/fundamentals/"><span>Accessibility Fundamentals</span></a></li><li><a lang="en" href="/WAI/people/"><span>Accessibility is About People</span></a></li><li><a lang="en" href="/WAI/people-use-web/user-stories/"><span>Stories of Web Users</span></a></li><li><a lang="en" href="/WAI/people-use-web/user-stories/story-nine/" aria-current="page"><span>Elias' Story</span></a></li></ul> </nav> <div class="default-grid with-gap leftcol"> <div class="sidenav"><nav class="sn-contents" aria-label="Secondary"> <ul class="sidenav--list"> <li> <a lang="en" href="/WAI/fundamentals/" class="page-link"><span>Accessibility Fundamentals</span></a></li><li> <a lang="en" href="/WAI/fundamentals/accessibility-intro/" class="page-link"><span>Introduction to Accessibility</span></a><ul><li> <a lang="en" href="/WAI/videos/standards-and-benefits/" class="page-link"><span>Video Introduction</span></a></li></ul></li><li> <a lang="en" href="/WAI/people/" aria-current="location" class="page-link"><span>Accessibility is About People</span></a><ul><li> <a lang="en" href="/WAI/perspective-videos/" class="page-link"><span>Perspectives Videos</span></a><ul><li> <a lang="en" href="/WAI/perspective-videos/keyboard/" class="page-link"><span>Keyboard Compatibility</span></a></li><li> <a lang="en" href="/WAI/perspective-videos/contrast/" class="page-link"><span>Colors with Good Contrast</span></a></li><li> <a lang="en" href="/WAI/perspective-videos/layout/" class="page-link"><span>Clear Layout and Design</span></a></li><li> <a lang="en" href="/WAI/perspective-videos/speech/" class="page-link"><span>Text to Speech</span></a></li><li> <a lang="en" href="/WAI/perspective-videos/controls/" class="page-link"><span>Large Links, Buttons, and Controls</span></a></li><li> <a lang="en" href="/WAI/perspective-videos/captions/" class="page-link"><span>Video Captions</span></a></li><li> <a lang="en" href="/WAI/perspective-videos/customizable/" class="page-link"><span>Customizable Text</span></a></li><li> <a lang="en" href="/WAI/perspective-videos/voice/" class="page-link"><span>Speech Recognition</span></a></li><li> <a lang="en" href="/WAI/perspective-videos/understandable/" class="page-link"><span>Understandable Content</span></a></li><li> <a lang="en" href="/WAI/perspective-videos/notifications/" class="page-link"><span>Notifications and Feedback</span></a></li></ul></li><li> <a lang="en" href="/WAI/people-use-web/" class="page-link"><span>How People with Disabilities Use the Web</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/" aria-current="location" class="page-link"><span>Stories of Web Users</span></a><ul><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-one/" class="page-link"><span>Ade's Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-two/" class="page-link"><span>Ian's Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-three/" class="page-link"><span>Lakshmi's Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-four/" class="page-link"><span>Lexie's Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-five/" class="page-link"><span>Sophie's Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-six/" class="page-link"><span>Dhruv's Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-seven/" class="page-link"><span>Marta's Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-eight/" class="page-link"><span>Stefan's Story</span></a></li> <li> <a lang="en" href="/WAI/people-use-web/user-stories/story-nine/" aria-current="page" class="page-link"><span>Elias' Story</span></a></li></ul></li><li> <a lang="en" href="/WAI/people-use-web/abilities-barriers/" class="page-link"><span>Diverse Abilities and Barriers</span></a><ul><li> <a lang="en" href="/WAI/people-use-web/abilities-barriers/auditory/" class="page-link"><span>Auditory</span></a></li><li> <a lang="en" href="/WAI/people-use-web/abilities-barriers/cognitive/" class="page-link"><span>Cognitive and Learning</span></a></li><li> <a lang="en" href="/WAI/people-use-web/abilities-barriers/physical/" class="page-link"><span>Physical</span></a></li><li> <a lang="en" href="/WAI/people-use-web/abilities-barriers/speech/" class="page-link"><span>Speech</span></a></li><li> <a lang="en" href="/WAI/people-use-web/abilities-barriers/visual/" class="page-link"><span>Visual</span></a></li></ul></li><li> <a lang="en" href="/WAI/people-use-web/tools-techniques/" class="page-link"><span>Tools and Techniques</span></a><ul><li> <a lang="en" href="/WAI/people-use-web/tools-techniques/perception/" class="page-link"><span>Perception</span></a></li><li> <a lang="en" href="/WAI/people-use-web/tools-techniques/presentation/" class="page-link"><span>Presentation</span></a></li><li> <a lang="en" href="/WAI/people-use-web/tools-techniques/input/" class="page-link"><span>Input</span></a></li><li> <a lang="en" href="/WAI/people-use-web/tools-techniques/navigation/" class="page-link"><span>Interaction</span></a></li></ul></li><li> <a lang="en" href="/WAI/older-users/" class="page-link"><span>Older Users and Accessibility</span></a><ul><li> <a lang="en" href="/WAI/older-users/developing/" class="page-link"><span>How WCAG 2 Applies</span></a></li><li> <a lang="en" href="/WAI/older-users/literature/" class="page-link"><span>Literature Review</span></a></li></ul></li><li> <a lang="en" href="/WAI/fundamentals/accessibility-usability-inclusion/" class="page-link"><span>Accessibility, Usability, Inclusion</span></a></li></ul></li><li> <a lang="en" href="/WAI/fundamentals/components/" class="page-link"><span>Components of Web Accessibility</span></a></li><li> <a lang="en" href="/WAI/fundamentals/accessibility-principles/" class="page-link"><span>Accessibility Principles</span></a></li><li> <a lang="en" href="/WAI/research/" class="page-link"><span>Research</span></a><ul><li> <a lang="en" href="/WAI/research/user-requirements/" class="page-link"><span>User Requirements</span></a></li><li> <a lang="en" href="/WAI/research/ai2023/" class="page-link"><span>AI and Accessibility</span></a></li></ul></li><li> <a lang="en" href="/WAI/courses/" class="page-link"><span>Digital Accessibility Courses</span></a><ul><li> <a lang="en" href="/WAI/courses/foundations-course/" class="page-link"><span>W3C Foundations Online Course</span></a></li><li> <a lang="en" href="/WAI/courses/list/" class="page-link"><span>Course List</span></a></li></ul></li></ul></nav> </div> <main id="main" lang="en"> <header class="in-resource"> <h1> Elias, retiree with low vision, hand tremor, and mild short-term memory loss <span class="in-resource-sub"> in <a lang="en" href="/WAI/people-use-web/user-stories/"><span>Stories of Web Users</span></a>, <a lang="en" href="/WAI/people-use-web/"><span>How People with Disabilities Use the Web</span></a></span> </h1> </header> <style> #introduction p { font-size:120%; margin: 0.5em 0 0 0; } #introduction .box-i { } #introduction nav { border: 0; margin-top: 0; } #introduction nav header { padding: 8px 16px; } #introduction .video-card { margin: 1em; float: none !important; max-width: inherit !important; min-width: 45% !important; } #introduction .video-card p { font-size: 90%; margin: 0; } #introduction .video-card p:first-child { height: 190px; } #introduction img.video { border-radius: 5px; width: 300px; max-width: 300px; } #introduction .video-card .play-button { position: relative; top: -55px; left: -185px; width: 60px; height: 60px; } @media all and (min-width: 576px) { #introduction .box-i { display: flex; flex: 0 1; } #introduction .video-card .play-button { position: relative; top: -120px; left: 120px; width: 60px; height: 60px; } } </style> <blockquote class="pull alt-2"> <p>Accessibility: It's about people</p></blockquote> <aside id="introduction" class="box"><div class="box-i"> <div> <p>Elias is an 85-year-old retired architect. Over the years, Elias has experienced a decrease in vision, hearing, and short-term memory and he has a slight hand tremor. He uses digital technology for all sorts of activities including staying in touch with family, reading the news and architecture articles, and ordering groceries. However, using technology can be difficult when he can’t use the adjustments he needs, like when sites and apps don’t allow increased text size, require clicking small areas of the page, and make him type information with each visit rather than store it.</p> </div> <div class="video-card"> <video controls poster="/WAI/content-images/people-use-web/user-stories/elias-video-frame.png"> <source src="//media.w3.org/wai/people-use-web/user-stories_9.mp4" type="video/mp4"><track src="/WAI/wai-videos/people-use-web/user-stories_9.en.vtt" label="English" kind="captions" srclang="en" ></video> <p>This video is available with more accessibility features: <a href="#accessible-video">Video: Elias, retiree with low vision, hand tremor, and mild short-term memory loss</a>.</p> </div> </div> <nav class="box box-simple box-full" aria-labelledby="tocheading" id="toc"> <header id="tocheading" class="box-h box-h-simple box-h-full"> Page Contents</header> <div class="box-i"> <ul id="markdown-toc"> <li><a href="#about-elias" id="markdown-toc-about-elias">About Elias</a></li> <li><a href="#barrier-examples" id="markdown-toc-barrier-examples">Barrier examples</a></li> <li><a href="#assistive-technologies-and-adaptive-strategies-used" id="markdown-toc-assistive-technologies-and-adaptive-strategies-used">Assistive technologies and adaptive strategies used</a></li> <li><a href="#related-wai-resources" id="markdown-toc-related-wai-resources">Related WAI resources</a></li> <li><a href="#related-principles" id="markdown-toc-related-principles">Related principles</a></li> <li><a href="#accessible-video" id="markdown-toc-accessible-video">Video: Elias, retiree with low vision, hand tremor, and mild short-term memory loss</a></li> </ul> </div> </nav> </aside> <p><strong>Note:</strong> This user story is an example of a person with this type of disability. Other people with this disability may have different experiences.</p> <h2 id="about-elias">About Elias</h2> <blockquote> <p>I love all this new technology. It is great to see my grandchildren. It takes me a bit to find all the controls and sometimes they are a bit on the small side, but I get there in the end.</p> </blockquote> <p>Elias is hard of hearing and has low vision, hand tremor, and short term memory loss. Elias had a long and successful career as an architect. He delayed retirement until he was in his 70’s because as the senior architect in his firm, he was often sought after to mentor the new hires and guest lecture at local universities. Elias has macular degeneration that blurs his vision and makes reading more difficult. Over time, the demands of the close-up work necessary to render architectural drawings strained his eyes to the point that he could only work a couple of hours at a time. He finally had to stop work when he developed a mild hand tremor and found it too difficult to maintain the precision required for his work.</p> <p>Currently, at age 85, Elias’s family has started to notice some short term memory loss. Even so, Elias maintains an active interest in the history of architecture and is part of a small group of people who share his passion and write about it online. His blog has an active following and helps ensure he is still able to contribute to the field.</p> <p>Like many older people, Elias has difficulty reading small text. He subscribes to an online rather than physical version of the newspaper because he is able to increase the size of the text, making it easier to read. However, on some sites this does not work as well because either the text gets cut off or the larger text doesn’t flow to the next line and he has to scroll horizontally off screen. His tremor makes it difficult to scroll across in a straight line. While this is easier than managing the large pages of a print newspaper, the best instance is when the text resizes and reflows properly.</p> <p>For all of the benefits of using a computer to read the news and stay active in his field, Elias often has difficulty with the security on some websites. On sites that use CAPTCHA, it is sometimes hard for him to identify the distorted text or identify the images in photos because they are usually not clearly rendered. On sites that send a security code, Elias has to interrupt what he is doing to look on his phone and copy a code, and sometimes the codes are long and hard to transcribe correctly. When using a site that requires CAPTCHA, Elias finds it much simpler if the text or images are easy to identify. If a security code is required, a short group of numbers or letters makes it easier to read and transcribe.</p> <h2 id="barrier-examples">Barrier examples</h2> <dl> <dt>Inaccessible CAPTCHA</dt> <dd><strong>Barrier</strong>: “When I login to my online banking I need to complete a CAPTCHA but I can’t really read it well.”</dd> <dd><strong>Works well</strong>: “My banking login sends me a text with a simple code to confirm it is me.”</dd> <dt>Text doesn’t reflow</dt> <dd><strong>Barrier</strong>: “When I resize a website using my browser some of the text disappears or is cut short and sometimes I have to scroll across the screen as well as down.”</dd> <dd><strong>Works well</strong>: “When I resize a website using my browser the text is all still available and is presented in a longer thinner column that doesn’t need to be scrolled sideways.”</dd> <dt>Distracting animations</dt> <dd><strong>Barrier:</strong> “When my screen is magnified, animations are very distracting because I don’t get the full context of what is going on.”</dd> <dd><strong>Works well:</strong> “Allow me to stop any animation on the screen so I can concentrate on what I’m looking at.”</dd> <dt>Tables don’t zoom well</dt> <dd><strong>Barrier:</strong> “Online tables sometimes have a lot of space between the columns and when I’m zoomed it, I have to scroll from left to right to see all of the content and I often miss the association from one column to the next.”</dd> <dd><strong>Works well:</strong> “When I zoom the tables change from lots of columns to being presented more like a list with each row being shown as a list item.”</dd> <dt>Breadcrumb</dt> <dd><strong>Barrier:</strong> “I often lose my place on websites. Sometimes I follow several links and it’s not what I’m looking for. I can use the back button to go back page by page but I still get lost.”</dd> <dd><strong>Works well:</strong> “A breadcrumb at the top of each page that shows my path through the site keeps me on track, plus it helps me get back to the home page really quickly.”</dd> <dt>Login page</dt> <dd><strong>Barrier:</strong> “I have accounts with so many different websites that sometimes I forget my password.”</dd> <dd><strong>Works well:</strong> “An option to remember my password for this site and a means of resetting my password if I need to.”</dd> <dt>Saved information</dt> <dd><strong>Barrier:</strong> “When I place an order, I have trouble remembering things, like telephone number, address, and credit card details.”</dd> <dd><strong>Works well:</strong> “This store remembers from before, so I only need to select right address in the text field, rather than need typing each time.”</dd> </dl> <h2 id="assistive-technologies-and-adaptive-strategies-used">Assistive technologies and adaptive strategies used</h2> <ul> <li><a href="/WAI/people-use-web/tools-techniques/presentation/#display">Screen magnification (Presentation)</a></li> <li><a href="/WAI/people-use-web/tools-techniques/input/#input">Alternative keyboard and mouse (Input)</a></li> <li><a href="/WAI/people-use-web/tools-techniques/input/#filters">Keyboard and mouse filters (Input)</a></li> <li><a href="/WAI/people-use-web/tools-techniques/input/#mouse">Mouse customization (Input)</a></li> <li><a href="/WAI/people-use-web/tools-techniques/navigation/#bookmarks">Bookmarks and history (Interaction)</a></li> <li><a href="/WAI/people-use-web/tools-techniques/navigation/#consistency">Consistency and predictability (Interaction)</a></li> <li><a href="/WAI/people-use-web/tools-techniques/navigation/#labels">Descriptive titles, headings, and labels (Interaction)</a></li> <li><a href="/WAI/people-use-web/tools-techniques/navigation/#messages">Helpful error and success messages (Interaction)</a></li> </ul> <h2 id="related-wai-resources">Related WAI resources</h2> <ul> <li>Use case: <a href="https://www.w3.org/TR/coga-usable/#gopal-a-retired-lawyer-with-dementia">Gopal: A Retired Lawyer with Dementia</a></li> <li>Video: <a href="/WAI/perspective-videos/controls/">Large Links, Buttons, and Controls</a></li> <li>Tip: <a href="/WAI/tips/designing/#provide-sufficient-contrast-between-foreground-and-background">Provide sufficient contrast between foreground and background</a></li> <li>Tip: <a href="/WAI/tips/developing/#avoid-captcha-where-possible">Avoid CAPTCHA where possible</a></li> <li>Tip: <a href="/WAI/tips/writing/#make-link-text-meaningful">Make link text meaningful</a></li> <li>Tip: <a href="/WAI/tips/writing/#provide-clear-instructions">Provide clear instructions</a></li> <li>Tip: <a href="/WAI/tips/writing/#keep-content-clear-and-concise">Keep content clear and concise</a></li> <li>Tip: <a href="/WAI/tips/designing/#ensure-that-interactive-elements-are-easy-to-identify">Ensure that interactive elements are easy to identify</a></li> <li>Tip: <a href="/WAI/tips/designing/#provide-clear-and-consistent-navigation-options">Provide clear and consistent navigation options</a></li> <li>Tip: <a href="/WAI/tips/designing/#provide-easily-identifiable-feedback">Provide easily identifiable feedback</a></li> <li>Tip: <a href="/WAI/tips/designing/#use-headings-and-spacing-to-group-related-content">Use headings and spacing to group related content</a></li> <li>Tip: <a href="/WAI/tips/developing/#help-users-avoid-and-correct-mistakes">Help users avoid and correct mistakes</a></li> <li>Tip: <a href="/WAI/tips/developing/#provide-meaning-for-non-standard-interactive-elements">Provide meaning for non-standard interactive elements</a></li> <li>Tip: <a href="/WAI/tips/developing/#ensure-that-all-interactive-elements-are-keyboard-accessible">Ensure that all interactive elements are keyboard accessible</a></li> <li>Check: <a href="/WAI/test-evaluate/preliminary/#contrast">Contrast ratio (“color contrast”)</a></li> <li>Check: <a href="/WAI/test-evaluate/preliminary/#resize">Resize Text</a></li> <li>Check: <a href="/WAI/test-evaluate/preliminary/#interaction">Keyboard access and visual focus</a></li> <li>Check: <a href="/WAI/test-evaluate/preliminary/#forms">Forms, labels, and errors</a></li> </ul> <h2 id="related-principles">Related principles</h2> <ul> <li><a href="/WAI/fundamentals/accessibility-principles/#alternatives">Text alternatives for non-text content (Perceivable)</a></li> <li><a href="/WAI/fundamentals/accessibility-principles/#adaptable">Content can be presented in different ways (Perceivable)</a></li> <li><a href="/WAI/fundamentals/accessibility-principles/#distinguishable">Content is easier to see and hear (Perceivable)</a></li> <li><a href="/WAI/fundamentals/accessibility-principles/#time">Users have enough time to read and use the content (Operable)</a></li> <li><a href="/WAI/fundamentals/accessibility-principles/#navigable">Users can easily navigate, find content, and determine where they are (Operable)</a></li> <li><a href="/WAI/fundamentals/accessibility-principles/#readable">Content is readable and understandable (Understandable)</a></li> <li><a href="/WAI/fundamentals/accessibility-principles/#predictable">Content appears and operates in predictable ways (Understandable)</a></li> <li><a href="/WAI/fundamentals/accessibility-principles/#tolerant">Users are helped to avoid and correct mistakes (Understandable)</a></li> <li><a href="/WAI/fundamentals/accessibility-principles/#compatible">Content is compatible with current and future user tools (Robust)</a></li> </ul> <details id="video-transcript"><summary> <h2 id="accessible-video">Video: Elias, retiree with low vision, hand tremor, and mild short-term memory loss</h2> </summary> <div> <div class="video-container" data-video-type="" dir="ltr"> <video preload="metadata" data-youtube-id="c-IqJdL0i38" data-youtube-nocookie="true" data-description-audible="false" playsinline=""><track src="/WAI/wai-videos/people-use-web/user-stories_9.en.vtt" label="English" kind="captions" srclang="en" default="" /></video> </div> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="//cdn.jsdelivr.net/npm/js-cookie@3.0.1/dist/js.cookie.min.js"></script> <script src="/WAI/assets/ableplayer/build/ableplayer.min.js"></script> <script src="//apis.google.com/js/client.js?onload=initGoogleClientApi"></script> <script> (function () { 'use strict'; let player1 = new AblePlayer($('[data-video-type=""] video')); const audiodescribed = document.querySelectorAll('[data-video-type="audio-described"]'); const nonaudiodescribed = document.querySelectorAll('[data-video-type=""]'); if (audiodescribed.length > 0) { let player2 = new AblePlayer($('[data-video-type="audio-described"] video')); Array.prototype.forEach.call(audiodescribed, function(el, i){ el.setAttribute('hidden', true); }); const adbutton = document.querySelector('#audio_description_button'); adbutton.addEventListener('click', function(e){ player1.pauseMedia(); player2.pauseMedia(); if (e.currentTarget.getAttribute('data-status') === "audio-described") { Array.prototype.forEach.call(nonaudiodescribed, function(el, i){ el.removeAttribute("hidden"); }); Array.prototype.forEach.call(audiodescribed, function(el, i){ el.setAttribute('hidden', true); }); e.currentTarget.setAttribute('data-status', 'non-audio-described'); e.currentTarget.querySelector('span').textContent = 'Enable Audio Description'; } else { Array.prototype.forEach.call(nonaudiodescribed, function(el, i){ el.setAttribute('hidden', true); }); Array.prototype.forEach.call(audiodescribed, function(el, i){ el.removeAttribute("hidden"); }); e.currentTarget.setAttribute('data-status', 'audio-described'); e.currentTarget.querySelector('span').textContent = 'Disable Audio Description'; } }); } }()); </script> <p><em>This video is also available on a W3C server: <a href="https://media.w3.org/wai/people-use-web/user-stories_9.mp4">Video: Elias, retiree with low vision, hand tremor, and mild short-term memory loss (file format: MP4, file size: 162MB)</a>.</em></p> <h3 id="transcript">Text Transcript with Description of Visuals</h3> <table> <thead> <tr> <th>Audio</th> <th>Visual</th> </tr> </thead> <tbody> <tr> <td>How people with disabilities use digital technology; Elias, retiree with low vision, hand tremor, and mild short-term memory loss.</td> <td>How people with disabilities use digital technology; Elias, retiree with low vision, hand tremor, and mild short-term memory loss.</td> </tr> <tr> <td>Hello! I’m Elias. I’m a retired architect. Life moves slower now that I’m retired, and I think my body does too!</td> <td>A man speaks directly to the camera.</td> </tr> <tr> <td>I see less and hear less than in my younger days. Also, my hands shake a little. My children live far away, so we see each other online instead. We also write to each other and send pictures. It’s so much easier and quicker than going to the post office every time.</td> <td>The man is sitting at his desk using a laptop. He is participating in an online video call with one other person using a video conferencing app.</td> </tr> <tr> <td>My trouble is all this small text! Why do they write so small? I know how to make the text size bigger but it doesn’t work with all websites. Sometimes everything seems to break down – the text overlaps or goes somewhere else or disappears completely. Or, I have to scroll sideways to read – I don’t have the time and energy for that.</td> <td>The man is sitting at his desk using a laptop. He is trying to use a website which does not have responsive design.</td> </tr> <tr> <td>It’s the same with apps. I made the text bigger on my mobile phone. I can’t see without doing that on such a small screen. Most apps work well but not the banking app. The text on that app is still small, and I need to use it to log into my bank account. I already called them several times about this but nothing happens.</td> <td>The man is sitting at his desk using a zoomed-in messaging app on a mobile phone. He then changes to using a banking app.</td> </tr> <tr> <td>It’s not only reading, though. When the text is small, all the buttons and links are also small. Sometimes tiny. Especially on forms where you have to click and select all these things – it’s hard with my hands, they don’t behave like they used to.</td> <td>The man is sitting at his desk using a laptop. He tries to make a selection from a list, but the text is very small.</td> </tr> <tr> <td>Our grocery store now has an online shop, which is fantastic because I don’t have to carry all the shopping any more. The text is big and it has big links and buttons. It just seems clearer and easier to find things – everything is where it should be on every page. Usually, I have trouble remembering things, like the telephone number, address, and credit card details. This store remembers from before, so I only need to select the right address in the text field rather than needing to type it each time. I wish all websites could be that easy.</td> <td>The man is sitting at his desk using a laptop. He is successfully using the website of his online grocery store.</td> </tr> <tr> <td>You can help make technology accessible to me. Accessibility: It’s about people.</td> <td>The man speaks directly to the camera.</td> </tr> <tr> <td>For more information from the Web Accessibility Initiative on how people with disabilities use digital technology, visit w3.org/WAI/people</td> <td>Accessibility: It’s about people; w3.org/WAI/people</td> </tr> </tbody> </table> </div> </details> <nav class="pager" aria-label="Previous/Next Page" style="clear: both;"> <ul><li class="pager--item previous"> <a href="/WAI/people-use-web/user-stories/story-eight/"> <svg focusable="false" aria-hidden="true" class="icon-arrow-left pager--item-icon"><use xlink:href="/WAI/assets/images/icons.svg#icon-arrow-left"></use></svg> <span class="pager--item-text"> <span class="pager--item-text-direction">Previous:</span> <span class="pager--item-text-target">Stefan</span> </span> </a> </li></nav><aside class="box box-icon box-space-above" id="helpimprove" aria-label="feedback"><header class="box-h box-h-icon box-h-space-above box-h-icon"> <svg focusable="false" aria-hidden="true" class="icon-comments "><use xlink:href="/WAI/assets/images/icons.svg#icon-comments"></use></svg> <h2> Help improve this page </h2></header><div class="box-i"><p>Please share your ideas, suggestions, or comments via e-mail to the publicly-archived list <a href="mailto:wai@w3.org?body=%5Binclude%20a%20relevant%20email%20Subject%5D%0A%0A%5Bput%20comment%20here...%5D%0A%0AI%20give%20permission%20to%20share%20this%20to%20a%20publicly-archived%20e-mail%20list.">wai@w3.org</a> or via GitHub.</p> <div class="button-group"> <a href="mailto:wai@w3.org?body=%5Binclude%20a%20relevant%20email%20Subject%5D%0A%0A%5Bput%20comment%20here...%5D%0A%0AI%20give%20permission%20to%20share%20this%20to%20a%20publicly-archived%20e-mail%20list." class="button"><span>E-mail</span></a><a href=" https://github.com/w3c/wai-website/edit/main/pages/fundamentals/people/people-use-web/user-stories/story-nine.md " class="button"><span>Fork & Edit on GitHub</span></a><a href="https://github.com/w3c/wai-website/issues/new?template=content-issue.yml&wai-resource-id=wai-people-use-web&wai-url=https://www.w3.org/WAI/people-use-web/user-stories/story-nine/" class="button"><span>New GitHub Issue</span></a></div></div></aside> <a class="button button-backtotop" href="#top"><span><svg focusable="false" aria-hidden="true" class="icon-arrow-up "><use xlink:href="/WAI/assets/images/icons.svg#icon-arrow-up"></use></svg> Back to Top</span></a> </main> </div> <footer id="wai-site-footer" class="page-footer default-grid" aria-label="Page"> <div class="inner"><p><strong>Updated:</strong> 25 June 2024. <a href="/WAI/people-use-web/changelog/">Latest changes</a>.</p><p>Note about video description: The video on this page does not include synchronized audio description because the visuals only illustrate the audio and do not provide additional information. In this case, audio description would be more distracting than useful to most people, including people who cannot see the visuals. Description of visual information is available in the Text Transcript with Description of Visuals (“descriptive transcript”).</p> <p>First posted as a draft in 1999.</p> <p><strong>Editors:</strong> Kevin White and Shadi Abou-Zahra. Previous editors: Judy Brewer and Norah Sinclair. Contributors: Brent Bakken, Jade Matos Carew, Jayne Schurick, Michele Williams, and others in <a href="/WAI/people-use-web/acknowledgements/">Acknowledgements</a>.</p> <p>Developed by the Education and Outreach Working Group (<a href="https//www.w3.org/WAI/EO/">EOWG</a>) with support from the <a href="https://www.w3.org/WAI/about/projects/wai-guide/">WAI-Guide Project</a> and <a href="https://www.w3.org/WAI/WAI-AGE/">WAI-AGE Project</a> co-funded by the European Commission (EC).</p> </div> </footer> <footer class="site-footer grid-4q" aria-label="Site"> <div class="q1-start q3-end about"> <div> <p><a class="largelink" href="https://www.w3.org/WAI/" lang="en" dir="auto" translate="no">W3C Web Accessibility Initiative (WAI)</a></p> <p>Strategies, standards, and supporting resources to make the Web accessible to people with disabilities.</p> </div> <div class="social" lang="en" dir="auto" translate="no"> <ul> <li><a href="https://w3c.social/@wai"><svg focusable="false" aria-hidden="true" class="icon-mastodon "><use xlink:href="/WAI/assets/images/icons.svg#icon-mastodon"></use></svg> Mastodon</a></li> <li><a href="https://www.linkedin.com/company/w3c-wai/"><svg focusable="false" aria-hidden="true" class="icon-linkedin "><use xlink:href="/WAI/assets/images/icons.svg#icon-linkedin"></use></svg> LinkedIn</a></li> <li><a href="https://www.w3.org/WAI/feed.xml"><svg focusable="false" aria-hidden="true" class="icon-rss "><use xlink:href="/WAI/assets/images/icons.svg#icon-rss"></use></svg> Feed</a></li> <li><a href="https://www.youtube.com/channel/UCU6ljj3m1fglIPjSjs2DpRA/playlists/"><svg focusable="false" aria-hidden="true" class="icon-youtube "><use xlink:href="/WAI/assets/images/icons.svg#icon-youtube"></use></svg> YouTube</a></li> <li><a href="https://www.w3.org/WAI/news/subscribe/" class="button">Get News in Email</a></li> </ul> </div> <div lang="en" dir="auto" translate="no"> <p>Copyright © 2025 World Wide Web Consortium (<a href="https://www.w3.org/">W3C</a><sup>®</sup>). See <a href="/WAI/about/using-wai-material/">Permission to Use WAI Material</a>.</p> </div> </div> <div lang="en" dir="auto" translate="no" class="q4-start q4-end"> <ul style="margin-bottom:0"> <li><a href="/WAI/about/contacting/">Contact WAI</a></li> <li><a href="/WAI/sitemap/">Site Map</a></li> <li><a href="/WAI/news/">News</a></li> <li><a href="/WAI/sitemap/#archive">Archive</a></li> <li><a href="/WAI/about/accessibility-statement/">Accessibility Statement</a></li> <li><a href="/WAI/translations/"> Translations</a></li> <li><a href="/WAI/roles/">Resources for Roles</a></li> </ul> </div> </footer><!-- Details4Everybody --> <script src="/WAI/assets/scripts/details4everybody.js?1739541174349523255"></script> <!-- SVG4Everybody --> <script src="/WAI/assets/scripts/svg4everybody.js?1739541174349523255"></script> <script> svg4everybody(); </script><script> var translationStrings = {}; </script> </body> </html>