This plugin try to fix some accessibility issue in LimeSurvey core. Some fix can be included in LS core after testing.

Actual fix are

• Replace the label for single question choice by label to the question (to be included in LimeSurvey core).
• Optionnal: Use a real string for the asterisk in mandatory question type
• Optionnal: Add fieldset for list of answers and subquestion
• Use role=group and aria-labelledby for list of question is fieldset is not forced

Contribution, test and request are welcome.

Find the plugin in Framagit : git.framasoft.org/SondagePro-LimeSurvey-...in/moreAccessibility or at github or bitbucket.

Test functionality : accessible.sondages.pro/
Website use :
- skeletonquest template
- showpopups to false
- bFixNumAuto to 0 and bNumRealValue to 1

I will test it. I'm a accessibility specialist and we're starting to use Limesurvey more often. We made some improvements for our short term needs but i'm really interesseted to work with you to test this, and future versions, of this plugin.

Je vais le tester. Je suis spécialiste en accessibilité et je suis en train de faire des essais sur limesurvey. Nous avons fait plusieurs modifications côté frontend pour le court terme, mais je suis disponible pour tester et commenter tout autres ajout à votre plugin.

Hi cortxdp,

The last version is OK for:
- labelling
- add "manadatory string"
- Add fieldset (but broke color

I think i made a template too to fix this issue.

Another think : i think we need update the title of the page when we come back with 'error'. But i don't have access to title .... maybe except with a specific template.
Actually : i test with SkeletonQuest , and i think i start with this template for other adaptation.

Great to have an accessibility specialist. Please, please : report all accessibility bug

We had some retrofit to make after activating you plugin, but I tested it.

Fieldset are good for radio button and checkboxes. Have you made modifications for other question types regarding fieldset?
The replacement for the asterisk works, but I does not find a use for this option. It is ok to put an asterisk before or after a field as long as you explain at the begining of the form it is for what purposes. It is a good idea too to replace the text(*) for an image of an asterisk and add the alternative text "This question is mandatory.". But since the use of the astertisk is very common, there's no obligation to do so.
Labelling is good.

I have two propositions regarding labeling fields.

Mandatory text : It is a good idea to put the mandatory text in a <label for="id.."> too. This way, both the question text and the mandatory text are read by screen readers when you enter a field.
Help text : the help text should be read too when you enter the field. We could use a <label> but it is a good idea to use the ARIA attribute describedby
Then the field should have this attribute <input... aria-describedby="idforthequestionhelptext"> and the Help text must have an id.

Let me know if you have any comments or questions.
Thanks again.

DenisChenu wrote: Another think : i think we need update the title of the page when we come back with 'error'.

It's a great idea because the page title is read after the page validation and it could tell screen reader users that there was an error.

For error detection, in addition to the error message for each field, the best thing is to have the error list at the begining of the form. Each list element could be a link to the field.

Example :
<h2>Error list</h2>
<ul>
<li><a href="#[fieldid]">[fieldtext]:error message</a></li>
<li><a href="#[fieldid]">[fieldtext]:error message</a></li>
...
</ul>

Of course the error list is a too much when you have only one field in the page. Both cases must be treated.
This way, errors should be easily detected by the page title and the focus could be put directly on the error list after the validation.

A note on the asterisk, when the question type is a list (radio button, checkboxes..) the asterisk must be put inside the legend with the question text.

Hi,

For the fieldset : i think i add it when we need one.
WIth the template : i think it can be good to add fieldset start at start of a group, ending at end. But we are unsure we have group title and/or group description. And it's a template behaviour (i put it in next template).

For the 'asterisk" : think the best is to add the information at start of survey, but sometimes we have 2/3 mandatory answer in a big survey : here it's more the purpose.
I don't like to add a picture with title. Or maybe like "help" image in LimeSurvey core ? With the good title ?

You rigth about the aria-describedby , i can test if we have : a user test OR a automatic help by LimeSurvey and add it automatically. The hardest part can be in "multiple" question to find the input id. And after i must update (in PHP ...) the input id part .... : hard work here.

For error at top of the form : i know (i think i have a Feature Request for this). But i only have access to "question part", can only update this part actually. Not other part (not really).
It can be done with javascript .... but .....

Denis

DenisChenu wrote: Hi,

For the fieldset : i think i add it when we need one.
WIth the template : i think it can be good to add fieldset start at start of a group, ending at end. But we are unsure we have group title and/or group description. And it's a template behaviour (i put it in next template).

Denis

Fieldset are required for radio buttons, checkbox, etc.
Fieldset can be added for question grouping if it's relevant. For example, in a form with shipping and billing adresses where both have the sames fields (name, street adress, etc..). This way, the fieldset makes the contextualisation. As a note, filedset can be nested if needed. Another note : heading can ben use instead of fieldset for question grouping. It's easier to navigate.

DenisChenu wrote: For the 'asterisk" : think the best is to add the information at start of survey, but sometimes we have 2/3 mandatory answer in a big survey : here it's more the purpose.
I don't like to add a picture with title. Or maybe like "help" image in LimeSurvey core ? With the good title ?

Denis

I understand the need now. I tought you meant that the use of asterisk was not ok for accessibility. It's ok if you teel people what it means at the beginning of the form. Your option to show the text instead is ok too.

Hi,

Actually : i can only add fieldset 'automatically', then added to "ansers part of" :
- Multiple question : text/numeric multiple ("M","P","Q","K"): exemple Multi short question.
- Array of input text/number (";",":"): unsure we have to put it here. But more : each input have a 2 label, unsure the good way to labelling (event with aria)
- Single choice (radio) ("Y","G","5","L","O") : exemple : gender.
- The arrays (of radio) ("F","H","A","B","E","C","1") : the question array is a bad idea to be used for an accessible survey

Then if you need a name, street adress, etc : put it in a multi text question type .

For asterisk, what did you think if i use (inside label or legend if needed)
I use "mandatory question" because we have it in LS core translation. The more specific mandatory string is less important. User have to know only 'mandatory', unsure here ...

Denis

DenisChenu wrote: Hi,

For asterisk, what did you think if i use (inside label or legend if needed)

Code:

<img class="asterisk" title="This question is mandatory, please check one answer" alt="Mandatory Question" src="mandatory.png" >

I use "mandatory question" because we have it in LS core translation. The more specific mandatory string is less important. User have to know only 'mandatory', unsure here ...

Denis

The title attribut doesn't exist for the IMG tag. It exist for A tag but is not generally read by screen readers. A rule of thumb, don't use title attribute for any significant informations. Use ALT for IMG and an significant anchor texte for link. Thats all you need for 90% of cases.

I'm silly , know it .... title need an a or a button ....

Nice to see that you guys are working on improving accessibility. Would be great to have most of this at the core of LS 3.