Artyom Boologov on Nostr: An #accessibility #a11y finding: hiding #HTML inputs (as in display:none;) makes them ...
An #accessibility #a11y finding: hiding #HTML inputs (as in display:none;) makes them and their labels (even if labels are visible) unfocusable with keyboard. So, to make e.g. the radio tabs pattern accessible, you have to un-paint the radio buttons instead of hiding them. Which is ugly and anti-semantic.
Any better way I’m missing?
#webdev #programming
Published at
2026-08-10 22:56:34 UTCEvent JSON
{
"id": "18a6a79c7f0750c049db51b8f73a4d138cb2cf7afcb82232854f6aec56562bbe",
"pubkey": "9d5b04589961191624c628b7b5082ad3587b0c02bf1e94bc96ec9b5b9fc3e974",
"created_at": 1786402594,
"kind": 1,
"tags": [
[
"t",
"programming"
],
[
"t",
"webdev"
],
[
"t",
"html"
],
[
"t",
"a11y"
],
[
"t",
"accessibility"
],
[
"proxy",
"https://merveilles.town/users/aartaka/statuses/117073680411516714",
"activitypub"
],
[
"client",
"Mostr",
"31990:6be38f8c63df7dbf84db7ec4a6e6fbbd8d19dca3b980efad18585c46f04b26f9:mostr",
"wss://relay.ditto.pub"
]
],
"content": "An #accessibility #a11y finding: hiding #HTML inputs (as in display:none;) makes them and their labels (even if labels are visible) unfocusable with keyboard. So, to make e.g. the radio tabs pattern accessible, you have to un-paint the radio buttons instead of hiding them. Which is ugly and anti-semantic. \n\nAny better way I’m missing?\n\n#webdev #programming",
"sig": "b9280f2e8cdfede70648116a2038b5e1a244379ffa9c5d5e68a0cb7ea7d690d3af7e1d017e794f2d81d20762eec1c46efd60dfd5ee545707534747b6debb0fa2"
}