{"id":1155,"date":"2024-06-16T12:45:32","date_gmt":"2024-06-16T12:45:32","guid":{"rendered":"https:\/\/html5accessibility.com\/stuff\/?p=1155"},"modified":"2024-06-28T11:07:44","modified_gmt":"2024-06-28T11:07:44","slug":"a11y-juice-phone-it-in-edition","status":"publish","type":"post","link":"https:\/\/html5accessibility.com\/stuff\/2024\/06\/16\/a11y-juice-phone-it-in-edition\/","title":{"rendered":"a11y juice &#8211; phone it in edition"},"content":{"rendered":"<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-1156 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/IMG_0511.jpg\" alt=\"Street art on a concrete wall featuring a stencil of a young girl with her arm raised. The text above the girl reads, 'PEOPLE DON'T PRETEND TO BE DEPRESSED, THEY PRETEND TO BE HAPPY.'\" width=\"680\" height=\"469\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/IMG_0511.jpg 680w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/IMG_0511-300x207.jpg 300w\" sizes=\"auto, (max-width: 680px) 100vw, 680px\" \/><\/p>\n<p class=\"note\">Street art by <a href=\"https:\/\/dotmaster.co.uk\/who\/\">Dotmaster<\/a><\/p>\n<h2>Owned control<\/h2>\n<p>You ever get the feeling that some big corporations want you to abandon the open web, in favour of the walled gardens of their apps?<\/p>\n<p>One method they use to get your <em>asses<\/em> under their control is to constantly tempt you with FOMO (fear of missing out):<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-1158 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/IMG_1112.jpg\" alt=\"Screenshot of a notification banner from LinkedIn. The banner has a dark background and includes a small icon of a smartphone on the left side. The message reads, &quot;Get full access to LinkedIn. Use the app,&quot; with the phrase &quot;Use the app&quot; highlighted in blue, indicating it is a clickable link. On the far right, there is an &quot;X&quot; symbol to close the notification. The banner prompts users to download and use the LinkedIn mobile application for a better experience.\" width=\"750\" height=\"130\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/IMG_1112.jpg 750w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/IMG_1112-300x52.jpg 300w\" sizes=\"auto, (max-width: 750px) 100vw, 750px\" \/><\/p>\n<p>You ain&#8217;t getting <strong>FULL ACCESS<\/strong> on your phone unless you <span style=\"color: #3366ff;\"><strong>Use the app<\/strong><\/span>.<\/p>\n<h2>coercion on occasion<\/h2>\n<p>I can live with this coercion on occasion, but it&#8217;s starts to <em>grind my gears<\/em> when no matter how many times you dismiss the banner it re-appears, or the banner is a permanent visual feature:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-1159 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-181539.png\" alt=\"Screenshot of a promotional banner for Gmail. The banner features the Gmail logo on the left, which consists of a stylized envelope with Google's signature colors (red, blue, green, and yellow). The text next to the logo reads, 'Upgrade to a smarter Gmail,' followed by the subtext 'Secure, fast and organized email.' On the far right side of the banner, there is a blue 'OPEN' button, suggesting that clicking it will lead to more information or directly open the Gmail app. \" width=\"514\" height=\"101\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-181539.png 514w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-181539-300x59.png 300w\" sizes=\"auto, (max-width: 514px) 100vw, 514px\" \/><\/p>\n<p>If you don&#8217;t want to be <em>herded<\/em> you have to accept a permanent loss of screen space.<\/p>\n<p>I still live with this, but what really <em>grinds my gears<\/em> is the lack of basic accessibility functionality within these web sites. By all means <strong>push<\/strong> your claimed <strong>fuller<\/strong>, <strong>smarter<\/strong> experience but don&#8217;t <strong>undermine<\/strong> my ability as a user of the web to make the content I post <strong>accessible<\/strong>.<\/p>\n<h2>#A11Y 1.1.1<\/h2>\n<p>I continually forget what the WCAG SC numbers are, but I cannot forget <a href=\"https:\/\/www.w3.org\/TR\/WCAG22\/#non-text-content\">1.1.1<\/a><\/p>\n<p>Open source social media provides a means to add <code>alt<\/code> text to an <code>&lt;img&gt;<\/code>:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-1161 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-184239.png\" alt=\"screenshot of a Mastodon post by Steve Faulkner. The post features Steve Faulkner's profile picture, a small headshot with glasses, and his handle @SteveFaulkner. The text of the post reads, 'A hero or a hunk? Why not both?' Below the text, there is an image of a man wearing dark glasses and a suit, with an 'ALT' text label indicating accessibility features. The post includes buttons for public visibility, language selection (English), and a purple 'Post' button\" width=\"331\" height=\"507\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-184239.png 331w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-184239-196x300.png 196w\" sizes=\"auto, (max-width: 331px) 100vw, 331px\" \/><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-1166 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-190227.png\" alt=\"Screenshot of an 'Edit media' Dialog from Mastodon, a social media platform. It displays a picture of a man named David sitting in a car with the words 'COCK PISS SWALLOW' written in black on the car. There is a tool to select the focal point of the image by clicking or dragging a circle. Below the image, there is a text box labeled 'Describe for people who are blind or have low vision,' with the text: 'David decorates his car in a homage to Alan Partridge.' There is a &quot;Detect text from picture&quot; option and a &quot;Apply&quot; button at the bottom.\" width=\"366\" height=\"525\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-190227.png 366w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-190227-209x300.png 209w\" sizes=\"auto, (max-width: 366px) 100vw, 366px\" \/><\/p>\n<p>Even Fascist owned social media has a means to <code>alt<\/code> text to an <code>&lt;img&gt;<\/code>:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-1163 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-184755.png\" alt=\"Screenshot of the 'Edit image description' interface on X, a social media platform. The interface displays a photo taken indoors at a high vantage point, showing a group of four people. Adrian in the foreground is taking a selfie while wearing a face mask. Behind him, two people, Jonny and Patrick are looking at another person Steve, who is fiddling with his trousers. The background shows a cityscape with tall buildings. Below the image is a text box labeled 'Description' for adding alt text, with a 'Save' button in the top right corner.\" width=\"755\" height=\"858\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-184755.png 755w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-184755-264x300.png 264w\" sizes=\"auto, (max-width: 755px) 100vw, 755px\" \/><\/p>\n<p>So why don&#8217;t <em>good<\/em> corporate citizens who claim to <em>care<\/em> about accessibility provide the most basic functionality to add <code>alt<\/code> text to an <code>&lt;img&gt;<\/code> when using their tools to author content on a phone?<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-1169 size-full\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-190801.png\" alt=\"Screenshot of a 'Share' dialog from LinkedIn, a social media platform. Steven Faulkner's profile picture and name appear at the top, with his post set to public. His post states, 'On my phone the option to add alt text to an image is absent. Below the text, there is an image of a notification banner from LinkedIn, which reads, 'Get full access to LinkedIn. Use the app,' with an 'X' button to close it. The interface includes options to add media, tag people, and add hashtags before posting, but no method to provide an image description.\" width=\"402\" height=\"353\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-190801.png 402w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-15-190801-300x263.png 300w\" sizes=\"auto, (max-width: 402px) 100vw, 402px\" \/><\/p>\n<h2 id=\"creep\">desktop creep<\/h2>\n<p>Some social media sites, <a href=\"https:\/\/www.linkedin.com\/feed\/update\/urn:li:activity:7210891920133255168?commentUrn=urn%3Ali%3Acomment%3A%28activity%3A7210891920133255168%2C7212409086124961793%29&amp;dashCommentUrn=urn%3Ali%3Afsd_comment%3A%287212409086124961793%2Curn%3Ali%3Aactivity%3A7210891920133255168%29\">LinkedIn for example<\/a>, provide ability to add images in comments but do not allow you to add <code>alt<\/code> text.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1184\" src=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-28-115915.png\" alt=\"Comment on LinkedIn post on desktop site allows image upload but no alt text, so the alt must be written in text next to the image\" width=\"734\" height=\"397\" srcset=\"https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-28-115915.png 734w, https:\/\/html5accessibility.com\/stuff\/wp-content\/uploads\/2024\/06\/Screenshot-2024-06-28-115915-300x162.png 300w\" sizes=\"auto, (max-width: 734px) 100vw, 734px\" \/><\/p>\n<p><iframe loading=\"lazy\" title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/hWUiLJnEYJI?si=WWbELsy3t6EHj8vV&amp;clip=UgkxEAuzDo7-afOhT6UWhdsMe-zP7FR3IJq1&amp;clipt=EOifARjAvwM\" width=\"560\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Street art by Dotmaster Owned control You ever get the feeling that some big corporations want you to abandon the open web, in favour of the walled gardens of their apps? One method they use to get your asses under their control is to constantly tempt you with FOMO (fear of missing out): You ain&#8217;t [&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-1155","post","type-post","status-publish","format-standard","hentry","category-htmlaccessibility"],"_links":{"self":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/1155","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=1155"}],"version-history":[{"count":17,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/1155\/revisions"}],"predecessor-version":[{"id":1185,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/posts\/1155\/revisions\/1185"}],"wp:attachment":[{"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/media?parent=1155"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/categories?post=1155"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/html5accessibility.com\/stuff\/wp-json\/wp\/v2\/tags?post=1155"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}