"Skip to content link" not accessible to some screen-readers

This issue is being discussed here. I will fix it when accessibility gurus will decide which way of hiding skip links is the best one.

Both Garland and Corolla are using html.tpl.php from Drupal core, so the markup for skip link should be the same:

<div id="skip-link">
  <a href="#main-content"><?php print t('Skip to main content'); ?></a>
</div>

In Garland h1 tag is always used for site name. In Corolla h1 tag is used for site name only if there is no content title (e.g. node title, book title, forum title). I suspect that this might be the reason why your screen-reader is reading either site name or node title. From SEO perspective it's a feature. Is this really annoying for screen-reader users?

Nevermind :)

It doesn't read 'skip to content' most likely because it is hidden using height: 0 style. Note that Garland is using different technique for hiding skip links.

Garland:

#skip-link a:link, #skip-link a:visited {
  background: none repeat scroll 0 0 #FFFFFF;
  font-size: 80%;
  font-weight: bold;
  left: auto;
  padding: 0 5px;
  position: absolute;
  text-align: right;
  text-decoration: none;
  top: -99em;
}

Corolla (and Drupal 7 core)

#skip-link  {
  height: 0;
  overflow: hidden;
  padding: 0;
  position: absolute;
}

By core I meant .element-invisible class defined in modules/system/system-behaviors.css.

Seven appears to be using yet another technique for hidding skip-links:

#skip-link  {
  left:50%;
  margin-left:-5.25em;
  margin-top:0;
  position:absolute;
  width:auto;
  z-index:50;
}

The decision to display the skip-links in Garland & Seven differently was largely because we wanted it to look different when it was selected. The whole code in Garland is:

/**
 * Skip link
 */
#skip-link a:link,
#skip-link a:visited {
  font-weight: bold;
  background: #ffffff;
  padding: 0px 5px;
  text-decoration: none;
  font-size: 80%;
  text-align: right;
  top: -99em;
  left: auto;
  position: absolute;
}

#skip-link a:hover,
#skip-link a:focus,
#skip-link a:active  {
  height: auto;
  width: auto;
  overflow: visible;
  top:0;
  left:0;
  position: fixed;
  z-index: 1000;
}

If it were just making the link it would be easy. The most accessible solution is to have the 'Skip to main content' link visible all of the time. That's not always easy to integrate into a site, and displaying on focus is the better compromise. Accessibility isn't just about making a site available to the blind, there are a lot of people with other disabilities (or combinations of disabilities) that may want to skip past the navigation.

Pretty much the decision has been made to show on focus for all core themes, so I think we can close this as a wont-fix in favor of:

#805446: Show skip navigation on focus