CINXE.COM

Physical | 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?1734024574773289251"; document.body.appendChild(element); } window.addEventListener("load", downloadJSAtOnload, false); </script> <link rel="stylesheet" href="/WAI/assets/css/style.css?1734024574773289251"> <title> Physical | 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="Physical" /> <meta name="author" content="W3C Web Accessibility Initiative (WAI)" /> <meta property="og:locale" content="en" /> <meta name="description" content="Explores the wide diversity of people and abilities. Highlights accessibility barriers that people may experience because of inaccessible digital technology." /> <meta property="og:description" content="Explores the wide diversity of people and abilities. Highlights accessibility barriers that people may experience because of inaccessible digital technology." /> <link rel="canonical" href="https://www.w3.org/WAI/people-use-web/abilities-barriers/physical/" /> <meta property="og:url" content="https://www.w3.org/WAI/people-use-web/abilities-barriers/physical/" /> <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="Physical" /> <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":"Explores the wide diversity of people and abilities. Highlights accessibility barriers that people may experience because of inaccessible digital technology.","headline":"Physical","image":"https://www.w3.org/WAI/content-images/people-use-web/social.png","url":"https://www.w3.org/WAI/people-use-web/abilities-barriers/physical/"}</script> <!-- End Jekyll SEO tag --> <link rel="alternate" type="application/rss+xml" href="/WAI/feed.xml"> </head> <body id="top" class="page-physical "> <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&nbsp;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 &amp; 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 &amp; Policies</span></a></li><li><a lang="en" href="/WAI/design-develop/"><span>Design &amp; Develop</span></a></li><li><a lang="en" href="/WAI/test-evaluate/"><span>Test &amp; Evaluate</span></a></li><li><a lang="en" href="/WAI/teach-advocate/"><span>Teach &amp; 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/abilities-barriers/"><span>Diverse Abilities and Barriers</span></a></li><li><a lang="en" href="/WAI/people-use-web/abilities-barriers/physical/" aria-current="page"><span>Physical</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/" 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&apos;s Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-two/" class="page-link"><span>Ian&apos;s Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-three/" class="page-link"><span>Lakshmi&apos;s Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-four/" class="page-link"><span>Lexie&apos;s Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-five/" class="page-link"><span>Sophie&apos;s Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-six/" class="page-link"><span>Dhruv&apos;s Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-seven/" class="page-link"><span>Marta&apos;s Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-eight/" class="page-link"><span>Stefan&apos;s Story</span></a></li><li> <a lang="en" href="/WAI/people-use-web/user-stories/story-nine/" class="page-link"><span>Elias&apos; Story</span></a></li></ul></li><li> <a lang="en" href="/WAI/people-use-web/abilities-barriers/" aria-current="location" 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/" aria-current="page" 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> Physical <span class="in-resource-sub"> in <a lang="en" href="/WAI/people-use-web/abilities-barriers/"><span>Diverse Abilities and Barriers</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>Physical disabilities (sometimes called “motor disabilities”) include weakness and limitations of muscular control (such as involuntary movements including tremors, lack of coordination, or paralysis), limitations of sensation, joint disorders (such as arthritis), pain that impedes movement, and missing limbs.</p> </div> <div class="video-card"> <video controls poster="/WAI/content-images/people-use-web/abilities-barriers/physical-video-frame.png"> <source src="//media.w3.org/wai/people-use-web/abilities-barriers_physical.mp4" type="video/mp4"><track src="/WAI/wai-videos/people-use-web/abilities-barriers_physical.en.vtt" label="English" kind="captions" srclang="en" ></video> <p>This video is available with more accessibility features: <a href="#accessible-video">Video: Diverse Abilities and Barriers - Physical</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="#introduction" id="markdown-toc-introduction">Introduction</a></li> <li><a href="#examples-of-physical-disabilities" id="markdown-toc-examples-of-physical-disabilities">Examples of physical disabilities</a></li> <li><a href="#examples-of-barriers-for-people-with-physical-disabilities" id="markdown-toc-examples-of-barriers-for-people-with-physical-disabilities">Examples of barriers for people with physical disabilities</a></li> <li><a href="#stories-related-to-physical-disabilities" id="markdown-toc-stories-related-to-physical-disabilities">Stories related to physical disabilities</a></li> <li><a href="#accessible-video" id="markdown-toc-accessible-video">Video: Diverse Abilities and Barriers - Physical</a></li> </ul> </div> </nav> </aside> <p><strong>Note:</strong> The examples given in this section are not a complete list of all disabilities or barriers.</p> <h2 id="introduction">Introduction</h2> <p>To use digital technology, people with physical disabilities often use specialized hardware and software such as:</p> <ul> <li>Ergonomic or specially designed keyboard or mouse;</li> <li>Head pointer, mouth stick, and other aids to help with typing;</li> <li>On-screen keyboard with trackball, joysticks, or other pointing devices;</li> <li>Switches operated by foot, shoulder, sip-and-puff, or other movements;</li> <li>Speech recognition, eye tracking, and other approaches for hands-free interaction.</li> </ul> <p>People with physical disabilities may be using a mouse or mouse-like device only, or keyboard or keyboard-like device only to operate the computer. People with physical disabilities rely on keyboard support to activate functionality provided on web pages. They may need more time to type, click, or carry out other interactions, and they may type single keystrokes in sequence or use sticky keys rather than typing simultaneous keystrokes (“chording”) to activate commands. Such keystrokes include commands for special characters, shortcut keys, and to active menu items.</p> <p>People with physical disabilities may have trouble clicking small areas and are more likely to make mistakes in typing and clicking. Providing large clickable areas, enough time to complete tasks, and error correction options for forms are important design aspects. Other important design aspects include providing visible indicators of the current focus, and mechanisms to skip over blocks, such as over page headers or navigation bars. People with cognitive and visual disabilities share many of these requirements.</p> <h2 id="examples-of-physical-disabilities">Examples of physical disabilities</h2> <ul> <li><strong id="limbs">Amputation</strong> – includes missing fingers, limbs, or other parts of the human body.</li> <li><strong id="arthritis">Arthritis</strong> (previously called “<a href="#rheumatism" class="termref">rheumatism</a>”) – inflammation, degeneration, or damage to the joints.</li> <li><strong id="fibromyalgia">Fibromyalgia</strong> (formerly called “<a href="#rheumatism" class="termref">rheumatism</a>”) – the chronic pain of muscle and connective tissues.</li> <li><strong id="rheumatism">Rheumatism</strong> – typically refers to <a href="#arthritis" class="termref">arthritis</a> and other causes of bone or joint pain, and sometimes to <a href="#fibromyalgia" class="termref">fibromyalgia</a> and other causes for muscular and other soft tissue pain.</li> <li><strong id="dexterity">Reduced dexterity</strong> – is a functional term (rather than a medical condition) that describes the ability to control the hand, such as hand-eye coordination of people with cognitive and neurological disabilities.</li> <li><strong id="ms">Multiple sclerosis</strong> – causes damage to nerve cells in the brain and spinal cord, and can affect physical, cognitive, and visual abilities, in particular during relapses.</li> <li><strong id="md">Muscular dystrophy</strong> – progressive weakness and degeneration of muscles, sometimes including in arms and hands.</li> <li><strong id="rsi">Repetitive stress injury (RSI)</strong> (also called “repetitive motion disorder” (RMD) and “cumulative trauma disorder” (CT)) - involves injuries to the musculoskeletal system (bones, joints, tendons, and other connective tissues) and the nervous system from repetitive tasks and damage.</li> <li><strong id="tremor">Tremor and spasms</strong> – involuntary movement or muscle contraction, including short twitches, and continual or rhythmic muscle contractions.</li> <li><strong id="quadriplegia">Quadriplegia</strong> (sometimes called “tetraplegia”) - partial or total paralysis (includes motor control and sensation) to all four body limbs (legs and arms) and the torso.</li> <li><strong id="seizure">Seizure disorders</strong> – includes different types of epilepsy and migraines, which may be in reaction to visual flickering or audio signals at certain frequencies or patterns.</li> </ul> <h2 id="examples-of-barriers-for-people-with-physical-disabilities">Examples of barriers for people with physical disabilities</h2> <ul> <li>Websites, web browsers, and authoring tools that do not provide full keyboard support.</li> <li>Insufficient time limits to respond or to complete tasks, such as to fill out online forms.</li> <li>Controls, including links with images of text, that do not have equivalent text alternatives.</li> <li>Missing visual and non-visual orientation cues, page structure, and other navigational aids.</li> <li>Inconsistent, unpredictable, and overly complicated navigation mechanisms and page functions.</li> </ul> <h2 id="stories-related-to-physical-disabilities">Stories related to physical disabilities</h2> <ul> <li><a href="/WAI/people-use-web/user-stories/story-one/">Ade, reporter with limited use of arms</a></li> <li><a href="/WAI/people-use-web/user-stories/story-nine/">Elias, retiree with low vision, hand tremor, and mild short-term memory loss</a></li> </ul> <details id="video-transcript"><summary> <h2 id="accessible-video">Video: Diverse Abilities and Barriers - Physical</h2> </summary> <div> <div class="video-container" data-video-type="" dir="ltr"> <video preload="metadata" data-youtube-id="z_5l75rksSA" data-youtube-nocookie="true" data-description-audible="false" playsinline=""><track src="/WAI/wai-videos/people-use-web/abilities-barriers_physical.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> var youTubeDataAPIKey = "AIzaSyBzq155tA3E3gaYlRdx2S9U9FM78U1-568"; var googleApiReady = false; function initGoogleClientApi() { googleApiReady = true; } </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/abilities-barriers_physical.mp4">Video: Diverse Abilities and Barriers - Physical (file format: MP4, file size: 277MB)</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; physical disabilities.</td> <td>How people with disabilities use digital technology: Physical disabilities</td> </tr> <tr> <td>Physical disabilities affect how people move, including an inability to move, limited mobility, a lack of coordination, tremors and involuntary movement, pain that impedes movement, as well as missing and non-typical limbs.</td> <td>Collage of 3 people using their devices.</td> </tr> <tr> <td>People who use a mouse might have difficulty with fine motor control.</td> <td>Man seated at desk uses his laptop.</td> </tr> <tr> <td>For example, tremors, non-typical joints, pain, or fatigue can prevent people from being able to select small targets, such as small links, buttons, and controls.</td> <td>Man is using trackpad with visible hand tremor. He uses a website where a checkbox can only be selected by clicking the checkbox square, which is difficult to do.</td> </tr> <tr> <td>Websites and apps with large clickable areas around checkboxes, radio buttons, and other controls, are easier to use for people with limited mobility and reduced dexterity.</td> <td>He now uses a different website that allows selecting the text label next to a radio button and checkbox, rather than solely the radio button circle and checkbox square.</td> </tr> <tr> <td>Other people use speech input instead. While speech input uses the keyboard interface in the background, websites and apps that are programmed and designed with consideration for speech input are more effective. For example, when the name of a button in the code matches the name displayed visually, people using speech input know what they need to say to click that button. “Click send email.”</td> <td>Man in wheelchair sits at a desk as he dictates an email message using his laptop.</td> </tr> <tr> <td>Some people do not use a mouse, touch screen, or other pointing devices. They might use specialized keyboards with larger keys, or more space between the keys. Some use tools such as a mouthstick or headstick to type.</td> <td>Man with irregular hand movement uses a keyboard with large keys to type.</td> </tr> <tr> <td>Websites and apps that make functions visibly clear with active focus styles and usable with keyboard only are easier to use for people with physical disabilities.</td> <td>Website for entering shipping information has clear visual outline around the currently focused field and typed letters appear at the pace of the man using the large keyboard.</td> </tr> <tr> <td>Regardless of the input device used, websites and apps that provide sufficient time to type and to complete tasks are easier to use for people with physical disabilities because it might take people longer to navigate and type, and to correct typing mistakes.</td> <td>Man in wheelchair with non-typical limbs holds and uses tablet.</td> </tr> <tr> <td>Providing clear headings and instructions helps people to understand the tasks and reduces the time needed to complete them. This includes instructions for forms and functionality, as well as error messages and dialogs.</td> <td>Web form is shown featuring large heading and instructions, clear labels, and clearly marked required fields. The man makes a selection from a dropdown.</td> </tr> <tr> <td>Finally, websites and apps that work in both portrait and landscape orientation are easier to use for people who have their devices mounted to their wheelchair, desk, or bed.</td> <td>Man in wheelchair continues to use tablet.</td> </tr> <tr> <td>You can help make technology accessible to me. Accessibility: It’s about people.</td> <td>Man in wheelchair speaks the phrase, “You can help make technology accessible to me,” then the view pans to collage of 12 people with different colored backgrounds.</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/abilities-barriers/cognitive/"> <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">Cognitive and learning</span> </span> </a> </li><li class="pager--item next"> <a href="/WAI/people-use-web/abilities-barriers/speech/"> <svg focusable="false" aria-hidden="true" class="icon-arrow-right pager--item-icon"><use xlink:href="/WAI/assets/images/icons.svg#icon-arrow-right"></use></svg> <span class="pager--item-text"> <span class="pager--item-text-direction">Next:</span> <span class="pager--item-text-target">Speech</span> </span> </a> </li> </ul></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/abilities-barriers/physical.md " class="button"><span>Fork &amp; 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/abilities-barriers/physical/" 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>.<br /> First published as a draft in 1999.</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><strong>Editor:</strong> Shadi Abou-Zahra. Previous editor: Judy Brewer. Contributors listed 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 © 2024 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?1734024574773289251"></script> <!-- SVG4Everybody --> <script src="/WAI/assets/scripts/svg4everybody.js?1734024574773289251"></script> <script> svg4everybody(); </script><script> var translationStrings = {}; </script> </body> </html>

Pages: 1 2 3 4 5 6 7 8 9 10