I can see where to add an aria label on a standalone button, but not on the clickable elements (title, image and button) in a feature box.
Similarly, image overlay is clickable but there is nowhere to put an aria label.
Have I missed it or is it really not there?
If not available, what plans are there to add this?
Hi there!
Thanks for sharing your observations.
Yes, they are not present in a feature box. I will convey your suggestion to the team.
Best Regards
Thanks for the fast response.
I think you are implying that there are currently no plans to add aria labels to feature boxes etc, but would you mind checking this and then confirming?
Edit: Maybe there is a way I can do this manually?
Hi Charles,
This can be useful: https://www.joomshaper.com/documentation/sp-page-builder/how-to-override-sp-builder-addons
I only wonder what for you need aria-label for image, if image already has ALT field that is read by all readers for the visually impaired. I think TITLE would be more useful, for both SEO & Accessibility. And according to guides
The button also has text inside, this is not image or svg, but text button. Yet here we plan to add A-L.
"The aria-label attribute in HTML is used to provide an accessible name or label for an element that does not have an inherent label or that needs a more descriptive label than its content provides." - source: w3docs.com
So using aria-label for text Title - is art for art's sake, at least in my opinion.
Please tell me what for purposes you need so many aria-labels, what kind of website is it? It will be easier for us to discuss.
I have a site with lots of buttons and links on it!
Seriously, I use SPPB to create long form information pages and I use images and feature boxes quite extensively to break up the text.
Often I might have two rows of feature boxes (3 x 2 say) and they all highlight a different feature and link to a different part of the site.
I could put really long descriptiive text on the buttons, but that would not look good. What I want to do is to put short "find out more" text on the buttons and have aria labels behind them.
Since the images can be a hotlink to a new page or site, I wanted to be able to put the aria labels on these too.
All I am trying to do is to score well on Google Lighthouse
just to add:-
https://www.hubspot.com/ has something very similar to feature boxes on its home page - look at all the buttons that say "Learn more".
The overall effect is cohesive, clean look but it is also SEO-friendly because they use Aria Labels
Good news, In upcoming SPPB Update (next days) we already added aria-label for Button in Feature addon. I hope by now it should help.
About example from hubspot.com - indeed smart idea. I wish you had mentioned this earlier. We will try to combine/implement it in Feature addon in April or May Update.
Added to wish-list already :)
About Images - however, I insist on using extra TITLE field, which is better for SEO than only Aria-label. However, we will see what the development team judges. Maybe both ;)
Thanks for the update. I really appreciate your responsiveness!
This is me thanking you, for your suggestions.
