Bartik, your skip link is always hidden; even on focus

tagging

Here's a patch taking the code from Garland & applying it. Also is a screenshot & you can see it in action here http://drupal7.dev.openconcept.ca/

I'd punt for the Skip Link CSS strait out of the Seven theme - its looks way more stylish and actually suits the toolbar styling (which is why I did it the way it is).

Works with me.

@Jeff can you roll up a patch with that in it so we can get this in core and close the issue?

Heres a patch with skip nav showing on focus based on the Seven theme CSS - I'm using this elsewhere and grabbed it from one of my themes - by memory the only change was adding khtml border radius which we forgot to add to Seven (I think).

My god, its even alphabetic.

Screen shot for the patch in #6

Hey I like the way that looks. Although, can we use a san-serif font, instead of georgia? It's inheriting Georgia from the overall font spec, but things like this in Bartik are overridden to be a san-serif font.

OK, here one with sans-serif fonts, same as above patch but changed:

font-size: 0.94em;

to...

font: 0.94em/1.7 "Helvetica Neue", Helvetica, Arial, sans-serif;

That's up and fine here - http://drupal7.dev.openconcept.ca

Looks good. Any reason this can't be RTBC as it is now?

Instead of redeclaring the font stack, I put #skip-link in the font declaration up top. Having a background of #444 is useless on the Stark color set, I added a rgba transparency (40% black), keeping the #444 as a fallback. Also, there was one minor spacing error.

tim - can please explain this error before making such a big change to the positioning, this was tested very extensively for the Seven theme and the off-left method excluded based on numerous tests showing its potential fallibility in a number of other issues relating to hiding content (the infamous .element-invisible discussions), e.g. http://drupal.org/node/718922#comment-2920470

Off-top is fine in this context because the skip link is always the first thing in the source order, whereas off-left could be problematic and require, again, a lot of browser and RTL testing.

Can you also please include some screenshots of the changes in color.

No! You misunderstood me. Also, you didn't look at the patch. I made no functional changes except the background-color.

#header,
#footer-wrapper,
#preview #preview-header,
#skip-link,
ul.contextual-links,
ul.links,
ul.primary,
div.field-type-taxonomy-term-reference,
div.messages,
div.meta,
p.comment-time,
table,
.breadcrumb {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

I just added #skip-link to that instead of redeclaring font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; with the rest of #skip-link.

screenshot

Ok dude, keep your hair on pal, yes I did look at and misread it OK, no need to start yelling all over the place.

Its too translucent to guarantee contrast, ie with very pale headers it could fail the required level of contrast.

background: rgba(0, 0, 0, 0.6); should ensure its always has enough contrast - looses some of the pretty but there you go.

Rerolled with the one character change...

Looks good.

Committed to HEAD. Thanks!

We need to re-open this because the left: -1000px; declaration is causing issues with RTL for a couple of browses (IE and Opera). I think we can safely change to top: -1000px;

@Jeff

+1 I don't see any problems with using top -1000 . Since the expectation is that the link is at the top of the page then we don't need to worry about the viewport jumping to the top of the page, it's already there.

#19: bartik-rtl-skip-nav-cleanup.patch queued for re-testing.

Can we RTBC this?

Yes. I applied it here http://drupal7.dev.openconcept.ca/ar which is RTL and it looks fine.

Jeff, thanks for testing for RTL with this patch. Always an important thing to remember to do.

Awesome, thanks for the great work on this. Our accessibility backlog is definitely getting there! :)

Committed to HEAD.