202 private links
In short:
- Anchors (links) are for navigating within the current document (page) or to another one.
- The dedicated "submit" and "reset" buttons are for specific form actions.
- Regular buttons are for (JavaScript) actions.
- Links can be styled to look like buttons and vice versa.
Link for navigation.
Buttons for actions.
"Look and feel" can be adjusted in CSS anyway...
How to create accessible spoilers without JS? Well it's a tradeoff.
When a link is activated for a navigation, a POST request can be sent at the same time.
I didn't know it, and you can find a short explanation on MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#ping
HTML webpages as reactive notebooks
.setCustomValidity()
Browser support is increasing
A minimal table editor :)
1.
In HTML5,
content “must be quoted from another source”Heydon rightly makes the distinction between block quotes, which (supposedly) quote another source, and pull-quotes, which highlight excerpts from the article you’re reading.
- No
<cite>
in<blockquote>
Heydon suggests using a
<figure>
and<figcaption>
to invoke this grouping, which seems the most sensible option.The
<blockquote>
cite attribute is generally useless since it’s invisible and most screen readers also ignore it
For inline (or “text-level”) quotations, there is
<q>
instead.HTML is hard
But the developers have no consequences on that.
Build HTML first, then CSS, then JS.
Building your service using progressive enhancement will:
- ensure your service is robust and of a high quality
- make it more likely your service will work regardless of which browser or device is being used
- mean your service’s most basic functionality will work and meet the core needs of the user
- improve accessibility by encouraging best practices like writing semantic markup help users with device or connectivity limitations to use your service
and arguments against SPA.
HTML isn’t only for people working in the tech field. It’s for anybody, the way documents are for anybody. HTML is just another type of document. A very special one—the one the web is built on.
Resources and more about HTML for People: https://htmlforpeople.com/achievement-unlocked-hypertexter/#resources-from-this-book
HTML carry the semantic, so the bdi element indicates how to read its content: left to right or right to left.
Great website design BTW https://heydonworks.com/latest/
Different definition of a UI component, from the minimalistic css one to the SSR full page.
One out of 200.
There is some progress concerning the amount of errors though (since 2021 to 2024): 125, 126, 132, 99.
The implicit association is not recognized by at least two assistive technologies
- unsystematic
- valid
- semantic
- accessible
- required-only
- hyper-optimized
It's all paragraphs at the end :)
- dialog: I use it regularly ✅
- picture: I only use images ⚠️
- data: It can be useful instead of spans 💡
- output: I never saw it ❓
- details/summary: I use it regularly ✅
I will read it someday :)
ObsoHTML is a Node.js script designed to scan HTML, PHP, JavaScript, and TypeScript files for obsolete or proprietary HTML attributes and elements (in scripts, it would catch JSX syntax). It helps you identify and update deprecated HTML code to be more sure to use web standards.