For mobile sites it's pretty common practice to move major navigation to the bottom of the page. This prevents the navigation taking up the majority of the screen on each page load.

If we want to achieve a decent mobile toolbar similar to this then we need to mobile the mark up below the page content. This does not affect the desktop layout as it is stuck up there with position fixed.

I'd like to get an accessibility view on this.

Comments

mgifford’s picture

Great to look for both accessibility & mobile. Most overlook the challenges of combining the two.

What are the challenges you see in allowing the tool bar to be above or below the content?

I'd have to talk to a few blind users to see if this would present any problems for them. I suspect it would be fine, but ultimately it depends on the users.

Everett Zufelt’s picture

I don't really see this working from an accessibility perspective.

1. Screen-reader users, especially those new to Drupal, may spend some time using the system before even finding out that there is a toolbar. After finding it they need to go to the bottom of the page each time to use it. If A sighted user is interacting w/ a screen-reader user they will say 'The "Content" item in the toolbar at the top of the page'.
2. Keyboard only users have a terrible time tabing through the page (as this will be visually top, but DOM order bottom, unless we adjust tabindex.

On a completely personal note I would 'hate, hate, hate, hate, it'.

webchick’s picture

Just curious... what if this only happened in a theme-narrow.css for display sizes <= 400px or so? I guess it's the same problem on a cell phone as well.

Everett Zufelt’s picture

I don't do a whole lot of mobile browsing, but I suspect that it would be te same. Some screen-readers do provide a navigational keystroke for 'go to bottom of page'. The number of users that know it is another question. I suspect that this exists, and is known about, less with mobile browsers.

LewisNyman’s picture

Isn't this the kind of thing the "Skip to nav" link is made for?

@webchick Making mark up at the bottom of the page appear at the top is possible, especially if we are using position: fixed like we are now. Doing it the other way round is really tricky, I'm not sure if it's possible without using Javascript to measure the height of the page.

In an ideal world we would have access to a server side "screen width" context that would allow us to change the mark up.

Everett Zufelt’s picture

@lewisnyman

We could do 'Skip to Toolbar'. Can you please tell me how you would feel about finding / clicking an extra link every time you wished to access the toolbar?

Your suggestion would help somewhat with the discoverability issue.

LewisNyman’s picture

Good point, I didn't consider that. Is there a "back to top" function in most screen readers? That is what they would have to do now in order to get back to the toolbar.

We are also going to marking up the toolbar semantically #1190210: Convert toolbar.tpl.php to HTML5

mgifford’s picture

One of these days I'm going to have to watch you navigate on a smart phone Everett. It wouldn't be in a logical order, but if it's done right having a logically structured toolbar along the bottom may not be such a bad thing.

I do think that the practice is changing. It's more common for folks to find toolbars and other navigation along the bottom on a mobile site. For many users it's the logical place to put it since it's closer to your fingers. However, we're again in an area where I don't know if there is a best practice that works best for accessibility & usability.

I think it's an interesting challenge as I can see both sides here.

Everett Zufelt’s picture

There certainly aren't any best practices for this. Time and testing with real users of AT needs to happen in order for us to generate data from which we can inform decisions.

mgifford’s picture

Status: Active » Postponed

Need usability study for AT users.

jessebeach’s picture

I placed the toolbar in the bottom region in #1137920: Fix toolbar on small screen sizes and redesign toolbar for desktop before having read this issue. It seems we'll want to move it back to the top region? I don't see a consensus yet. Is this something we could test at BADCamp?

mgifford’s picture

Version: 8.x-dev » 9.x-dev

Bumping this to D9. Hopefully we'll have some documentation as to where is the best place to put this by default in the future.

LewisNyman’s picture

Version: 9.x-dev » 8.0.x-dev
Issue summary: View changes
Status: Postponed » Closed (works as designed)

The toolbar has been redesigned since this issue was created.