ansaurus

Question

How to hide any text from sighted user and search engine but not from screen reader?

Answer 1

A:

In your HTML:

<span class="hideMe">some text</span>

In your CSS:

hideMe{display:none;}

2010-04-24 16:32:25

no it will be hidden fro screen readers also http://stackoverflow.com/questions/1755656/displaynone-vs-visibilityhidden-vs-text-indent9999-how-screen-reader-behave-wi/1755717#1755717

metal-gear-solid 2010-04-24 16:34:47

No, it would not. Screen readers do not read stylesheets. The only way to make that hidden from screen readers is to put the display:none inline.

2010-04-25 11:22:15

@austin cheney Screen readers read what is on the screen. Elements hidden with "display: none", except for certain cases, are hidden from screen readers as well. See http://juicystudio.com/article/screen-readers-display-none.php

Jeffery To 2010-04-29 07:02:47

@Jeffery To No, I know that is not true from my own usability testing with Jaws. Screen readers do not read stylesheets. Period. display:none hides text from screen readers only when it is inline to the specific HTML tag(s).

2010-04-29 07:10:18

@austin cheney Which version of JAWS did you test? Which browser? Which browser version? Did you try Window-Eyes? NVDA? VoiceOver (on Mac)?

Jeffery To 2010-04-29 08:12:23

@Jeffery To I cannot remember as its been a little while. I do not have much need for screen reader testing in my current position in Afghanistan.

2010-04-29 08:26:41

Answer 2

+3 A:

The jQuery UI CSS framework does this by positioning elements far off-screen, e.g.

.ui-helper-hidden-accessible { position: absolute; left: -99999999px; }

Matt 2010-04-24 16:57:27

+1 yes it's looking good. but is there any way to hide unnecessary content from search engines.

metal-gear-solid 2010-04-24 17:24:57

Deliberately placing text off the screen is considered a black hat SEO trick.

2010-04-25 11:26:11

@austin cheney It depends on intent. If you're hiding text that helps visually-impaired users then it's fine. If you're hiding text to do keyword stuffing then it's black hat SEO.

Jeffery To 2010-04-29 07:14:11

Answer 3

+1 A:

Well, you've got display:none, visibility:hidden, and placing the text far off-screen.

Not all screen readers follow the standards, and there's no standard way of dealing with non-standard behavior.

You can't use HTML and CSS to hide content from screen readers, yet have it visible to real people. If it's in the page, it's in the page for everyone. At best, you could use robots.txt to prevent the engine from scraping the page.

eaolson 2010-04-24 17:39:22

ansaurus

tags:

views:

answers:

How to hide any text from sighted user and search engine but not from screen reader?

related questions