CINXE.COM
Digital Accessibility
<!doctype html> <html lang="en" class="default"> <head> <!-- Google Tag Manager --> <!-- End Google Tag Manager --> <!-- Google Tag --> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-'); </script> <!-- End Google Tag --> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Digital Accessibility</title> <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" integrity="sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p" crossorigin="anonymous"/> <link rel="shortcut icon" href="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/favicon.ico" /> <style type="text/css"> /* ============ desktop view ============ */ @media all and (min-width: 992px) { .sub-menu li{ position: relative; } .sub-menu .submenu{ display: none; position: absolute; left:100%; top:-7px; } .sub-menu .submenu-left{ right:100%; left:auto; } .sub-menu > li:hover{ background-color: #f1f1f1 } .sub-menu > li:hover > .submenu{ display: block; } #wpadminbar{ top: -32px !important; } .navbar-nav { } } /* ============ desktop view .end// ============ */ /* ============ small devices ============ */ @media (max-width: 991px) { .sub-menu .sub-menu{ margin-left:0.7rem; margin-right:0.7rem; margin-bottom: .5rem; } } /* ============ small devices .end// ============ */ </style> <script type="text/javascript"> window.onload = function (){ setTimeout(function () { var tabindex = 0; var nextTabIndex = $(this).prev().tabIndex; $('a.skip-link').attr('tabindex', 0); $('ul.navbar-nav li').attr('tabindex', -1); $('a[href=""]').remove(); $('li.post-tile-menu-item, li.menu-item, li.menu-item button, li.menu-item li.menu-item').each(function() { var currentTabIndex = $(this).find('a').attr('tabindex'); $(this).css('order', currentTabIndex); $('li.menu-item button').attr('tabindex', $(this).prev('a').attr('tabindex')) }); let firstTabbedKey = 'false'; let tabbedKey = 'false'; let skippedKey = 'false'; let { nextElementSibling } = this; while (nextElementSibling && nextElementSibling.tagName !== 'li a') { nextElementSibling = nextElementSibling.nextElementSibling; } document.onkeydown = function(evt) { evt = evt || window.event; const elem = document.querySelector('.skip-link'); if (evt.keyCode == 27) {//27 is the code for escape var subMenuToggle = document.activeElement.parentNode.parentNode.parentNode; $('.sub-menu').removeClass('show'); $(subMenuToggle).find('.sub-menu-toggle').focus(); } if (evt.keyCode == 9 && firstTabbedKey == 'false'){ var skipTab = $('.skip-link'); skipTab.focus(); firstTabbedKey = 'true'; evt.preventDefault(); return false; } if (evt.keyCode == 13 && firstTabbedKey == 'true' && skippedKey == 'false' && tabbedKey == 'false') { var skipToContent = $('#main h2:first, #main li:first, #main a:first'); // var skipToContent = document.getElementsByTagName("a")[0]; skipToContent.focus(); skippedKey = 'true'; evt.preventDefault(); return false; } if (evt.keyCode == 13 && firstTabbedKey == 'true' && skippedKey == 'false' && tabbedKey == 'true' && elem === document.activeElement) { var skipToContent = $('#main h2:first, #main li:first, #main a:first'); // var skipToContent = document.getElementsByTagName("a")[0]; skipToContent.focus(); evt.preventDefault(); return false; } if (evt.keyCode == 9 && firstTabbedKey == 'true' && skippedKey == 'false' && tabbedKey == 'false'){ // let order = document.getElementsByTagName("li")[0].tabIndex; // var menuTab = $('#menu-main-nav li[tabindex="' + order + '"]'); var menuTab = $('.logo-wrap'); menuTab.focus(); tabbedKey = 'true'; evt.preventDefault(); return false; } if(evt.keyCode == 13 && firstTabbedKey == 'true' && skippedKey == 'true' && tabbedKey == 'true'){ var skipToContent = $('#main h2:first, #main li:first, #main a:first'); skipToContent.focus(); } } document.onkeyup = function(evt) { if (evt.keyCode == 27) { $(this).closest('.menu-item-has-children').find('.sub-menu-toggle').focus(); } } }, 10); }; document.addEventListener("DOMContentLoaded", function(){ /////// Prevent closing from click inside dropdown document.querySelectorAll('.sub-menu').forEach(function(element){ element.addEventListener('click', function (e) { e.stopPropagation(); }); }) // make it as accordion for smaller screens if (window.innerWidth < 992) { // close all inner dropdowns when parent is closed document.querySelectorAll('.navbar .menu-item-has-children').forEach(function(everydropdown){ everydropdown.addEventListener('hidden.bs.dropdown', function () { // after dropdown is hidden, then find all submenus this.querySelectorAll('.sub-menu').forEach(function(everysubmenu){ // hide every submenu as well everysubmenu.style.display = 'none'; }); }) }); document.querySelectorAll('.sub-menu a').forEach(function(element){ element.addEventListener('hover', function (e) { let nextEl = this.nextElementSibling; if(nextEl && nextEl.classList.contains('sub-menu')) { // prevent opening link if link needs to open dropdown e.preventDefault(); console.log(nextEl); if(nextEl.style.display == 'block'){ nextEl.style.display = 'none'; } else { nextEl.style.display = 'block'; } } }); }); } }); </script> <meta name='robots' content='max-image-preview:large' /> <link rel='dns-prefetch' href='//accessibility.jhu.edu' /> <link rel='dns-prefetch' href='//cdn.jsdelivr.net' /> <link rel='dns-prefetch' href='//code.jquery.com' /> <script type="text/javascript"> /* <![CDATA[ */ window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/15.0.3\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/15.0.3\/svg\/","svgExt":".svg","source":{"concatemoji":"https:\/\/accessibility.jhu.edu\/wp-includes\/js\/wp-emoji-release.min.js?ver=6.6.2"}}; /*! This file is auto-generated */ !function(i,n){var o,s,e;function c(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(o,JSON.stringify(t))}catch(e){}}function p(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data),r=(e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0),new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data));return t.every(function(e,t){return e===r[t]})}function u(e,t,n){switch(t){case"flag":return n(e,"\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!n(e,"\ud83c\uddfa\ud83c\uddf3","\ud83c\uddfa\u200b\ud83c\uddf3")&&!n(e,"\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!n(e,"\ud83d\udc26\u200d\u2b1b","\ud83d\udc26\u200b\u2b1b")}return!1}function f(e,t,n){var r="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):i.createElement("canvas"),a=r.getContext("2d",{willReadFrequently:!0}),o=(a.textBaseline="top",a.font="600 32px Arial",{});return e.forEach(function(e){o[e]=t(a,e,n)}),o}function t(e){var t=i.createElement("script");t.src=e,t.defer=!0,i.head.appendChild(t)}"undefined"!=typeof Promise&&(o="wpEmojiSettingsSupports",s=["flag","emoji"],n.supports={everything:!0,everythingExceptFlag:!0},e=new Promise(function(e){i.addEventListener("DOMContentLoaded",e,{once:!0})}),new Promise(function(t){var n=function(){try{var e=JSON.parse(sessionStorage.getItem(o));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()<e.timestamp+604800&&"object"==typeof e.supportTests)return e.supportTests}catch(e){}return null}();if(!n){if("undefined"!=typeof Worker&&"undefined"!=typeof OffscreenCanvas&&"undefined"!=typeof URL&&URL.createObjectURL&&"undefined"!=typeof Blob)try{var e="postMessage("+f.toString()+"("+[JSON.stringify(s),u.toString(),p.toString()].join(",")+"));",r=new Blob([e],{type:"text/javascript"}),a=new Worker(URL.createObjectURL(r),{name:"wpTestEmojiSupports"});return void(a.onmessage=function(e){c(n=e.data),a.terminate(),t(n)})}catch(e){}c(n=f(s,u,p))}t(n)}).then(function(e){for(var t in e)n.supports[t]=e[t],n.supports.everything=n.supports.everything&&n.supports[t],"flag"!==t&&(n.supports.everythingExceptFlag=n.supports.everythingExceptFlag&&n.supports[t]);n.supports.everythingExceptFlag=n.supports.everythingExceptFlag&&!n.supports.flag,n.DOMReady=!1,n.readyCallback=function(){n.DOMReady=!0}}).then(function(){return e}).then(function(){var e;n.supports.everything||(n.readyCallback(),(e=n.source||{}).concatemoji?t(e.concatemoji):e.wpemoji&&e.twemoji&&(t(e.twemoji),t(e.wpemoji)))}))}((window,document),window._wpemojiSettings); /* ]]> */ </script> <style id='wp-emoji-styles-inline-css' type='text/css'> img.wp-smiley, img.emoji { display: inline !important; border: none !important; box-shadow: none !important; height: 1em !important; width: 1em !important; margin: 0 0.07em !important; vertical-align: -0.1em !important; background: none !important; padding: 0 !important; } </style> <link rel='stylesheet' id='wp-block-library-css' href='https://accessibility.jhu.edu/wp-includes/css/dist/block-library/style.min.css?ver=6.6.2' type='text/css' media='all' /> <style id='classic-theme-styles-inline-css' type='text/css'> /*! This file is auto-generated */ .wp-block-button__link{color:#fff;background-color:#32373c;border-radius:9999px;box-shadow:none;text-decoration:none;padding:calc(.667em + 2px) calc(1.333em + 2px);font-size:1.125em}.wp-block-file__button{background:#32373c;color:#fff;text-decoration:none} </style> <style id='global-styles-inline-css' type='text/css'> :root{--wp--preset--aspect-ratio--square: 1;--wp--preset--aspect-ratio--4-3: 4/3;--wp--preset--aspect-ratio--3-4: 3/4;--wp--preset--aspect-ratio--3-2: 3/2;--wp--preset--aspect-ratio--2-3: 2/3;--wp--preset--aspect-ratio--16-9: 16/9;--wp--preset--aspect-ratio--9-16: 9/16;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small: 13px;--wp--preset--font-size--medium: 20px;--wp--preset--font-size--large: 36px;--wp--preset--font-size--x-large: 42px;--wp--preset--spacing--20: 0.44rem;--wp--preset--spacing--30: 0.67rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2.25rem;--wp--preset--spacing--70: 3.38rem;--wp--preset--spacing--80: 5.06rem;--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);--wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);}:where(.is-layout-flex){gap: 0.5em;}:where(.is-layout-grid){gap: 0.5em;}body .is-layout-flex{display: flex;}.is-layout-flex{flex-wrap: wrap;align-items: center;}.is-layout-flex > :is(*, div){margin: 0;}body .is-layout-grid{display: grid;}.is-layout-grid > :is(*, div){margin: 0;}:where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;}:where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--wp--preset--font-size--x-large) !important;} :where(.wp-block-post-template.is-layout-flex){gap: 1.25em;}:where(.wp-block-post-template.is-layout-grid){gap: 1.25em;} :where(.wp-block-columns.is-layout-flex){gap: 2em;}:where(.wp-block-columns.is-layout-grid){gap: 2em;} :root :where(.wp-block-pullquote){font-size: 1.5em;line-height: 1.6;} </style> <link rel='stylesheet' id='pb-accordion-blocks-style-css' href='https://accessibility.jhu.edu/wp-content/plugins/accordion-blocks/build/index.css?ver=1.5.0' type='text/css' media='all' /> <link rel='stylesheet' id='bootstrap-css' href='https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/vendors/bootstrap/css/bootstrap.min.css?ver=6.6.2' type='text/css' media='all' /> <link rel='stylesheet' id='style-css' href='https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/style.css?ver=6.6.2' type='text/css' media='all' /> <link rel='stylesheet' id='tablepress-default-css' href='https://accessibility.jhu.edu/wp-content/plugins/tablepress/css/build/default.css?ver=2.1.8' type='text/css' media='all' /> <link rel="https://api.w.org/" href="https://accessibility.jhu.edu/wp-json/" /><link rel="alternate" title="JSON" type="application/json" href="https://accessibility.jhu.edu/wp-json/wp/v2/pages/25" /><link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://accessibility.jhu.edu/xmlrpc.php?rsd" /> <meta name="generator" content="WordPress 6.6.2" /> <link rel="canonical" href="https://accessibility.jhu.edu/guidelines-and-responsibilities/" /> <link rel='shortlink' href='https://accessibility.jhu.edu/?p=25' /> <link rel="alternate" title="oEmbed (JSON)" type="application/json+oembed" href="https://accessibility.jhu.edu/wp-json/oembed/1.0/embed?url=https%3A%2F%2Faccessibility.jhu.edu%2Fguidelines-and-responsibilities%2F" /> <link rel="alternate" title="oEmbed (XML)" type="text/xml+oembed" href="https://accessibility.jhu.edu/wp-json/oembed/1.0/embed?url=https%3A%2F%2Faccessibility.jhu.edu%2Fguidelines-and-responsibilities%2F&format=xml" /> </head> <a class="skip-link screen-reader-text" href="#main" aria-label="Skip To Content" role="navigation" tabindex="0">Skip to content</a> <body class="page-template-default page page-id-25"> <!-- Additionally, paste this code immediately after the opening <body> tag --> <!-- Google Tag Manager (noscript) --> <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5K9DL47" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> <!-- End Google Tag Manager (noscript) --> <!-- Global site tag (gtag.js) - Google Analytics --> <script async src="https://www.googletagmanager.com/gtag/js?id=UA-34493483-1"></script> <div class="sticky-header"> <header> <div class="container"> <div class="navbar nav-head"> <div class="navbar-brand d-flex"> <a class="logo-wrap" href="/"> <span class="logo"> <img alt="Johns Hopkins University Logo" src="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/assets/img/JHU_logo_blue.svg" /> </span> <span class="title">Digital Accessibility</span> </a> </div> <div class="utility-menu"> <a class="nav-search" href="javascript:openSearch()">Search</a> <a class="btn btn-primary-outline nav-contact" href="/contact">Contact</a> </div> </div> </div> </header> <nav class="navbar navbar-expand-lg main-navigation" role="navigation"> <div class="container"> <button class="navbar-toggler ml-auto" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <i class="fa fa-bars" aria-hidden="true"></i> Menu </button> <div class="collapse navbar-collapse menu-main-nav-container" role="navigation" id="navbarSupportedContent"> <!--div class="menu-container container"--> <!--?php get_template_part( 'template-parts/header/site-header/button-menu-close' ); ?--> <!--div class="row" --> <ul id="menu-main-nav" class="navbar-nav "><li id="menu-item-44" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-25 current_page_item menu-item-44"><a href="https://accessibility.jhu.edu/guidelines-and-responsibilities/" aria-current="page">Getting Started</a></li> <li id="menu-item-46" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-46"><a href="https://accessibility.jhu.edu/techniques/">Techniques</a></li> <li id="menu-item-48" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-48"><a href="https://accessibility.jhu.edu/training-and-resources/">Training</a></li> <li id="menu-item-40" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-40"><a href="https://accessibility.jhu.edu/events/">Events</a></li> <li id="menu-item-42" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-42"><a href="https://accessibility.jhu.edu/frequently-asked-questions-faqs/">FAQ</a></li> <li id="menu-item-151" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-151"><a href="https://accessibility.jhu.edu/procurement/">Procurement<span class="screen-reader-text">. Sub menu is available. Go to the button next to this link to open sub menu.</span></a><button class="sub-menu-toggle dropdown-arrow" aria-expanded="false"><i aria-hidden="false" class="fa fa-chevron-down"></i><span class="sub-menu-toggle-text-open screen-reader-text" aria-hidden="false">Open menu</span><span class="sub-menu-toggle-text-close screen-reader-text" aria-hidden="true">Close menu</span></button> <ul class="sub-menu"> <li id="menu-item-314" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-314"><a href="https://accessibility.jhu.edu/accessibility-services-vendors/">Vendors of Accessibility Services</a></li> </ul> </li> <li id="menu-item-38" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-38"><a href="https://accessibility.jhu.edu/accessibility-and-accommodation/">Accommodations</a></li> <li id="menu-item-577" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-577"><a href="https://accessibility.jhu.edu/digital-accessibility-initiatives-at-jhu/">Initiatives</a></li> <li id="menu-item-585" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-585"><a href="https://accessibility.jhu.edu/tools/">Tools</a></li> </ul> <!--/div--><!-- .row --> <!--/div--><!-- .menu-container --> <ul class="archives-menu navbar-nav ml-auto"> </ul> <ul class="mobile-navbar-nav"> <li class="menu-item utility-item"> <li class="menu-item utility-item"> <a href="/?s=">Search</a> </li> <li class="menu-item utility-item"> <a href="/contact">Contact</a> </li> </ul> <!--div class="more"> <a href="javascript:toggleOverflow()"><i class="fa fa-ellipsis-v" aria-hidden="true"></i> More</a> </div--> </div> </div> </div> </nav> </div> <div class="secondary-jumbotron" role="banner" aria-label="Page Banner"> <div class="container-fluid"> <img src="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/assets/img/small_banner@2x.png" alt="Getting Started Site Banner" /> <div class="jumbotron-overlay"> <div class="inner-wrap"> <h1 role="heading" aria-label="Page Heading"> Getting Started </h1> </div> </div> </div> </div> <div class="container"> <div class="breadcrumb"> <div id="crumbs" role="navigation" aria-label="breadcrumb"><a href="https://accessibility.jhu.edu">Home</a> <span class="bread-sep">/</span> <span class="current">Getting Started</span></div> </div> </div> <main role="main" id="main" tabindex="-1"> <section id="mainContent" class="container pt-2"> <div class="narrow-width"> <p></p> <figure class="wp-block-image size-full"><img fetchpriority="high" decoding="async" width="626" height="417" src="https://accessibility.jhu.edu/wp-content/uploads/sites/18/young-blind-person-with-long-cane-walking-city_1157-38790.webp" alt="Blind woman sitting on steps talking on a cell phone with her cane next to her" class="wp-image-61" srcset="https://accessibility.jhu.edu/wp-content/uploads/sites/31/young-blind-person-with-long-cane-walking-city_1157-38790.webp 626w, https://accessibility.jhu.edu/wp-content/uploads/sites/31/young-blind-person-with-long-cane-walking-city_1157-38790-300x200.webp 300w" sizes="(max-width: 626px) 100vw, 626px" /></figure> <h4 class="wp-block-customblock-custom-headline-title">What Is Digital Accessibility?</h4> <p>Digital Accessibility is the inclusive practice of designing and creating websites and other electronic information to be usable by as wide an audience as possible, including those with disabilities. Digital accessibility encompasses all disabilities that affect digital access, including auditory, cognitive, physical, neurological and visual disabilities. </p> <h4 class="wp-block-customblock-custom-headline-title">Why is Digital Accessibility Important?</h4> <p>As more and more activities are conducted online, it is crucial that we leave no one out. This includes people with disabilities. <a href="https://www.cdc.gov/ncbddd/disabilityandhealth/infographic-disability-impacts-all.html#text-version" target="_blank" rel="noopener">Up to 1 in 4</a> of the US adult population has some form of a disability. The likelihood of developing a disability increases as we age. <br><br>Digital Accessibility is an important part of <a href="https://diversity.jhu.edu/" target="_blank" rel="noopener">Diversity, Equity and Inclusion (DEI)</a>. It’s essential to include disabled customers, applicants, students, faculty and staff, and consciously work to attract and retain them. That includes ensuring that websites, digital materials or apps on your site meet accessibility standards. </p> <p>Digital accessibility is also a <a href="https://www.ada.gov/resources/web-guidance/">legal requirement</a>. Organizations that receive federal funds are <a href="https://www.ada.gov/resources/disability-rights-guide/#rehabilitation-act">barred from discriminating against people with disabilities</a>.</p> <p>Accessibility also benefits those without disabilities through useful features such as captions, better color contrast and readability and consistent structure. Search engine optimization improves when sites are more accessible. The reach of your website increases with an accessible site. </p> <h4 class="wp-block-customblock-custom-headline-title">How Do I Know if My Digital Content is Accessible?</h4> <p>JHU uses the prevailing accessibility standard for its digital content, currently the <a href="https://www.w3.org/WAI/WCAG21/quickref/">Web Content Accessibility Guidelines (WCAG) 2.1, Level AA</a>. This standard covers not only websites and web applications (developed at JHU or purchased products), but also documents, course materials, slide decks, multimedia (videos, audio files) and social media. To check your materials for accessibility, you can: </p> <ol class="wp-block-list" style="list-style-type:1"> <li>Use automated accessibility checking tools to check your websites and documents. JHU has licensed <a href="https://accessibility.jhu.edu/tools/">some of these tools </a>for faculty and staff use. </li> <li>Documents can be checked for accessibility with the <a href="https://support.microsoft.com/en-us/office/improve-accessibility-with-the-accessibility-checker-a16f6de0-2f39-4a2b-8bd8-5ad801426c7f">accessibility checkers in Microsoft Office</a>, <a href="https://helpx.adobe.com/acrobat/using/create-verify-pdf-accessibility.html">Adobe Acrobat</a>. </li> <li>Since automated accessibility checking tools only detect about 30-40% of accessibility barriers, <a href="https://accessibility.jhu.edu/manual-accessibility-testing-guide/">manual checks</a> are also important. <ul class="wp-block-list"> <li>Navigate your website without a mouse and <a href="https://webaim.org/techniques/keyboard/#testing">check that the site is fully usable with a keyboard.</a> </li> <li><a href="https://www.siteimprove.com/glossary/screen-reader-testing/">Test your website with a screen reader </a>such as <a href="https://www.nvaccess.org/download/">NVDA</a>, JAWS for Windows or <a href="https://support.apple.com/guide/voiceover/welcome/mac">VoiceOver</a> for Mac. </li> <li>Make sure that all <a href="https://webaim.org/techniques/captions/">video is captioned and audio files have transcripts</a>.</li> <li>Informational images need to have <a href="https://webaim.org/techniques/alttext/">ALT (alternative) text</a> with a short description of the image. Decorative images can be given a <a href="https://www.w3.org/WAI/tutorials/images/decorative/">null ALT tag</a>. </li> <li><a href="https://webaim.org/techniques/forms/">Forms need to have labels</a> that are associated with the data field.聽</li> <li>Make sure <a href="https://webaim.org/techniques/hypertext/link_text">links have meaningful names</a> so that users know what the link is for. For example, use “financial aid application” as a link name instead of “click here” </li> </ul> </li> <li>Be sure to <a href="https://uxdesign.cc/semantic-html-the-foundation-of-web-accessibility-e5bbecad7c17">structure your document or website with semantic tags</a> that make it easier for people with disabilities to navigate (titles, headings, bulleted lists, tables, language).</li> <li>Be sure that your text and background colors <a href="https://webaim.org/articles/contrast/">have sufficient color contrast</a> so that they are readable. </li> <li>Make sure <a href="https://webaim.org/techniques/writing/">your content is clearly and simply written</a>. </li> <li><a href="https://www.digitala11y.com/3-2-3-consistent-navigation/">Layout and navigation should be as consistent as possible</a>. </li> </ol> <p></p> </div> </section> </main> <footer> <div class="container py-5"> <div class="row"> <div class="col-lg-3"><a class="footer-logo" href="/"><img src="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/assets/img/JHU_logo_white.svg" width="227px" height="43px" alt="Johns Hopkins University Logo" /></a></div> <div id="footerLocation" class="col-lg"> <p id="locationInfo">IT@ Johns Hopkins<br /> 5801 Smith Avenue<br /> Davis Building, Suite 110A<br /> Baltimore MD 21209 </p> </div> <div id="footerContact" class="footer-contact col-lg"> <p> </p> <p><a href="/cdn-cgi/l/email-protection#562133343735353325253f343f3a3f222f163c3e2378333223"><span class="__cf_email__" data-cfemail="2a5d4f484b49494f595943484346435e536a40425f044f4e5f">[email protected]</span></a></p> </div> </div> <hr /> <div class="copyright">Copyright @ 2024 The Johns Hopkins University. All rights reserved.</div> </div> </footer> <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script type="text/javascript" src="https://code.jquery.com/jquery-3.7.1.min.js?ver=1" id="jquery-js"></script> <script type="text/javascript" src="https://accessibility.jhu.edu/wp-content/plugins/accordion-blocks/js/accordion-blocks.min.js?ver=1.5.0" id="pb-accordion-blocks-frontend-script-js"></script> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js?ver=1" id="bootstrapjs-js"></script> <script type="text/javascript" src="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/assets/js/script.js?ver=1" id="customjs-js"></script> <script type="text/javascript" src="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/assets/js/custom-scripts.js?ver=1" id="customJHjs-js"></script> <script type="text/javascript" src="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/assets/js/menu.min.js?ver=1" id="errigal-menu-js"></script> <script type="text/javascript" src="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/assets/js/mobile.min.js?ver=1" id="errigal-mobile-js"></script> <div id="myOverlay" class="overlay"> <span class="closebtn" onclick="closeSearch()" onKeyPress="closeSearch()" tabindex="3" title="Close Overlay"><i class="fal fa-times"></i></span> <div class="overlay-content"> <form id="searchform" class="search" method="get" action="/"> <div class="input-group"> <input type="search" class="field search-field form-control" tabindex="1" id="" name="s" value="" placeholder="Search …"> <span class="input-group-append"> <input type="submit" class="submit btn btn-primary" name="submit" tabindex="2" value="Search"> </span> </div> </form> </div> </div> <script type="text/javascript" language="javascript"> // Open the full screen search box function openSearch() { document.getElementById("myOverlay").style.display = "block"; $('.search-field').focus(); } // Close the full screen search box function closeSearch() { document.getElementById("myOverlay").style.display = "none"; if (location.hash == '#myOverlay') { location.hash = ''; } } // Handle ESC key (key code 27) document.addEventListener('keyup', function(e) { if (e.keyCode == 27) { closeSearch(); } }); </script> <!--<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>--> <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js" integrity="sha256-DI6NdAhhFRnO2k51mumYeDShet3I8AKCQf/tf7ARNhI=" crossorigin="anonymous"></script> <!-- <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>--> <script type="text/javascript" src="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/assets/js/jquery.maskedinput.min.js"></script> <script type="text/javascript" src="https://accessibility.jhu.edu/wp-content/themes/Johns-Hopkins-University/assets/js/client.js"></script> </body> </html>