{"id":373,"date":"2021-04-12T09:34:25","date_gmt":"2021-04-12T09:34:25","guid":{"rendered":"https:\/\/html5accessibility.com\/stuff\/?p=373"},"modified":"2021-04-12T12:21:19","modified_gmt":"2021-04-12T12:21:19","slug":"short-note-on-role-none-or-presentation","status":"publish","type":"post","link":"https:\/\/html5accessibility.com\/stuff\/2021\/04\/12\/short-note-on-role-none-or-presentation\/","title":{"rendered":"Short note on role none or presentation?"},"content":{"rendered":"<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-379 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2021\/04\/jb-1.jpg\" alt=\"manifest destitution\" width=\"768\" height=\"359\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2021\/04\/jb-1.jpg 768w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2021\/04\/jb-1-300x140.jpg 300w\" sizes=\"auto, (max-width: 768px) 100vw, 768px\" \/><\/p>\n<p class=\"note\">Updated from <a href=\"https:\/\/codepen.io\/stevef\/post\/none-or-presentation\">Short note on role none or presentation?<\/a><\/p>\n<h1>none or presentation?<\/h1>\n<p><strong>Do either work across browsers and Screen Readers?<\/strong><\/p>\n<p>Details on <a href=\"https:\/\/www.w3.org\/TR\/using-aria\/#ariapresentation\">Use of <code>role=presentation<\/code> or <code>role=none<\/code><\/a><\/p>\n<h2>Short answer is:<\/h2>\n<ul>\n<li>All <strong><em>modern browsers<\/em><\/strong> support both <code>role=\"none\"<\/code> and <code>role=\"presentation\"<\/code><\/li>\n<li>Internet Explorer 11 supports <code>role=\"presentation\"<\/code> only<\/li>\n<li>JAWS 2021 works around IE&#8217;s lack and so <strong>supports<\/strong> <code>role=\"none\"<\/code><\/li>\n<li>NVDA 2020.4 does not work around IE&#8217;s lack of support and so <strong>does not support<\/strong> <code>role=\"none\"<\/code><\/li>\n<li>Version 89.0.774.75 (Official build) (64-bit) supports both, Narrator <strong>works as expected<\/strong>.<\/li>\n<li>NVDA and JAWS <strong>work as expected<\/strong> with Firefox 64.0b12 (64-bit) and Chrome Version 70.0.3538.110 (Official Build) (64-bit).<\/li>\n<li>VoiceOver with Safari 12.01 and Chrome Version 67.0.3396 on macOS Sierra <strong>works as expected<\/strong>.<\/li>\n<li>VoiceOver with Firefox 87, macOS 10.15.6 &#038; 11.2.3 <strong>works as expected<\/strong>.<\/li>\n<\/ul>\n<p class=\"codepen\" style=\"height: 300px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;\" data-height=\"300\" data-theme-id=\"5390\" data-default-tab=\"result\" data-user=\"stevef\" data-slug-hash=\"dQKjVg\" data-pen-title=\"none or presentation?\">See the Pen <a href=\"https:\/\/codepen.io\/stevef\/pen\/dQKjVg\"><br \/>\nnone or presentation?<\/a> by steve faulkner (<a href=\"https:\/\/codepen.io\/stevef\">@stevef<\/a>)<br \/>\non <a href=\"https:\/\/codepen.io\">CodePen<\/a>.<\/p>\n<p><script async src=\"https:\/\/cpwebassets.codepen.io\/assets\/embed\/ei.js\"><\/script><br \/>\n<iframe loading=\"lazy\" title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/_0uKW3FFQsI\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Updated from Short note on role none or presentation? none or presentation? Do either work across browsers and Screen Readers? Details on Use of role=presentation or role=none Short answer is: All modern browsers support both role=&#8221;none&#8221; and role=&#8221;presentation&#8221; Internet Explorer 11 supports role=&#8221;presentation&#8221; only JAWS 2021 works around IE&#8217;s lack and so supports role=&#8221;none&#8221; NVDA [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-373","post","type-post","status-publish","format-standard","hentry","category-htmlaccessibility"],"_links":{"self":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/373","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/comments?post=373"}],"version-history":[{"count":8,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/373\/revisions"}],"predecessor-version":[{"id":382,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/373\/revisions\/382"}],"wp:attachment":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/media?parent=373"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/categories?post=373"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/tags?post=373"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}