Items tagged with: HTML

Search

Items tagged with: HTML



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…



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.

htmlforpeople.com/



✍🏽 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…


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.

stackoverflow.com/a/79028606/2…

#webDev #a11y #html #css #javaScript




Top `<table>` tips:

• Don’t span cells:
adrianroselli.com/2023/02/avoi…

• Don’t redefine column headers: adrianroselli.com/2022/02/colu…

• With one exception, you don’t need a `scope` attribute (the exception is sometimes the top corner):
tpgi.com/short-note-on-scoping…

• `column` is not a valid `scope` value:
html.spec.whatwg.org/multipage…

• Be wary of articles that don’t cite sources or testing when they make assertions about `<table>`.

#HTML #table #accessibility #a11y






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.

This may become a blog post.

I filed 3 issues today, have filed 15 since late 2022, and only 2 have been addressed:
github.com/Devographics/Monore…

But these surveys keep pushing problematic info in problematic UIs, giving the wrong impression of… everything.

#a11y #HTML


All titles of the “Upgrade Your #HTML” ebook series are now available at a lower price! 🔻

(The previous price had essentially been dictated by one of the books’ platforms, which is now being worked around by donating the difference.)

If you purchased the latest title and find the new price fairer, reach out so that I can offer you another book, free of charge!

amazon.com/dp/B0B4SD84B2/

#html






#html #css





This is an interesting #HTML proposal from @Seirdy

Should there be a `<spoiler>` element?

seirdy.one/posts/2023/11/12/sp…

My heart says yes. HTML should reflect what people are actually doing on the web. How they write. The features they invent.

But my head says it is a duplicate of `<details>` albeit non-block level.



"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."

htmhell.dev/adventcalendar/202…

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. 🤯

#HTML #CSS #JavaScript #accessibility #a11y #HTMHell



I have a question regarding a semantic HTML construct, and I'd like to know what the current consensus is (if there is one). So here goes:

Should navigation links be placed in an unordered list in a <nav>?

The spec doesn't recommend anything, but examples from MDN (developer.mozilla.org/en-US/do…) and WHATWG (html.spec.whatwg.org/multipage…) consistently use lists unless the contents are written in prose. Is this still the preference more broadly?

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.

#HTML #semanticHTML #WebDev #website #accessibility #a11y