I’m trying to have an accessible website and in order to I’m using the Wave browser plug-in to check errors and alerts.

It detects errors on form labels (multiple and empty one):

<div class="cmplz-categories-wrap" style="display: none;">
  <label>
    <input type="checkbox" id="cmplz_functional" class="cmplz-consent-checkbox cmplz-svg-checkbox cmplz-square-checkbox cmplz_functional" checked="" disabled="" data-category="cmplz_functional">
    <label for="cmplz_functional" class="cc-check">
      <svg width="16px" height="16px" viewBox="0 0 18 18"><path d="M1,9 L1,3.5 C1,2 2,1 3.5,1 L14.5,1 C16,1 17,2 17,3.5 L17,14.5 C17,16 16,17 14.5,17 L3.5,17 C2,17 1,16 1,14.5 L1,9 Z"><polyline points="1 9 7 14 15 4"></svg>
    </label>
    <span class="cc-category">
      Fonctional
    </span>
  </label>
</div>

Same for other checkbox (marketing, etc.), it might not be voluntary on your part but I just wanted to bring your attention to this.

Thanks for the time you’ll take to maybe look into it.

I opened a topic a month ago about some accessibility errors (empty button): https://www.ads-software.com/support/topic/accessibility-errors-6/

You told be it will be shared with developers and that you’ll come back to me. Really appreciated it. But then three weeks after you closed the subject and marked it as resolved saying you didn’t hear from me… when actually I’m the one waiting to hear from you haha

Also told me to reopen a topic if I was still having problem with Wordfence so I do because errors are still there, problem is not resolved.

Thanks again for your work and time.
Cheers

First thank you for your work! Just starting to try out your plugin, seems to do its job for now.

I’m trying to have an accessible website and in order to I’m using the Wave browser plugin to check errors and alerts.

It detects Empty button (no text or value attribute) in this part of the code (3 button tag):

<div id="wfboxOverlay" style="display: none;">
ARIA tabindexARIA<div id="wordfenceBox" class="" role="dialog" tabindex="-1" style="display: none;"><div id="wfboxWrapper"><div><div id="wfboxTopLeft" style="float: left;"><div id="wfboxTopCenter" style="float: left;"><div id="wfboxTopRight" style="float: left;"></div><div style="clear: left;"><div id="wfboxMiddleLeft" style="float: left;"><div id="wfboxContent" style="float: left;"><div id="wfboxTitle" style="float: left;"><div id="wfboxCurrent" style="float: left;">
<button type="button" id="wfboxPrevious">
<button type="button" id="wfboxNext">
<button type="button" id="wfboxSlideshow">
<div id="wfboxLoadingOverlay" style="float: left;"><div id="wfboxLoadingGraphic" style="float: left;"></div><div id="wfboxMiddleRight" style="float: left;"></div><div style="clear: left;"><div id="wfboxBottomLeft" style="float: left;"><div id="wfboxBottomCenter" style="float: left;"><div id="wfboxBottomRight" style="float: left;"></div></div><div style="position: absolute; width: 9999px; visibility: hidden; display: none; max-width: none;"></div>

Thanks in advance for your time

I’m using the Wave tool to check alerts and error on accessibility (https://wave.webaim.org/) and I have a number of those on the application form, e.g.:
– no alt text on the cross close image, the + (to add a file) and the loader
– the contrast between the red asterisk and the white background doesn’t seem to fit in the standard: https://webaim.org/standards/wcag/checklist#sc1.4.3
– the form control for CV upload might have multiple label associated with it
– multiple label on checkbox as well

Some might be on my side or I could overwrite them (e.g. asterisk color), but some might be on yours. It will be awesome to have no error at all and so a good accessibility.

Thanks for your work!

Parts of my site are not WAI compliant in terms of foreground/background contrast colours. Is there a way to change font colours without diving into the css of the template? I tried a couple of plug-ins that changed some colours but not all.

Also, can the gradient colours of the template background be changed again without having to edit the css file?

Can I add css in the customise/additional css section that colours text via h size, eg h4 = #eeeeee
Thank you,

Nigel.

You are using heading tags for cosmetic styling, which means the maintenance page will break WCAG2 and WAI (accessibility) guidelines.

Can you please adjust the HTML markup used to display the maintenance message and headline so it is accurate in reflecting what is a real structural heading and what is body content.

If you apply a class to each and/or give us a font size selector in admin we can then make the text as big as needed.

Thanks

https://www.ads-software.com/plugins/maintenance/

I’m using Contact Form 7, but I noticed while testing WAI accesibility with www.tawdis.net/ingles.html?lang=en that some problems arise with the stylesheet used in CF7.

The worst thing is an automatic error caused by the use of absolute font sizes (10pt is used several times), those really need fixes (I did in my domain but the changes will be lost on each plugin update), however there are more things to consider to be WCAG compliant.

Bye

I’ve been working on some accessible designs for a government client, and I’ve noticed that the WordPress admin pages, the www.ads-software.com theme, and many wordpress themes do not have sufficient color contrast to meet WAI guidelines.

Probably not a big deal with individual themes, but the admin theme is an issue for all. I can’t seem to find a WordPress.com theme that passes muster. (Not that that matters here.)

If you want to see what I’m talking about, check it out with the Juicy Studio Accessibility toolbar:

https://addons.mozilla.org/en-US/firefox/addon/9108

Does anyone have experience with the level of Accessibility of code generated by wordpress?
We need to create a level AA accessible site and we would like to have some feedback from wordpress users.

Thank you all!

farfalleta

I am in a bit of a catch 22 situation here…

I’m working on my accessibility for www.minute44.com and have come across a problem.

In order to pass WAI-AA standard I cannot have more than one unique link using the same link text. Fine, you might say but I come across the problem because I use the <!–more–> feature. This makes all the <!–more–> links on a particular page comprise of the same link text, in this case, “more…”

What I want to know is: Is there a way of making the <!–more–> link text call the ID of the post it’s in? So for example, can i make the <!–more–> link for post ID 35 say “Read more of this post (35)” thus making it unique?

It seems a shame if not because WordPress seems to fly the flag for nice use of web standards and such…

Thanks in advance.

Dan