Skip to main content

Search

Items tagged with: aria


Getting better with the whole #ChatGPT flow. Recently used it to refresh my #JavaScript skills to dynamically create elements in a webpage, but I caught it making some buggy code. Catching it and walking it through it's own remediation was really interesting. Interdependent education on both sides of the chat, especially teaching it better #A11y best practices after it implemented #Aria incorrectly. Now I wonder how many subjective a11y ideas and practices are colliding within the models.


A great exampple of why #aria labels may not always bee what you want. I see so many articles/pages/what have you on the web right now that still say "Share on Twitter". Visually it's just the X logo now, but the aria label never got updated. You should probably not be sharing anything into that cesspool anymore at this point, but I'l take the easy example of why invisible labeling = not great at times :) #accessibility


Not so short note on aria-label usage – Big Table Edition

“aria-label is one of a number of secondary methods to label native HTML UI elements. It works particularly well on interactive elements, it also works well on most block level elements old skoolterm that have explicitly or implicitly defined structural roles. It works less well or not at all on text level semantics.”

#aria #HTML #accessibility #WebDev

html5accessibility.com/stuff/2…


✍🏽 drugs button popover - updated October 1 2024

"Several people have questioned my reasoning for writing about the use case of popover as a tooltip, no I was not on drugs, at the time of writing I noticed that GitHub was using popover as a tooltip"

#accessibility #HTML #ARIA

html5accessibility.com/stuff/2…


Anyone running macOS 15 and want to test to see if this `aria-activedescendant` bug is really fixed?
bugs.webkit.org/show_bug.cgi?i…

It’s not that I don’t trust Apple folks, it’s just that I have learned never to take the “Fixed!” assertion at face value.

#a11y #accessibility #Safari #ARIA


@graeme on using the @w3c #ARIA Design Patterns in relation to conformance with #WCAG, on the @TetraLogical blog:
tetralogical.com/blog/2024/08/…


😑🆕 What ARIA still does not do

"Use of ARIA is a promise you as a developer make to screen reader users."

#a11y #ARIA #HTML #WebDev

html5accessibility.com/stuff/2…


Why are my live regions not working? by @patrick_h_lauke

'Live regions have a reputation for being "flaky" and inconsistent. While this can be attributed in part to shortcomings in current implementations, the problem can also be caused by developers misunderstanding how live regions are intended to work.'

#accessibility #HTML #ARIA #WebDev

tetralogical.com/blog/2024/05/…


New post, another in my series of using the right lingo while also carrying the IKEA vibe:

“Be Careful Using ‘Grid’”
adrianroselli.com/2024/07/be-c…

I try to disambiguate between 8 different meanings of the word ‘grid’ in a web dev context.

#HTML #ARIA #CSS #accessibility #a11y


aria-label is one of a number of secondary methods to label native HTML UI elements. It works in some scenarios, less well or not at all on others. Get the details on it's proper and effective usage.

buff.ly/3R7yZLv

#HTML #ARIA #WebDev #WebDevelopment #DigitalAccessibility #Accessibility #A11y


Why are my live regions not working? by @patrick_h_lauke

"Live regions have a reputation for being "flaky" and inconsistent. While this can be attributed in part to shortcomings in current implementations, the problem can also be caused by developers misunderstanding how live regions are intended to work."

#a11y #webDev #HTML #ARIA

tetralogical.com/blog/2024/05/…


A preview of the WAI-ARIA 1.3 draft craigabbott.co.uk/blog/a-look-… #aria #webdev #a11y


🤡 The wrong way to use aria-roledescription to call out someone as a fascist:

html5accessibility.com/stuff/2…

#a11y #webDev #politics #ARIA
[share author='stevef' profile='https://html5accessibility.com/stuff/author/stevef/' avatar='' link='https://html5accessibility.com/stuff/2020/10/06/micro-note-on-aria-roledescription/' posted='2020-10-06 13:28:50' guid='81daf735-8b2361906e7d629a-214181df' message_id='https://html5accessibility.com/stuff/2020/10/06/micro-note-on-aria-roledescription/']aria-roledescription is not a label

It is an alternative expression of the Aural UI of the role of an element.

inappropriately using aria-roledescription may inhibit users’ ability to understand or interact with an element.
ARIA 1.1

The wrong way to use aria-roledescription and call out someone as a fascist:

code

<img aria-roledescription="fascist" src="dt.PNG"
alt="Donald Trump">

This is wrong because you are not identifying the subject of the image as a fascist, you are overwriting the <img> element role so it effectively becomes a <fascist> element. Also, there is no explicit text identification of the subject as a fascist.

A much better way to achieve the aim of identifying a fascist (and not misusing aria-roledescription):
Example of a fascist
code
<figure>
<figcaption>Example of a fascist</figcaption>
<img src="dt.PNG" alt="Donald Trump">
</figure>

html5accessibility.com/stuff/2…


You Don't Need ARIA For That [HTMHell 2022] htmhell.dev/adventcalendar/202… #a11y #aria #webdev #html #tips


With the help of ChatGPT I have added alt text to images in my slide deck "No Industry for Old Men" from #a11yTO 2023

#a11y #webStandards #HTML #ARIA #Depression #aging #ai

docs.google.com/presentation/d…


What Is ARIA Even For? vimeo.com/478398140 by @heydon #aria #webdev #a11y


The aria-modal attribute is just terrific. Now we need TalkBack and Narrator to support it.

The spec: w3.org/TR/wai-aria-1.1/#aria-m…

Support: a11ysupport.io/tech/aria/aria-…

#aria #webdev #modals #dialogs


Related, my HTMHell article "You Don't Need ARIA For That" htmhell.dev/adventcalendar/202… #aria #webdev #a11y #html


Common ARIA mistakes and how to avoid them oidaisdes.org/common-aria-mist… #aria #webdev #a11y


CSS-only Widgets Are Inaccessible adrianroselli.com/2023/03/css-… by @aardrian #webdev #css #a11y #aria


Using CSS to Enforce Accessibility adrianroselli.com/2021/06/usin… by @aardrian #css #aria #a11y #webdev


Common ARIA mistakes and how to avoid them
oidaisdes.org/common-aria-mist…
#aria #webdev #a11y


Meaningful labels using ARIA – or not — 🔥 HTMHell Advent 2022 Day 7 htmhell.dev/adventcalendar/202… #aria #webdev #a11y


You Don't Need ARIA For That: htmhell.dev/adventcalendar/202… 🔥 HTMHell Advent 2022 Day 2 #html #webdev #a11y #aria


So I recommended this resource again on the complexity of custom selects, etc. "<select> your poison" by Sarah Higley. Includes CodePen examples. sarahmhigley.com/writing/selec… #a11y #webdev #aria


"Change the name, but not the state, of play/pause buttons. Use state for all other toggle buttons."
sarahmhigley.com/writing/playi…
#webdev #aria #a11y #buttons


🤔 Wondering what #ARIA attributes can be used on #HTML elements?
Wonder no more:
ARIA in HTML
w3.org/TR/html-aria/
#webdevelopment #accessibility #W3C


Fact: I never implemented role='application' in my entire career as a front-end web development. Related: a11yproject.com/posts/how-to-u… #a11y #aria #webdev


Surprised to learn that support for the ARIA log role is reportedly pretty good. Anyone have direct experience with that?
a11ysupport.io/tech/aria/log_r… #aria #a11y


"aria-label is a code smell" — great article detailing issues with using aria-label ericwbailey.website/published/… by @ericwbailey #aria #webdev #a11y #htmlFirst


@marcozehe Have you taken your site at marcozehe.de offline? Or is its unavailability just temporary? I was used to link to your #aria tips and other articles when explaining accessibility topics.