Saved (Public Feed)

Saved (Public Feed)

#webdevelopment #acccessability #css
Andrian Roselli: Block Links, Cards, Clickable Regions, Etc.
Andrian Roselli: Block Links, Cards, Clickable Regions, Etc.
Perhaps the worst thing you can do for a block link is to wrap everything in the . If you fail to make the link to display: block, it will have dead areas around words or chunks of text, which can make them feel like distinct links for a mouse user. If you use an underline on the entire block of text, it can be hard to read, while no underline at all can remove that visual affordance. Worse, for a screen reader user the entire string is read when tabbing through controls. In the following example, the first link contains the heading, image (without declaring it as an image), and block of text, taking about 25 seconds to read before announcing it as a link. When tabbing, you do not always know the control type until the accessible name is complete.
·adrianroselli.com·
Andrian Roselli: Block Links, Cards, Clickable Regions, Etc.