Jul. 14th, 2010

deborah: the Library of Congress cataloging numbers for children's literature, technology, and library science (Default)
[personal profile] deborah
Sometimes -- very rarely, but sometimes -- there needs to be text made available to screenreaders, but hidden from people using standard, CSS-aware visual browsers. In general, this is something that should be avoided, but there are valid use cases. For example, tag clouds, in which the size of the typeface is (usually) invisible to screenreaders and people using text-only browsers, but that typeface size includes semantic information. Hiding text from everyone except for CSS-unaware browsers makes it possible to reveal that information to screenreaders and text-only browsers without providing redundant information to visual browsers.

lj_base.css contains a new class, "invisible".

.invisible {
position:absolute;
left:-10000px;
top:auto;
}

Using this class will make text visible for screenreaders and CSS-unaware browsers, but hidden from everyone using CSS. Use this sparingly!

Example: <span class ="invisible">Nobody with CSS turned on can see me!</span>

Profile

dw_dev: The word "develop" using the Swirly D logo.  (Default)
Dreamwidth Open Source Development

November 2025

S M T W T F S
      1
2345678
9101112131415
16171819202122
2324252627 2829
30      

Most Popular Tags

Style Credit

Expand Cut Tags

No cut tags
Page generated Dec. 1st, 2025 02:50 pm
Powered by Dreamwidth Studios