Cynthia

alexgeek · Sep 25th, 2007, 23:58

I don't get this one:

Quote:

O. 508 Standards, Section 1194.22, (o) A method shall be provided that permits users to skip repetitive navigation links.

Rule: (o).1 - All pages are required to contain a bookmark link to skip navigation that has the specified text in either the link text or the 'title' attribute value.
Skip Navigation Text:
- Note: This rule has not been selected to be verified for this checkpoint.

karinne · Sep 26th, 2007, 13:52

Would this be the access keys?

Daniel · Sep 26th, 2007, 13:58

Who's Cynthia?

welshstew · Sep 26th, 2007, 14:07

I think its a requirement to have accesibility link to skip to page content.

so from a screen readers point of view it would read:
page title
skip to content
navigation
content
footer

Daniel · Sep 26th, 2007, 14:08

I understand that - still doesnt answer my question

welshstew · Sep 26th, 2007, 14:12

Quote:

Originally Posted by Daniel

I understand that - still doesnt answer my question

oh, it's / she's the name of a validation tool for 508

http://www.cynthiasays.com/

would have been better if they put a little hottie on the image thou

Daniel · Sep 26th, 2007, 14:13

Oooooo thanks

karinne · Sep 26th, 2007, 14:16

Thy this article from Alistapart - Accesskeys: Unlocking Hidden Navigation

alexgeek · Sep 26th, 2007, 16:09

Quote:

Originally Posted by welshstew

I think its a requirement to have accesibility link to skip to page content.

so from a screen readers point of view it would read:
page title
skip to content
navigation
content
footer

How would i do this

karinne · Sep 26th, 2007, 16:31

Quote:

Originally Posted by alexgeek

How would i do this

...

Quote:

Originally Posted by karinne

Thy this article from Alistapart - Accesskeys: Unlocking Hidden Navigation

alexgeek · Sep 26th, 2007, 16:32

Quote:

Originally Posted by karinne

...

Must of skipped over that
thanks Karinne

welshstew · Sep 26th, 2007, 17:43

you will also need to have a link at the top of your site to skip to content.

i.e.

Code: Select all

css
.accessibility{ display:none; overflow:hidden;}

html
<html>
<head>
<body><div class="accessibility"><a href="#content" title="skip to page content" accesskey="a">link to content</div>
<div class="header>other code for header etc</div>
<div class="accessibility"><a name="content" title="page content">main content</div>
<div class="content">other code for content etc</div>

and other code

notice how it it the first item that the screen reader see's.

You will need to read the standard to get the correct wording for the title tag for it to comply, but that is the gist of it.

Stew

alexgeek · Sep 26th, 2007, 17:48

Thanks I will look into this

pa007 · Sep 27th, 2007, 09:20

Never use display: none; to hide accessibility text as a large majority of screen readers to not display this text either then. Use text-indent:-9999px;

Also I would always put skip links as the first element in a document that way as soon as you hit tab the skip links will be selected. The whole point of them is to make it easier for people not using conventional software packages or for people with some kind of disability to navigate your site quicker so the sooner you give them these options the better.

Pete.

welshstew · Sep 27th, 2007, 09:33

Quote:

Originally Posted by pa007

Never use display: none; to hide accessibility text as a large majority of screen readers to not display this text either then. Use text-indent:-9999px;

Pete.

I never knew that, good to know. Thanks Pete.

But without the display: none; won't the browser assign some "space" to the div, even though the text is off screen?

MikeHopley · Sep 27th, 2007, 14:38

Quote:

Originally Posted by welshstew

But without the display: none; won't the browser assign some "space" to the div, even though the text is off screen?

You can use absolute positioning instead. This removes the element completely from the visual formatting "flow"; it is positioned independently (in its own "layer"):

Code: Select all

ul#skipLinks {
position:absolute;
top: -100em;
z-index: 2;
}

...and then override this by moving the links back into view when they receive focus. This way, people using a visual browser can still use them as keyboard navigation (although most won't realise they exist, of course). You need to make sure they stand out against the background after positioning. Here's my code:

Code: Select all

ul.skipLinks a:focus {
    position: absolute;
    top: 5.5em;
    color: black;
    background: yellow;
    border: 2px solid red;
    font-size: 200%;
    padding: 0.5em;
}

Who knows? It might help some users of visual browsers, especially if you explain this feature somewhere on your site.

alexgeek · Sep 27th, 2007, 15:11

I don't think I will bother for my one site
as it's just a portfolio
my others sites i will though
thanks guyss