4 minutes reading time (749 words)

Joomla 4 and Accessibility: give back the web to everyone

July-A11y

Since the beginning, in Joomla, we have worked to make the web accessible to everyone because as we claim in our Accessibility Statement: Inclusion is in our heart.

Pink Bees

And the golden bees were making white combs and sweet honey from my old failures. (Antonio Machado)

It's years now since we offered our shinny and fantastic first approach to A11y with Joomla 1.5 and the Beez Template:

500px Beez 01 ov

 

Beez was daring, strident and really pink, but it also covered all the basics for webmasters to offer an accessible and eye-catching site at the moment. It also raised awareness about the need to pay attention to web standards and different ways to browse the web. Remember it was the time when Flash was growing fast and killing the open web.

Time went by and Joomla 2.5 and 3 were released, and Beez also grew up and became more serious and in my opinion much more boring 😜 with Beez 2 and Beez 3 versions:

beez2

 

In any case, we kept on track with accessibility. In Joomla, our motto has always been to allow everyone to enjoy all the shiny information webmasters had to offer to their visitors.

A11y in Joomla 4

Accessibility standards have also evolved in all these years, and we have been working hard trying to keep the pace. Remember that in Joomla, we not only implement standards; we also try to be innovative and develop daring solutions to our nowadays problems.

And that leads us to Joomla 4 in which we noticed we could make it even better to help everyone being accessible.

One template, many hearts

All these years, we have been forcing our users to choose between different templates to have a more accessible experience, but we are a community, right? Why should anyone be forced to use a specific template because of different abilities? So the first thing we decided was to pack Joomla 4 with just one template for the backend and one template for the frontend.

Both templates will be WCAG 2.1 AA compliant, and this way all Joomla end users will enjoy the same experience no matter their different capabilities.

New Accessibility Options for backend users

Once you login to the backend of Joomla 4, you can easily find a link to the a11y options.

backend user a11y options

Once in this screen, you will be able to set the template monochrome, choose a high contrast version, highlight links or increase the font size with just clicking a switch:

backend user a11y options screen

Reach easily any section of the page

Browsing a website with a mouse is quite easy, right? But Have you tried reaching any section at the bottom of your page just with your keyboard? It can be really time-consuming, and in some cases, you may not find a way to get to the area you need without a mouse.

In Joomla 4, just after opening any page of your backend, if you click the *Tab* key, a "Skip to" area will popup, and you will be able to browse all the main areas of that page easily.

skip to

Additional Accessibility features

These features are nice but maybe for occasional users or people with more specific needs, might not be enough. In that case, Joomla 4 comes with a new System plugin called *Additional Accessibility Features* which provides some extra and convenient A11y functions.

additional features icon

You may enable this plugin for backend and frontend of your site, and it will show a floating button with nice options after you click on it.

With this plugin, your visitors will be able to:

  • change the text, size and spacing,
  • invert the colours of your page,
  • go monochromatic,
  • get all the links underlined,
  • make the cursor bigger,
  • get a reading guide to easily see what they are reading next,
  • or even get the browser to read aloud the webpage for them (speakers not included with Joomla 😜)

Markup and web standards on mind

Finally, a great part of the work in Joomla 4 has focused in helping the markup to be better and more understandable to all browser options in the market (not only visual web browsers) and simplifying things to make it easier to understand to everyone.

How to help Joomla 4 happen

Joomla is a volunteer-driven organization and we need your help to make the web open to everyone. If you want to contribute to improving accessibility in Joomla 4, we will really appreciate your help. Please contact us through the Joomla Accessibility Team area in the Volunteers Portal.

2
Getting templates ready for Joomla 4: Kawshar Ahme...
My experience with the Beta of Joomla! 4
 

Comments

Already Registered? Login Here
No comments made yet. Be the first to submit a comment

By accepting you will be accessing a service provided by a third-party external to https://magazine.joomla.org/