Accessibility in your theme / template - How to

trogladyte wrote: If you're a Joomla user, there's a great little plugin which adds a screen reader (I hope you don't mind me posting this here Ced. Please remove this if you're not happy with it). storejextensions.org/extensions/screen_reader.html

Had to update this. I'm revisiting this whole topic with all my sites and yesterday read some very disturbing news about these various compliance plugins - accessdefense.com/?p=5378 . Bottom line is, if you're using one of these "it's better than nothing" is 100% incorrect. It could well be WORSE than nothing. It's like hanging out a sign saying "My site is guaranteed to NOT be compliant"!!

Note: I'm not attempting AAA compliance - just way too much of a pipe dream. However, I am aiming at AA compliance. This post assumes that.

The area I'm at right now in writing a set of (my) company guidelines on how to deal with being compliant is 2. OPERABILITY. This covers how a person operated the site - think navigation specifically. One of the big things here is using the site WITHOUT a mouse. The most obvious area that this occurs in is the menu. I checked a random site of ours and it seems that this is addressed with a mid-blue border around the selected item when tabbing. Is this able to be altered (in color) in TemplateCreatorCK? I don't see where this styling is applied. This needs to be user-defined so it doesn't get lost if the background is a similar color.

Better than tabbing - at least for menus, would be the ability to assign hot keys to menu items. I understand this is not a TC thing, but would need to be dealt with in a menu system. Is this available in MaxiMenu? Interesting how Microsoft has gone away from this in their products - wonder if anyone's thought of suing them!!!

HI
" I don't see where this styling is applied"
>> this is the :focus pseudo class, you can style it using custom css for now, there not yet the styles for that

" assign hot keys to menu items"
>> you can do that with Maximenu CK
www.joomlack.fr/en/documentation/maximen...enu-with-maximenu-ck

Let me know if you have other thoughts, accessibility is a great topic. I have already started something here
forum.joomlack.fr/index.php/4-maximenu-c...essibility-workgroup
but due to the lack of people able to test and verify and give some solution, I'm a bit stopped on this
I'm not an accessibility expert, so it is difficult for me to know what is really needed, how and why

CEd

I somehow figured MaxiMenu would do it. Guess I might have to start using it on every site!

I'll have a play with styling the hover class (was reading all about it over the weekend while researching accessibility).

Accessibility is a BIG deal, especially over here where the Americans with Disabilities Act has become a rabid, money-making dog. There are "professionals" who do nothing but look for businesses to sue over this. So for we Yanks, getting this right ASAP (well for those of us who know or care) is of paramount importance. For what it's worth, I have attached the Word doc I wrote for our own guidelines. I think it encapsulates WCAG 2 pretty well, at least to Level AA (Level AAA is REALLY hard to attain and even more difficult to keep).

For you, as a software developer, much of the doc won't apply directly (such as alt text for images), though it may apply indirectly where you need to provide the mechanism for accomplishing said task (like alt text for images - you need to provide a field for we designers to complete).

Here are a couple of useful links that helped me formulate the doc, both from w3.org:

www.w3.org/WAI/WCAG21/quickref/

www.w3.org/WAI/standards-guidelines/wcag/

Happy to correspond more on the subject with you - off-forum or on, whichever you prefer. I thought it was going to be a dull, tedious thing, but, after working a lot of Saturday on it, I felt really empowered. Hopefully you may feel the same!!

ced1870 wrote: HI
" I don't see where this styling is applied"
>> this is the :focus pseudo class, you can style it using custom css for now, there not yet the styles for that

Given that my CSS skills are more beginner level, I went and researched how to do this, but nothing I tried changed from that blue color. I tried:

:focus {
color: #000000!important;
}

and

input:focus {
color: #000000!important;
}

trogladyle wrote:

:focus {
color: #000000!important;
}

and

input:focus {
color: #000000!important;
}

Maybe you have not considered that you are dealing with link.
For example, in my custom.css file of TCCK I inserted: I don't know if it can help. I hope so.

Another important point (in my opinion) is related to the effort to provide a consistent developing environment for accessible websites.
I believe there is a need for integration between developers to avoid overlapping solutions and to provide consistent solutions.
For example, the Pro version of JCE offers powerful and easy tools to achieve great results. Nevertheless, sometimes it is difficult to decide whether these results should be achieved with JCE, Regular Labs extensions, JoomlaCK extensions or Template Creator.
Aiming at the accessibility of websites, an integration between Template Creator CK, Regular Labs and JCE could achieve great results without too much effort.
Saying it is easy, doing it is difficult, I know.
But would you consider collaborating with other developers?

Saying it is easy, doing it is difficult, I know.
But would you consider collaborating with other developers?

that is right. To be honest, I have already contacted some developpers for few small things, this is very difficult to get a real participation
I'm opened to collaboration, if something could be done. But for sure I will not spend my time trying to contact and convince the others

CEd