WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Keyword Search results, highlighting words within the text

for

Number of posts in this thread: 4 (In chronological order)

From: Nancy Johnson
Date: Fri, Sep 21 2012 5:21AM
Subject: Keyword Search results, highlighting words within the text
No previous message | Next message →

Hi,

We are adding a Keyword search to our site. For the results, we are
thinking of highlighting the keywords within the text, with a bold and
maybe color.

For screen reader users, Does the screen reader pick up on the bold text?
If it doesn't what is the best way for the screen reader to indicate the
text is of some importance.

Thanks,

Nancy Johnson

From: Joe Chidzik
Date: Fri, Sep 21 2012 5:46AM
Subject: Re: Keyword Search results, highlighting words within the text
← Previous message | Next message →

> We are adding a Keyword search to our site. For the results, we are
> thinking of highlighting the keywords within the text, with a bold and maybe color.
>
> For screen reader users, Does the screen reader pick up on the bold text?
> If it doesn't what is the best way for the screen reader to indicate the text is of
> some importance.

[Joe Chidzik] Using <em> or <strong> are the preferred elements to semantically indicate relative importance of text (rather than the purely visual <b> and <i> elements). The <strong> element would likely be more appropriate here, though for a more in-depth look at the merits of both, see http://html5doctor.com/i-b-em-strong-element/

From: Kornbrot, Diana
Date: Fri, Sep 21 2012 5:49AM
Subject: Re: Keyword Search results, highlighting words within the text
← Previous message | Next message →

You need to produce your page using a html editor that produces html5 compliant responsive html5

http://www.tinymce.com/index.php, http://ckeditor.com/

These use the tag <strong> for bold, which will be ok with screen readers
You can check conformance with guidelines using RNIB resources given at http://www.rnib.org.uk/professionals/webaccessibility/testingtips/Pages/automated_testing.aspx>;

Confromance with guideline, unfortunately, does not guarentee accessibility - but it helps

Meanwhile, there is probably be accessible ARIA code for the whole keyword search that other members of this list can supply
Good luck

Best
diana





On 21/09/2012 12:21, "Nancy Johnson" < = EMAIL ADDRESS REMOVED = > wrote:

Hi,

We are adding a Keyword search to our site. For the results, we are
thinking of highlighting the keywords within the text, with a bold and
maybe color.

For screen reader users, Does the screen reader pick up on the bold text?
If it doesn't what is the best way for the screen reader to indicate the
text is of some importance.

Thanks,

Nancy Johnson
Emeritus Professor Diana Kornbrot
email: = EMAIL ADDRESS REMOVED =
web: http://dianakornbrot.wordpress.com/
Work
Department of Psychology
School of Life and Medical Sciences
University of Hertfordshire
College Lane, Hatfield, Hertfordshire AL10 9AB, UK
voice: +44 (0) 170 728 4626
fax: +44 (0) 170 728 5073
Home
19 Elmhurst Avenue
London N2 0LT, UK
voice: +44 (0) 208 444 2081
mobile: +44 (0) 740 318 1612
fax: +44 (0) 870 706 1445

From: Jared Smith
Date: Fri, Sep 21 2012 8:56AM
Subject: Re: Keyword Search results, highlighting words within the text
← Previous message | No next message

On Fri, Sep 21, 2012 at 5:21 AM, Nancy Johnson wrote:
> Does the screen reader pick up on the bold text?

Most don't do anything different with bold or emphasized text.

I disagree with Joe on recommending <em> or <strong>. In this case,
the text is not semantically emphasized (you wouldn't emphasize the
highlighted words in speech, for example), it is simply being flagged
presentationally. Using <b> or <i> would be more appropriate.

HTML5 does have the <mark> element which is intended precisely for
this type of thing. Of course screen readers don't do anything special
with it either... yet. But that's not really your problem. More
details on <mark> - http://html5doctor.com/draw-attention-with-mark/

Jared