'Skip to main content' link links to region, not content

This is a good point and I totally agree with it, however its not Bartik specific and should be fixed in core first, the problem being that its not terribly easy to fix.

We could switch to using an ID instead of a named anchor, which would likely be an ID set on the Content block, however that can be unreliable since one can also switch off block module. Frankly I don't recall why we are using an named anchor and not an ID, I assume it has something to do with some browser having issue with using an ID as the target, probably Safari or Opera (I think its Safari/Webkit actually).

We'll need to have a think about this one and for now I am moving this to markup and tagging.

Can you explain a bit further? If I move the 'main content' block to another region, it still contains the main content, right? So the skip link always leads to the main content, right?

@brandonojc - no, if you move the main content region to another region, such as a sidebar, the skip link will not lead to the main content. Its not a simple fix either because things like the page title, tabs, action links are all contained within the main content column, but not the main content block. IMO we need to fundamentally rethink page.tpl.php, this issue merely highlights deeper issues.

This is a bit confusing, and I am running into a similar problem with the placement of the ARIA role="main". Theoretically these two should be in the same place.

Core themes have a Content region, and a Main content block.

I think we really want the landing point to be at the beginning of the content region. There is content that is 'main' in the content region (block for preface to contact form) that may come prior to the main content block in the content region.

I'm wondering here if the Skip to Main is really needed on the maintenance page. Usually there's so little content on it that you're skipping over nothing to nothing.

I suppose if someone build a really extensive maintenance page then it would be up to them to build skip links. I'm just not sure there's enough content for it to really be practically needed.

There are a few skip to main issues here - http://drupal.org/project/issues/search/drupal?text=&assigned=&submitted...

Looks like some work's going to go into re-thinking best practices.

Thought it was also sharing this post:
http://terrillthompson.com/blog/161

More descriptive title. I think for most use cases the linkage is fine and if people do put content outside of the normal content region, they can edit the theme themselves to reflect that.

I was hacking away, comming up for a visisble skip link design when I noticed this error too. I wonder if doing what Everett suggests in #5 will solve this long-term.

Obviously if you truely alter it, or use something like panels it can still be pretty confusing. I am not sure if we can really cater for that usecase.

So right now the ARIA role="main" is defined in the page.tpl.php:
<div id="main" role="main" class="clearfix">

But the Skip to main is defined in html.tpl.php:
<a href="#main-content" class="element-invisible element-focusable"><?php print t('Skip to main content'); ?></a>

But then goes to the page.tpl.php's:
<a id="main-content"></a>

Agreed that these should be in the same place.

This is the suggestion I have to consolidate the destination & definition for the main content.

The skip link goes to the appropriate spot -- the Main Content region is where the main content will be located in most sites. Having the main content in another region is an edge case and the developer can edit the skip link in the page.tpl.php to direct to their content location.

(Learn more about skip links at http://webaim.org/techniques/skipnav/ )

As far as the ARIA/anchor link locations, the patch in #12 moves the anchor link next to the ARIA one -- ARIA landmarks are for containers where of course the anchor link stands on its own but it's best to have it as close to the ARIA landmark as possible. Yeah!

(via Montreal Accessibility Sprint)

Should it move main-role or #main-content link anchor ??

I don't know why it has a real link anchor instead of point to any ID directly, eg. #main.

developers should hack #main-content directly.

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

for example. we can add a variable to #main-content

    <div id="skip-link">
      <a href="<?php echo variable_get('skip-link-id', '#main-content'); ?>" class="element-invisible element-focusable"><?php print t('Skip to main content'); ?></a>
    </div>

I will send a patch if you're interested my solutions.

I'd basically punt for Mikes patch in #12 and then let it settle for a while, lets not get too excited about what happens here and now, this is not going to be the end of this.

Re: #14 - I don't use named anchors any more, but I know there were issues with using ID's in some browsers, whether those issues are still relevant I do not know for sure. Zen introduced a theme setting for the skip link ID which many themes, including mine, have copied. However I tend to think for Drupal 8 this needs more automation, and we won't really know how that can work for a while yet, it just depends on what comes out of some of the initiatives.

i see

The patch improves the situation. However, shouldn't we try to move <a href="#main-content" class="element-invisible element-focusable"><?php print t('Skip to main content'); ?></a> from html.tpl.php to page.tpl.php too? I guess it may not be possible because we really want the "Skip to main content" to be at the top.

Dries, yes that's the issue here, if its in page.tpl.php its below the toolbar or whatever else decides to render in $page_top, so somewhat defeating its purpose.

Committed to 8.x. Thanks. Moving to 7.x for consideration.

Is there a reason this was only changed in the default page.tpl.php, and not in the page.tpl.php used by other themes (e.g., Bartik)? Is there a separate issue for that?

@David_Rothstein I don't think so. So yes, we should look at the other core themes and see that this is consistent.

#20: drupal-998302-20.patch queued for re-testing.

#20: drupal-998302-20.patch queued for re-testing.

#20: drupal-998302-20.patch queued for re-testing.

#20: drupal-998302-20.patch queued for re-testing.

#20: drupal-998302-20.patch queued for re-testing.

Needed to convert from page.tpl.php to page.html.twig, so I rerolled Tim's patch.

After it's moved it looks like this:

  <div id="main-wrapper" class="clearfix"><div id="main" class="clearfix">
    {{ breadcrumb }}
    <a id="main-content"></a>

    <main id="content" class="column" role="main"><section class="section">
      {% if page.highlighted %}<div id="highlighted">{{ page.highlighted }}</div>{% endif %}

In comparing the other two page.html.twig pages though, They don't have both a div wrapper and also a <main> tag. Is this needed? What would be in the DIVs vs the MAIN tags?

Arg.. Sorry, missed this was D7.. Any way to just drop #28?

Anyways, #20 should still be good.

#20: drupal-998302-20.patch queued for re-testing.

reroll.. but not sure it is needed.