CINXE.COM

<!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?1732807903713432608"; document.body.appendChild(element); } window.addEventListener("load", downloadJSAtOnload, false); </script> <link rel="stylesheet" href="/WAI/assets/css/style.css?1732807903713432608"> <title> Video Introduction to Web Accessibility and W3C Standards | Web Accessibility Initiative (WAI) | W3C</title> <meta name="generator" content="Jekyll v4.3.3" /> <meta property="og:title" content="Video Introduction to Web Accessibility and W3C Standards" /> <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/videos/standards-and-benefits/" /> <meta property="og:url" content="https://www.w3.org/WAI/videos/standards-and-benefits/" /> <meta property="og:site_name" content="Web Accessibility Initiative (WAI)" /> <meta property="og:type" content="website" /> <meta name="twitter:card" content="summary_large_image" /> <meta property="twitter:title" content="Video Introduction to Web Accessibility and W3C Standards" /> <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":"Video Introduction to Web Accessibility and W3C Standards","url":"https://www.w3.org/WAI/videos/standards-and-benefits/"}</script>  <meta name="twitter:image" property="og:image" content="https://www.w3.org/WAI/assets/images/social-sharing-default.jpg"> <link rel="alternate" type="application/rss+xml" href="/WAI/feed.xml"> </head> <body id="top" class="page-video-introduction-to-web-accessibility-and-w3c-standards "> <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 languagelist"> <strong>This page in:</strong> <ul class="languagelistul"><li><strong style="text-transform: capitalize;">English</strong></li><li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/ar" lang="ar" dir="auto" translate="no">العربية</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/cs" lang="cs" dir="auto" translate="no">čeština</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/de" lang="de" dir="auto" translate="no">Deutsch</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/el" lang="el" dir="auto" translate="no">Ελληνικά</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/es" lang="es" dir="auto" translate="no">español</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/fr" lang="fr" dir="auto" translate="no">français</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/id" lang="id" dir="auto" translate="no">Bahasa Indonesia</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/ja" lang="ja" dir="auto" translate="no">日本語</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/ko" lang="ko" dir="auto" translate="no">한국어</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/nl" lang="nl" dir="auto" translate="no">Nederlands</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/pl" lang="pl" dir="auto" translate="no">polski</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/pt-BR" lang="pt-BR" dir="auto" translate="no">Português do Brasil</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/ru" lang="ru" dir="auto" translate="no">русский язык</a></li> <li><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/zh-hans" lang="zh-hans" dir="auto" translate="no">简体中文</a></li> </ul> </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> <li><button id="showoptions" data-showhidebuttonid="header-showoptions" class="showhidebutton button-inline" data-target="#controls .opt" aria-expanded="false" data-large-aria-expanded="true" data-showtext='<svg focusable="false" aria-hidden="true" class="icon-languages "><use xlink:href="/WAI/assets/images/icons.svg#icon-languages"></use></svg> Show Customization, Languages, Translations' data-hidetext='Hide Options'><svg focusable="false" aria-hidden="true" class="icon-languages "><use xlink:href="/WAI/assets/images/icons.svg#icon-languages"></use></svg> Show Customization, Languages, Translations</button></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/fundamentals/accessibility-intro/"><span>Introduction to Accessibility</span></a></li><li><a lang="en" href="/WAI/videos/standards-and-benefits/" aria-current="page"><span>Video Introduction</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/" aria-current="location" class="page-link"><span>Introduction to Accessibility</span></a><ul> <li> <a lang="en" href="/WAI/videos/standards-and-benefits/" aria-current="page" class="page-link"><span>Video Introduction</span></a></li></ul></li><li> <a lang="en" href="/WAI/people/" 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'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/" 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><nav class="sidenav-languages" aria-labelledby="languagehead"> <header id="languagehead">Languages/Translations</header> <ul class="langlist"> <li style="margin-bottom: 2px;"><strong style="text-transform: capitalize;">English (original)</strong></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/ar" dir="auto" translate="no" lang="ar">العربية</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/cs" dir="auto" translate="no" lang="cs">čeština</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/de" dir="auto" translate="no" lang="de">Deutsch</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/el" dir="auto" translate="no" lang="el">Ελληνικά</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/es" dir="auto" translate="no" lang="es">español</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/fr" dir="auto" translate="no" lang="fr">français</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/id" dir="auto" translate="no" lang="id">Bahasa Indonesia</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/ja" dir="auto" translate="no" lang="ja">日本語</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/ko" dir="auto" translate="no" lang="ko">한국어</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/nl" dir="auto" translate="no" lang="nl">Nederlands</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/pl" dir="auto" translate="no" lang="pl">polski</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/pt-BR" dir="auto" translate="no" lang="pt-BR">Português do Brasil</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/ru" dir="auto" translate="no" lang="ru">русский язык</a></li><li style="margin-bottom: 2px;"><a style="text-transform: capitalize;" href="/WAI/videos/standards-and-benefits/zh-hans" dir="auto" translate="no" lang="zh-hans">简体中文</a></li></ul> <p><a href="/WAI/translations/">All Translations</a></p> <p><a href="/WAI/about/translating/">Translating WAI Resources</a></p> </nav> </div> <main id="main" lang="en"> <header> <h1> Video Introduction to Web Accessibility and W3C Standards </h1></header> <div class="video-container" data-video-type="" dir="ltr"> <video preload="metadata" data-youtube-id="20SHvU2PKsM" data-youtube-nocookie="true" data-description-audible="false" playsinline=""><track src="/WAI/wai-videos/video-introduction/video-introduction.en.vtt" label="English" kind="captions" srclang="en" default="" /><track src="/WAI/wai-videos/video-introduction/video-introduction.ar.vtt" label="العربية" kind="subtitles" srclang="ar" /><track src="/WAI/wai-videos/video-introduction/video-introduction.cs.vtt" label="čeština" kind="subtitles" srclang="cs" /><track src="/WAI/wai-videos/video-introduction/video-introduction.de.vtt" label="Deutsch" kind="subtitles" srclang="de" /><track src="/WAI/wai-videos/video-introduction/video-introduction.el.vtt" label="Ελληνικά" kind="subtitles" srclang="el" /><track src="/WAI/wai-videos/video-introduction/video-introduction.es.vtt" label="español" kind="subtitles" srclang="es" /><track src="/WAI/wai-videos/video-introduction/video-introduction.fa.vtt" label="فارسی" kind="subtitles" srclang="fa" /><track src="/WAI/wai-videos/video-introduction/video-introduction.fr.vtt" label="français" kind="subtitles" srclang="fr" /><track src="/WAI/wai-videos/video-introduction/video-introduction.gu.vtt" label="ગુજરાતી" kind="subtitles" srclang="gu" /><track src="/WAI/wai-videos/video-introduction/video-introduction.hi.vtt" label="हिन्दी, हिंदी" kind="subtitles" srclang="hi" /><track src="/WAI/wai-videos/video-introduction/video-introduction.hu.vtt" label="Magyar" kind="subtitles" srclang="hu" /><track src="/WAI/wai-videos/video-introduction/video-introduction.id.vtt" label="Bahasa Indonesia" kind="subtitles" srclang="id" /><track src="/WAI/wai-videos/video-introduction/video-introduction.it.vtt" label="Italiano" kind="subtitles" srclang="it" /><track src="/WAI/wai-videos/video-introduction/video-introduction.ja.vtt" label="日本語" kind="subtitles" srclang="ja" /><track src="/WAI/wai-videos/video-introduction/video-introduction.ko.vtt" label="한국어" kind="subtitles" srclang="ko" /><track src="/WAI/wai-videos/video-introduction/video-introduction.kok.vtt" label="कोंकणी" kind="subtitles" srclang="kok" /><track src="/WAI/wai-videos/video-introduction/video-introduction.ml.vtt" label="മലയാളം" kind="subtitles" srclang="ml" /><track src="/WAI/wai-videos/video-introduction/video-introduction.mr.vtt" label="मराठी" kind="subtitles" srclang="mr" /><track src="/WAI/wai-videos/video-introduction/video-introduction.nl.vtt" label="Nederlands" kind="subtitles" srclang="nl" /><track src="/WAI/wai-videos/video-introduction/video-introduction.pl.vtt" label="polski" kind="subtitles" srclang="pl" /><track src="/WAI/wai-videos/video-introduction/video-introduction.pt-BR.vtt" label="Português do Brasil" kind="subtitles" srclang="pt-BR" /><track src="/WAI/wai-videos/video-introduction/video-introduction.ru.vtt" label="русский язык" kind="subtitles" srclang="ru" /><track src="/WAI/wai-videos/video-introduction/video-introduction.te.vtt" label="తెలుగు" kind="subtitles" srclang="te" /><track src="/WAI/wai-videos/video-introduction/video-introduction.zh-hans.vtt" label="简体中文" kind="subtitles" srclang="zh-hans" /></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>This video information is available:</p> <ul> <li><strong>In different languages</strong> — <a href="#translations">Instructions to see subtitles and transcripts</a> are below</li> <li>As a <strong><a href="#transcript">Text Transcript with Description of Visuals</a></strong> below</li> <li><a href="https://www.youtube.com/watch?v=20SHvU2PKsM">On YouTube</a></li> <li>On a W3C server — <a href="https://media.w3.org/wai/accessibility-intro/intro.mp4">video (file format: MP4, file size: 28MB)</a>, <a href="https://media.w3.org/wai/accessibility-intro/W3C_INTRO_SFHI.en.vtt">English captions file (VTT)</a>, <a href="https://media.w3.org/wai/accessibility-intro/">list of other language files</a></li> </ul> <h2 id="moreinfo">Learn More</h2> <p>For more information, see:</p> <ul> <li><a href="/WAI/fundamentals/accessibility-intro/">Introduction to Web Accessibility</a></li> <li><a href="/WAI/perspective-videos/">Web Accessibility Perspectives Videos: Explore the Impact and Benefits for Everyone</a> — videos and information on specific accessibility topics.</li> <li><a href="https://www.w3.org/WAI/"><strong>WAI website</strong></a> — to find a wide range of resources on different aspects of web accessibility <a href="/WAI/standards-guidelines/">standards</a>, <a href="/WAI/teach-advocate/">education</a>, <a href="/WAI/test-evaluate/">testing/evaluation</a>, <a href="/WAI/planning/">project management, and policy</a>.</li> </ul> <h2 id="permission">Permission to Use Video</h2> <p>You may use this video if you include a link to this page. More information is available in <a href="/WAI/about/using-wai-material/">Using WAI Material: Permission to Use with Attribution</a>.</p> <h2 id="audio-description">Audio Description</h2> <p>This video does not include audio description because the visuals only support 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. The Transcript with Description below includes descriptions of the supporting visuals.</p> <p>If you want examples of videos with audio description, see <a href="https://www.youtube.com/watch?v=21yWr7evHTs&list=PLhDEeYUfW02Qo4r2KlzagxZxhYcZADee-">Web Accessibility Perspectives - Audio Described (YouTube playlist)</a>. Or you can select one of the videos on the <a href="/WAI/perspective-videos/">Web Accessibility Perspectives web page</a> and select “Enable Audio Description”.</p> <h2 id="transcript">Text Transcript with Description of Visuals</h2> <table> <thead> <tr> <th width="65%">Audio</th> <th>Visual</th> </tr> </thead> <tbody> <tr> <td>Hi! My name is Shadi Abou-Zahra. I'm the Accessibility Strategy and Technology Specialist at W3C, the World Wide Web Consortium, and today I'd like to tell you about web accessibility.</td> <td>Web Accessibility<br /> [Shadi speaking]</td> </tr> <tr> <td>The Web is for many people an essential part of daily life.</td> <td>People in an Internet cafe</td> </tr> <tr> <td>At work.</td> <td>Someone in an office using a computer</td> </tr> <tr> <td>At home.</td> <td>Someone sitting in a sofa using a laptop</td> </tr> <tr> <td>And on the road.</td> <td>Someone using a mobile phone while walking</td> </tr> <tr> <td>Web accessibility means that people with disabilities can use the Web equally.</td> <td>[Shadi speaking]</td> </tr> <tr> <td>For example, somebody who cannot use their arms, and uses a mouthstick to type.</td> <td>Someone using a mouthstick to type</td> </tr> <tr> <td>Or someone who cannot hear well, and uses captions to watch videos.</td> <td>Someone using a hearing aid</td> </tr> <tr> <td>Or someone who cannot see well, and uses a screen reader to read aloud what's on the screen.</td> <td>Someone using a screen reader</td> </tr> <tr> <td>Accessibility has many benefits.</td> <td>[Shadi speaking]</td> </tr> <tr> <td>For example, captions benefit anyone in a loud or in a quiet environment.</td> <td>Someone watching a video with captions in an office</td> </tr> <tr> <td>And good color contrast works better when there is glare.</td> <td>Someone looking at a mobile phone with glare on the screen</td> </tr> <tr> <td>Also people with age-related impairments, such as reduced dexterity, benefit.</td> <td>Someone with tremors using a mouse with difficulty</td> </tr> <tr> <td>In fact, everyone has a better user experience with an improved layout and design.</td> <td>Two people smiling happily at a well-designed website</td> </tr> <tr> <td>A lot of accessibility can be built into the underlying code of websites and applications.</td> <td>[Shadi speaking]</td> </tr> <tr> <td>Web technologies from W3C, such as HTML, provide many accessibility features.</td> <td>HTML code of a web page</td> </tr> <tr> <td>For example, to provide textual descriptions for images, which are read aloud by screen readers and also used by search engines.</td> <td>Example code</td> </tr> <tr> <td>Also headings, labels, and other code supports accessibility and improves the quality overall.</td> <td>Example code</td> </tr> <tr> <td>Good authoring tools, such as wikis, content management systems, and code editors, help create accessible code - either automatically or with input from the author.</td> <td>Example authoring tool used to create web content</td> </tr> <tr> <td>Also web browsers, media players, and apps need to support accessibility features.</td> <td>Example web browser used to show web content</td> </tr> <tr> <td>W3C provides standards to help make the Web accessible, which are internationally recognized by governments and businesses.</td> <td>[Shadi speaking]</td> </tr> <tr> <td>Most well-known is the Web Content Accessibility Guidelines - WCAG. WCAG is also ISO 40500, and adopted in the European standard called EN 301 549. It is built around four core principles:</td> <td>Web Content Accessibility Guidelines - WCAG; ISO 40500; EN 301 549</td> </tr> <tr> <td>First, Perceivable - for example, so people can see the content, or hear it.</td> <td>Someone typing on their tablet computer and listening to it with headphones</td> </tr> <tr> <td>Operable - for example, so people can use the computer by typing, or by voice.</td> <td>Someone speaking to their computer</td> </tr> <tr> <td>Understandable - for example, so people get clear and simple language.</td> <td>Two people looking confused at the computer screen with a dense website</td> </tr> <tr> <td>And Robust - so people can use different assistive technologies.</td> <td>Someone using screen magnification on a large computer screen</td> </tr> <tr> <td>Besides WCAG, W3C also provides the Authoring Tool Accessibility Guidelines - ATAG, which defines requirements for code management systems, code editors, and other software.</td> <td>Authoring Tool Accessibility Guidelines - ATAG</td> </tr> <tr> <td>And the User Agent Accessibility Guidelines - UAAG, defines requirements for web browsers and media players.</td> <td>User Agent Accessibility Guidelines - UAAG</td> </tr> <tr> <td>There are over one billion people with disabilities, or about 15-20% of the population. The UN Convention on the Rights of Persons with Disabilities defines that access to information, including the Web, as a human right. Most countries around the world have ratified this UN convention, and several have adopted binding policies too. Yet regardless of any laws and regulations, implementing the accessibility standards is essential for people with disabilities, and useful for all.</td> <td>[Shadi speaking]</td> </tr> <tr> <td>For more information on web accessibility, visit w3.org/WAI</td> <td>W3C Web Accessibility Initiative<br /> w3.org/WAI</td> </tr> </tbody> </table> <h2 id="translations">Translations</h2> <p>There are some translations of this entire web page. They are linked at the top of this page.<br />There are <strong>more translations of just the video</strong>. They are available as subtitles and transcripts.</p> <p>To get translations in the captions area in the bottom of the video:</p> <ol> <li> <p>Select <img src="/WAI/content-images/video-introduction/show-cc.png" style="vertical-align: bottom;" alt="" /> “Captions”.</p> </li> <li> <p>Select the language.</p> </li> </ol> <p>To get translations in a separate transcript area:</p> <ol> <li> <p>Select “Show transcript”.<br /><img src="/WAI/content-images/video-introduction/show-transcript.png" alt="" /></p> </li> <li> <p>Use the “Language” drop-down to select subtitles.<br /><img src="/WAI/content-images/video-introduction/show-language.png" alt="" /></p> </li> </ol> <h3 id="translate-into-other-languages">Translate into Other Languages</h3> <p>We welcome additional translations. If you translate the <a href="https://www.w3.org/WAI/wai-videos/video-introduction/video-introduction.en.vtt">VTT file</a>, please send it to <a href="mailto:public-wai-translations@w3.org">public-wai-translations@w3.org</a>. If you might want to translate this entire web page or others, please see <a href="/WAI/about/translating/">Translating WAI Resources</a>.</p> <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/introduction/video-introduction/index.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-video-introduction&wai-url=https://www.w3.org/WAI/videos/standards-and-benefits/" 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> 4 May 2021. <a href="/WAI/videos/standards-and-benefits/changelog/">Latest changes</a>.<br /> First published 4 December 2017.</p><p>Project lead: <a href="https://www.w3.org/People/shadi/">Shadi Abou-Zahra</a>. Contributors: <a href="https://www.w3.org/People/Shawn/">Shawn Lawton Henry</a>, <a href="https://www.w3.org/People/Brewer/">Judy Brewer</a>, <a href="https://www.w3.org/People/yatil/">Eric Eggert</a>. Videographer and video editor: Ulrich Grimm, av-design GmbH. Video clips developed with support from the <a href="https://www.w3.org/WAI/DEV/">WAI-DEV project</a>, co-funded by the European Commission. Translations managed with support from the <a href="https://www.w3.org/WAI/expand-access/">WAI Expanding Access project</a>, funded by the Ford Foundation.</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> <script src="/WAI/assets/scripts/details4everybody.js?1732807903713432608"></script>  <script src="/WAI/assets/scripts/svg4everybody.js?1732807903713432608"></script> <script> svg4everybody(); </script><script> var translationStrings = {}; </script> </body> </html>