The annual HTML conformance analysis, validating 200 home pages of the most popular websites. Despite improvements, there is no signal of commitment to valid output as a quality baseline to benefit end users as well as web development as a profession…
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.”
Even though I know #HTML inside out and use it virtually every day, I'm still reading #HTMLForPeople by @bw because it's a prime example of how a good guide should be written.
1. The book is simple and easy to follow, with relevant points explained well enough even for non-coders to understand. 2. Images are clearly described for #blind readers through the use of #AltText. 3. The website is easy to navigate with a #ScreenReader. 4. There are no annoying pop-ups or ads on the website. 5. The book is entirely free of charge.
"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"
People on StackOverflow telling people to screw up #accessibility with the HTML dialog element defeats the purpose of using that element in the first place IMO. Please upvote my answer that corrects the numerous wrong answers, including the accepted answer, to this question if you have an SO account.
Semantic code in HTML is still important in modern web development. It can improve accessibility, SEO, maintainability, cross-device compatibility, future-proofing, collaboration, and page load times.
In 2 recent articles I have illustrated why the scope attribute is not needed on data tables with one row or column of th elements, or data tables with 1...
'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.'
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.
I have been reading through the State of HTML 2023 results site (2023.stateofhtml.com/) and I am so disappointed in the overall #accessibility efforts — both in the questions and in the code.
“The reasons why use of the placeholder attribute as the only means of providing a user readable prompt for a form control is deficient UX, are voluminous. It is frustrating having to rehash this discussion endlessly.”
"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."
I've been having too much fun clipping things on YouTube to share with my colleagues. Here's a clip with @slightlyoff on questions you should ask yourself when considering React:
Attached: 1 image
Welcome to another edition of "Is this phishing?"
Assume the email is in principle plausible and the transaction ID exists. What is the worst that can happen if you press send?
#phishing
Photo by studio tdes. Used under CC BY 2.0 Deed. Image cropped and contrast enhanced. A few days ago Benjy Stanton asked about breaking long words in tables. I offered a suggestion, which may or may not have worked. I never asked.
A long time ago (2008) I wrote an article: Screen Readers lack emphasis. At the time, 15 years ago, the screen readers tested did not signify the semantics of text...
An informal proposal for dedicated elements for spoiler tags in HTML: use-cases, syntax, semantics, recommended UA behavior, and comparisons with “details”
I recently needed to test the support of a dynamic accessible description – a element’s description that is initially one (or no) value, then changes to…
"Most importantly, tooltips should only provide descriptive and non-essential text, giving slightly more detailed text for active elements such as links and form controls. Ultimately, they provide expendable text which is already on the web page."
Great in-depth article about #tooltips by Jan Hellbusch. He knows what he's talking about, had the pleasure to be in one of his workshops and he's an absolute pro. 🤯
I have some other questions in this area. Safari removes list semantics if you remove the bullets (with exceptions, such as if the list is a child of "nav"), due to alleged "list-itis". At what point do lists become inappropriate? If I have a list of blog posts, and I format them as cards, with a heading, publish date, summary, and an image, is that too much content for each <li>?
Also, MDN and WHATWG point out not all links should be contained in navs (such as footer links), and "nav" should instead signal major blocks of navigation links. Would my prior example of a list of blog posts count as a major block? Should I enclose my list of blog posts in a nav? Does that extend to all section, category, and tag pages listing pages in that section/category/tag?
Feel free to respond if you have opinions, but keep it civil, and boosts are appreciated.