J4 Issue ?
avatar micker
micker
29 May 2018

Hello to by more accessible we need to add an important but light feature
A jump to content menu
in accessiblity we have 3 types

  • Keyboard navigation
  • Vocable navigation
  • Zooming navigation

For keyborad navigation we need an hidden menu at first in html structure, to jump easier in page with anchor link
1 it will be at first because user use tab at first and need to find it
2 need to jump on different part of content Main menu, content, search, footer, sitemap (for front)
3 need to jump to main menu, content, title, description, logout (for backend)
4 no need to display it

Way to do it, maybe a accessibility menu plugin
1 that can be actived or desactived
2 allow field for add custom id to become usable for each template
3 maybe we can use subform field to add all what we need

Regards

avatar micker micker - open - 29 May 2018
avatar joomla-cms-bot joomla-cms-bot - change - 29 May 2018
Labels Added: ?
avatar joomla-cms-bot joomla-cms-bot - labeled - 29 May 2018
avatar franz-wohlkoenig franz-wohlkoenig - change - 29 May 2018
Title
[4]Accessibility jump menu function (front and back)
[4.0] Accessibility jump menu function (front and back)
avatar joomla-cms-bot joomla-cms-bot - edited - 29 May 2018
avatar franz-wohlkoenig franz-wohlkoenig - change - 29 May 2018
Category Accessibility
avatar brianteeman brianteeman - change - 30 May 2018
Labels Added: J4 Issue
avatar brianteeman brianteeman - labeled - 30 May 2018
avatar micker
micker - comment - 4 Jun 2018

what do you think about best way plugin or module ?

avatar brianteeman
brianteeman - comment - 4 Jun 2018

neither it should be part of the template

avatar dgrammatiko
dgrammatiko - comment - 4 Jun 2018

what do you think about best way plugin or module

the module that outputs the code related to navigation already exists, it's in administrator/modules/mod_menu.
The only bad thing that we're currently doing, and that is probably because none of the new templates is actually new - just a rewrite of the existing J3 ones, is that we keep putting very opinionated markup in the index.php. This needs to stop IMHO, it just limits the possibilities...

avatar brianteeman
brianteeman - comment - 4 Jun 2018

that module should not be used for this.

avatar micker
micker - comment - 4 Jun 2018

if we put in template => all providers need to add it ..
if we use module => all user need to add it
if we use plugin => it can be activaed and all futur template can be compatible
i think plugin is more intersting for all personn
i will try to create a proof

avatar brianteeman
brianteeman - comment - 4 Jun 2018

This is for the admin template not a site template. for the two or three people who provide their own admin template then they should learn from the core and provide this in their own templates as well

avatar micker
micker - comment - 4 Jun 2018

we need to add this feature for back AND front it's a important feature for accessibility goal

avatar brianteeman
brianteeman - comment - 4 Jun 2018

it would be very different in the front - but i still believe it must be in the template and not a plugin or module

avatar franz-wohlkoenig franz-wohlkoenig - change - 4 Jun 2018
Status New Discussion
avatar dgrammatiko
dgrammatiko - comment - 4 Jun 2018

I disagree, this is navigation (although keyboard initiated) so it belongs to mod_menu. Templates are not garbage collectors as we treat them right now (not even having proper HTML5 tags as header, main, footer but a gazzilion of useless divs is not how you should code in 2018)...

avatar brianteeman
brianteeman - comment - 4 Jun 2018

"jump" or skip navigation links are nothing to do with the content of mod_menu

avatar micker
micker - comment - 4 Jun 2018

i understand that you say its in template but if we do it we can't say that joomla is waacg ... its a template feature ... and provider will forgot it
offering a global solution for all is better i think for joomla! projetc

avatar zwiastunsw
zwiastunsw - comment - 4 Jun 2018

My opinion from a11y perspective:
The "Skip links" are not a comprehensive solution to the problem.
You can create them on the site (Frontend) using the menu manager and menu module, so you do not need a special solution.
However, skip links in the Backend will not solve the accessibility problems with navigation on the PAGE experienced by users of assistive technologies and users who need to access using the keyboard, because they can not use the mouse or touch.

What do we need?

  1. In templates (site and admin): designation landmarks region (relevant areas of the page) using valid HTML5 tags (header, nav, main, aside, footer) or attributes of roles (role="search", role="section", role="region") and aria-label attributes or aria-labbelledby. Assistive technologies such as screen readers generate a special navigational tool on this basis.
  2. In the Backend toolkits (toolbar, quickicon, sidebar, filters, etc. but also detail and options sections) we need explicit titles or hidden labels so that you can refer to them by generating a tool to navigate the page.
  3. In the Backend a special menu for keyboard users (but also screen reader users) that will allow you to quickly navigate around areas of the page.
avatar brianteeman
brianteeman - comment - 4 Jun 2018

the admin already has landmarks!!!

avatar zwiastunsw
zwiastunsw - comment - 4 Jun 2018

@brianteeman : Really? Use a screen reader, such as NVDA, to see if and which regions your screen reader sees.
You will see 2 landmarks: banner and navigation (main menu). That's how you have it on every page. How should a blind administrator access the toolbar, workspace, filters, etc.?

avatar micker
micker - comment - 4 Jun 2018

@zwiastunsw i think if we don't offer a better solution nobody will use it ... too many action
1 create a menu
2 create link
3 assign menu to position (a position before all content)
4 hide position for basic user ....
if we want to be more democratic and push a better site with with accessibility we need to offer a simplier solution ... maybe my proposition isn't good but we need to find it ...
1 add landmark to cassopedia and atum
2 provide a solution for keyboard navigation (for end user and integrator)
3 create guideling for templator creator (landmark + hidden menu)
=>Fater this Joomla! can say that he is good ! (with other work, its only a piece of cake)

avatar brianteeman
brianteeman - comment - 4 Jun 2018

@zwiastunsw that is because we have been waiting for a year for the accessibility team to provide any input

avatar zwiastunsw
zwiastunsw - comment - 4 Jun 2018

@brianteeman: Please, relate to things!

avatar chmst
chmst - comment - 4 Jun 2018

Let us add landmarks to atum and cassiopeia.

3rd party Templates are not in our responsibilty so I agree with @micker
Create guidelines for Tempalte developers how to add landmarks
Provide a Plugin which checks landmarks and adds the appropriate Links

avatar brianteeman
brianteeman - comment - 4 Jun 2018

Navigation landmarks are part of the template. Assistive technology uses those landmarks to provide recognisable features to aid navigation around the page. If you have the landmarks in the template then there are no links for a plugin to add. If you don't have the landmarks in the template then no plugin can magically create them.

Landmarks are something completely different to "bypass blocks" often known as a skip to content link which is SC 2.4.1

There is no need for a hidden menu to jump to the landmarks. The assistive technology does that already.

For more information watch this 2 minute video
https://www.youtube.com/watch?v=IhWMou12_Vk

avatar zwiastunsw
zwiastunsw - comment - 4 Jun 2018

Brian is right to write.

  1. In the Cassiopeia template, landmarks are defined by HTML5 tags (header, nav, footer), but... there is no 'main' tag (simple PR needs to be done).
    In addition
  • in the template of the Search module there is no role="search" attribute (simple PR must be done)
  • we do not have a mechanism to describe a group of modules that perform the same role; perhaps a title/label for the module position (?). I do not have a well thought-out idea.
  1. There is no need to create a special solution for Skip links. Simply add the menu and the module to the sample data.
avatar brianteeman
brianteeman - comment - 4 Jun 2018

we do not have a mechanism to describe a group of modules that perform the same role; perhaps a title/label for the module position (?). I do not have a well thought-out idea.

In most cases this would be role=complimentary
Again this should be defined in the template markup

avatar micker
micker - comment - 4 Jun 2018

@zwiastunsw @brianteeman ok i am agree with menu solution
do you thing wee need to hide the menu with a left position like -90000px to hide it and display it on focus ? (many accessibility site done it)
Maybe we need to add multilangual function on sample ?

avatar brianteeman
brianteeman - comment - 4 Jun 2018

NO - sorry but you really are not making sense at all

avatar micker
micker - comment - 4 Jun 2018

not sure .. try this (big site with silver medal of accessibility in france)
https://www.accessibilite.sncf.com/
just use tab button in keyboard => you can see name of link, it seems the good behavior
wtab
tab

avatar brianteeman
brianteeman - comment - 4 Jun 2018

that exact same functionality is achieved without creating a menu and just using landmarks - exactly how the wcag recommends. What you are suggesting requires setting up #links throughout the page. When you use aria landmarks you dont need to do that at all.

avatar zwiastunsw
zwiastunsw - comment - 4 Jun 2018
  1. Landmarks do not provide keyboard users with the ability to navigate through the page. They still need skiplinks. Of course, when there are landmarks, it is easier to create skiplinks.
  2. A menu with skip links may be hidden, but it does not need to be. The technique of hiding skiplinks is well described.
avatar brianteeman
brianteeman - comment - 4 Jun 2018

You can easily convert landmarks to a skiplinks menu for sighted keyboard users with some simple js eg https://github.com/paypal/skipto

avatar micker
micker - comment - 4 Jun 2018

ok perfect

avatar zwiastunsw
zwiastunsw - comment - 4 Jun 2018

@brianteeman: thank you for this link, but...

If you are using Drupal or Wordpress, you are in great luck. We are providing plugins for both of these content management systems that you can download from the SkipTo Github Page.

I use Joomla, so I'm not lucky. :)

avatar brianteeman
brianteeman - comment - 4 Jun 2018

that was an example of what can be done. I integrated it in a site of mine in < 30 seconds

I am still not convinced its needed in the front end to satisfy a11y requirements which is to skip repeated content in which case you just need a skip to role=main

avatar zwiastunsw
zwiastunsw - comment - 4 Jun 2018

I think that the implementation of this script to Joomla could solve the problem of navigation on the Backend page. There's no need to invent a wheel.

avatar brianteeman
brianteeman - comment - 4 Jun 2018

yes - if the a11y team can just tell us what landmarks to set up and what to include then it can be added easily

avatar zwiastunsw
zwiastunsw - comment - 4 Jun 2018

I didn't know this script. Now it will be easier for me to prepare proposals for a solution for the Backend. Thank you!

avatar micker
micker - comment - 8 Jun 2018

it will be good to adapt this script in a plugin how administrator can set using in back or front or both

avatar franz-wohlkoenig franz-wohlkoenig - change - 22 Aug 2018
Title
[4.0] Accessibility jump menu function (front and back)
[4.0] [a11y] Accessibility jump menu function (front and back)
avatar joomla-cms-bot joomla-cms-bot - edited - 22 Aug 2018
avatar brianteeman
brianteeman - comment - 12 Sep 2018

See #22149

avatar franz-wohlkoenig
franz-wohlkoenig - comment - 13 Sep 2018

@micker can you please close the Issue if #22149 resolve it?

Have now seen PR #22155

avatar franz-wohlkoenig franz-wohlkoenig - change - 13 Sep 2018
Status Discussion Information Required
avatar franz-wohlkoenig franz-wohlkoenig - change - 13 Sep 2018
Status Information Required Closed
Closed_Date 0000-00-00 00:00:00 2018-09-13 05:12:00
Closed_By franz-wohlkoenig
avatar joomla-cms-bot joomla-cms-bot - change - 13 Sep 2018
Closed_Date 2018-09-13 05:12:00 2018-09-13 05:12:01
Closed_By franz-wohlkoenig joomla-cms-bot
avatar joomla-cms-bot joomla-cms-bot - close - 13 Sep 2018
avatar joomla-cms-bot
joomla-cms-bot - comment - 13 Sep 2018

Add a Comment

Login with GitHub to post a comment