{"id":1318,"date":"2024-09-03T11:58:21","date_gmt":"2024-09-03T11:58:21","guid":{"rendered":"https:\/\/html5accessibility.com\/stuff\/?p=1318"},"modified":"2024-09-03T15:30:05","modified_gmt":"2024-09-03T15:30:05","slug":"a-prayer-for-the-un-entitled-user","status":"publish","type":"post","link":"https:\/\/html5accessibility.com\/stuff\/2024\/09\/03\/a-prayer-for-the-un-entitled-user\/","title":{"rendered":"prayer for the un-entitled user"},"content":{"rendered":"<p><img loading=\"lazy\" decoding=\"async\" width=\"1017\" height=\"745\" class=\"alignnone wp-image-1324 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/09\/IMG_1972.jpg\" alt=\"Dr Swallow surveys the domain of the entitled user.\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/09\/IMG_1972.jpg 1017w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/09\/IMG_1972-300x220.jpg 300w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/09\/IMG_1972-768x563.jpg 768w\" sizes=\"auto, (max-width: 1017px) 100vw, 1017px\" \/><\/p>\n<p>I wuz reviewing a best practice issue being developed for <a href=\"https:\/\/tetralogical.com\">TetraLogical<\/a> and wanted to check the verascity of a statement it contained.<\/p>\n<blockquote><p>the information provided in the <code class=\"notranslate\">title<\/code>\u00a0attribute is not accessible to users navigating with a keyboard or touch devices, as they cannot hover over elements to view the content.<\/p><\/blockquote>\n<p>I know this was true in the past, but am also aware that Chrome fixed this so it is <em>largely<\/em> available on <a href=\"https:\/\/html.spec.whatwg.org\/multipage\/dom.html#interactive-content-2\">interactive content<\/a>, of the rest who knows?<\/p>\n<h2>try it for yourself<\/h2>\n<ul>\n<li>Open the <a href=\"https:\/\/cdpn.io\/pen\/debug\/YzoJqmd\">test page<\/a> in your browser<\/li>\n<li>on desktop device or touch device with external keyboard: focus each interactive element using the <kbd>tab<\/kbd> key<\/li>\n<li>on touch device: place focus on each interactive control<\/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-default-tab=\"result\" data-slug-hash=\"YzoJqmd\" data-pen-title=\"Untitled\" data-user=\"stevef\">See the Pen <a href=\"https:\/\/codepen.io\/stevef\/pen\/YzoJqmd\"><br \/>\nUntitled<\/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><\/p>\n<h2>Some Results<\/h2>\n<ul>\n<li>Chrome 128.0.6613.85 (64-bit) &#8211; <strong>Mostly<\/strong><\/li>\n<li>Firefox 129.0.2(64-bit) &#8211; <strong>No<\/strong><\/li>\n<li>Safari 17.2 &#8211; <strong>No<\/strong><\/li>\n<li>Chrome 127.0.6533.100 (arm64) &#8211; <strong>No<\/strong><\/li>\n<li>Android 14 running Chrome 127.0.6533.106 and Firefox 129.0.2:\u00a0 (tested using an actual external keyboard paired with the device through Bluetooth) &#8211; <strong>No<\/strong><\/li>\n<li>\u00a0iOS 17.6.1:\u00a0 Safari, Chrome (331.0), and Firefox (130.0) &#8211; <strong>No<\/strong><\/li>\n<\/ul>\n<p class=\"note\">Like the rest of the web platform, <a href=\"https:\/\/en.wikipedia.org\/wiki\/Web_interoperability\">interoperability<\/a> is key to <a href=\"https:\/\/www.w3.org\/TR\/UNDERSTANDING-WCAG20\/conformance.html#uc-accessibility-support-head\">accessibility support<\/a>. It is safe to say at this time (September 2024) that the display of <code>title<\/code> attribute content on keyboard focus is not implemented interoperably.<\/p>\n<p>Thanks to <a href=\"https:\/\/www.linkedin.com\/in\/graeme-coleman-43ab38268\/\">Graeme Coleman<\/a> for the Android\/iOS test results<\/p>\n<h2>\u00a0defiant jazz<br \/>\n<iframe loading=\"lazy\" title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/Turq37lntO0?si=DCAu8tJWheenwOXa&amp;start=64\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/h2>\n","protected":false},"excerpt":{"rendered":"<p>I wuz reviewing a best practice issue being developed for TetraLogical and wanted to check the verascity of a statement it contained. the information provided in the title\u00a0attribute is not accessible to users navigating with a keyboard or touch devices, as they cannot hover over elements to view the content. I know this was true [&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-1318","post","type-post","status-publish","format-standard","hentry","category-htmlaccessibility"],"_links":{"self":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/1318","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=1318"}],"version-history":[{"count":12,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/1318\/revisions"}],"predecessor-version":[{"id":1332,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/1318\/revisions\/1332"}],"wp:attachment":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/media?parent=1318"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/categories?post=1318"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/tags?post=1318"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}