Should the "Skip to main content" link be removed?

Skip to main content is for accesbility. It's for screenreaders.

"Skip..." links are actually more helpful for keyboard only users, not screen-reader users, as screen-reader users generally have alternatives to find the main content of the page.

The link in Core is styled .element-invisible.element-focusable, which hides content, while making it available to screen-reader users, and visible on focus.

This does beg the questions:

1. What WCAG 2.0 success criteria is "Skip to main content" meeting?

2. Are we currently / can we currently meet this success criteria in a different way, which provides more utility to those who require it?

3. Therefore, should "Skip to main content" be removed / replaced in Drupal 8?

I am not sure, we made a choice to support the usecase of those who navigate by keyboard. A simple SEO module would add the required meta description to your page to solve the problem.

I don't like it but well, don't kill it :)
#1390580: Add comments for skip link and main-content anchor in templates

I'm interested why keyboard users needed "Skip it..", they won't use Down Arrow Key? I think down key / page up & down are more helpful ... any refs article ? Thanks.

Always worth looking at why it was added in to see if anything changed #386462: Skip Navigation' should be in all core themes also the Drupal Docs are worth looking at - http://drupal.org/node/467976

There are also other related D8 issues:
#1328770: Allow "skip to main content" visibility to be toggled
#998302: 'Skip to main content' link links to region, not content

But ya, although I totally support re-evaluating stuff, I'd like to see this remain & be enhanced in D8 core.

I'm a sighted keyboard user, and skip-link is massively useful. I'm capable of using a mouse, but just don't like them ;-)

Re: comment #5 - page up/down and the arrows keys allow you to scroll the main content into view easily. This is sufficient if you just want to read the main content.

However, if you want to interact with the page, (e.g. follow a link or fill in a form) then you need a means of navigating to the right place. Typically this means using the tab key to move focus among the operable elements. (Some browsers and browser extensions provide other keyboard navigation aids, but not the mainstream ones.)

Let's look at some metrics. I set up a quick test using the D7 core contact module. Bartik theme, primary links, breadcrumbs, and a menu block in the first sidebar region.

Without using the skip link, it took over 20 tab-key presses before focus reached the first text input element on the contact form.

Using the skip-link, it took just three key presses to start filling in the form:

• TAB to focus the skip-link,
• ENTER to activate the skip-link,
• TAB to move focus to the first form field.

Re: comment #2 - I'm not sure what specific WCAG 2.0 success criteria this meets, but it helps enormously with the general principle of making pages "operable".

I'm massively in favour of keeping the skip-link in core, though there are ways it could be improved. I'd really like to see it become an item which can be manipulated programatically, so that theme- and module- developers could customise it (e.g. add other skip-links like login/logout, and search).

Conversely, I'm not in favour of providing an easy means of disabling it.

I'd also like the option of making it fully visible as well.

The relevant WCAG 2.0 spec is here: http://www.w3.org/TR/2012/NOTE-WCAG20-TECHS-20120103/G1

The existence of a skip link is required, but visibility is isn't required. I think we can safely close this issue as Drupal core must meet WCAG 2.0 as part of the Drupal Accessibility guidelines hence we should not be removing the link.

However, the visibility is another issue altogether. I've made some updates on #1328770: Allow "skip to main content" visibility to be toggled so please have some input in that as well.

The original issue was posted because google indexes the 'Skip to main content' and uses it in the description (when the meta tag is left empty). So the problem remains. I'm reopening and tagging accordingly.

I wonder if there's a way to keep the link and tell google not to "read" it.

I've been looking for a way to hide portion of text from Google.
Indeed, there are googleoff/googleon tags to make text invisible with various options.
Read more here.

The following text won't appear in snippets, for example.
<!--googleoff: snippet-->Come to the fair! <!--googleon: snippet-->

EDIT: Unfortunately it just works for google mini and Google Search Appliance (not standard Google)

http://productforums.google.com/forum/#!category-topic/webmasters/crawli...

There are proprietary ways to hide from the likes of Google custom search, such as using a class class="nocontent", which I have done for a few clients in the past.

All search engines are known to exclude boilerplate content, and as pointed out in #4 this is easily mitigated (and it does work). I have a hard time buying this SEO argument when my own experiences don't bear this out - I've been using skip links for many years as have hundreds of clients, several of whom are SEO professionals.

In my experience it comes down to quality of content - Google and other SE will pluck from the page bits of the content to make up the description, if they can figure out what the page is about (and its not about skip navigation) then you will get a relevant description. This might take time with a new site that has not been well indexed.

I've heard a lot of things said about SEO and Drupal 7, well I have been running many of the accessibility improvements in my sites for years (skip nav, hidden headings and so on), even before D7 shipped. My main site is PR8 and very well indexed, and I have never bothered with meta descriptions. Nough said?

I mentioned this on twitter and had some good conversations. Artur Ortega ‏@DesignedByBlind said:

@mgifford Simple js solution which injects skip links to the landmarks would be good for both without polluting search results.

He's in favor of ditching SkipNav's entirely for ARIA Landmarks. In the long run this would need some better browser support. However, there could be a way to add some JS to do this as he indicated above. This might well be fodder for D9 though.

For D8 though I'd really like to see some evidence that this has a detrimental effect on SEO. Agree with @Jeff here.

Following from that same twitter discussion I was pointed to https://github.com/davidtodd/landmarks

Very interesting project allowing sighted keyboard only users to take advantage of ARIA landmarks for navigation much like they would use tabs now.

I think it still needs a bit of work, but interesting. Gives me hope for being able to remove skip links in D9.

The challenge though is not only waiting till modern browsers are using it, but also that users have grown accustom to using them. User patterns take a long while to change.

Anyways, found this quite an interesting option.

@mgifford: Well, I am in complete favor of skip links. I don't use them so often, but other users do.

IMO this issue should make us think of introducing something to manage meta-tags in Drupal core (or at the very least the description meta tag), as weel as SEO-Friendly URLs.

@falcon03 - Absolutely folks are using them now. The challenge is that D8 won't get released until say the beginning of 2014 and then will only be viable till say 2019. In that time period what will user expectations be? Partly that depends on both browser & the majority of websites.

If browsers & websites both adopt & support solid, useful ARIA landmarks then maybe even keyboard only users will find skip nav links less useful over time. Trick is trying to guess & influence where things are going to be and how to provide the best experience to all users.

If skip links are a simplistic replication of ARIA landmarks then maybe in Drupal 9 we might be able to consider dropping it. Still, that's only something we should consider in consultation with those folks who depend on them now.

Just wanted to post that I am looking for a way to suppress this div.

<DIV id=skip-link><A href="#main-content-area">Skip to main content area</A> </DIV>

Trying to use D7 in a mobile environment where the app is stripping out all styling. So I can't hide it with CSS, and the customer does not want or need it.

Everything is working great, except for this one thing. I totally get that skip links are good, section 508 is important and screen readers are valuable browsers.

Someone stop me before I hack (edit) this theme ... Guess I need to learn subtheming?

Best to post that in whatever theme you're starting with.

I'm pretty confident that you aren't developing your site in Drupal 8 with the Core themes.

Also, think about adding the class "element-invisible" as per:
http://zufelt.ca/blog/drupal-7-two-new-system-classes-improve-accessibility

You are correct, and thanks for the help!