You need to be logged in to post in the forum - Log In

An active JCE Pro Subscription is required to post in the forum - Buy a Subscription

Support is currently Offline

Official support hours:
Monday To Friday
From 09:00 To 17:00 Europe/London (BST)

Please post your question in the Forum and we will get back to you as soon as we can.

  Friday, 17 December 2021
  4 Replies
  816 Visits
Hi there! Happy Holidays!

Question for ya. I'm trying to find an accessible solution for clients that want to use "read more" as a hyperlink but that will give screen readers more context.

I found that aria-labelledby will work for this but aside from toggling HTML and adding it manually to the code, I can't find a way this could work out of the box.

I'm wondering if the Title field which gives us title="this is the title" could be changed to aria-labelledby="Read more about whatever the page is about" so basically replacing title with aria-labelledby. Is there any way to do this without hacking up the extension. I do not want to hack up the extension. I want to make it easier for normal users to be able to add the aria-labelledby without going into the HTML of the article/module/etc.

Did that make sense?
2 weeks ago
·
#109969
Accepted Answer
I have added the option to set custom attributes in the Advanced tab of the Link dialog, so you can now set any aria attributes you want for a link, for example:

https://cdn.joomlacontenteditor.net/tmp/109808-change-title-tag-to-aria-labelledby.jpg

You can test this in JCE Pro 2.9.19 Beta - https://www.joomlacontenteditor.net/downloads/editor/pro/development

Just because you're not paranoid doesn't mean everybody isn't out to get you.

more than a month ago
·
#109812
aria-labelledby would be the wrong attribute to use as this is usually added to indicate how this element is labeled by some other element - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-labelledby_attribute

The appropriate aria-* attribute would be aria-label - https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute

If the title attribute is present and the text is the same as the aria-label, then there is no need to include aria-label, as a screen reader will just read the title attribute.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

more than a month ago
·
#109814
Thanks, Ryan.

My understanding is that the title attribute is not read out via a screen reader. https://www.tpgi.com/using-the-html-title-attribute/.

The aria-label would be different from the text. The text would probably say "Read more." The aria-label would say aria-label="read more about the problems happening with the stupid supply chain."

Does that make better sense?

I'm trying to avoid forcing the client to toggle the editor to add aria-label directly and would rather have them use a field if possible. That's the goal.
2 weeks ago
·
#109969
Accepted Answer
I have added the option to set custom attributes in the Advanced tab of the Link dialog, so you can now set any aria attributes you want for a link, for example:

https://cdn.joomlacontenteditor.net/tmp/109808-change-title-tag-to-aria-labelledby.jpg

You can test this in JCE Pro 2.9.19 Beta - https://www.joomlacontenteditor.net/downloads/editor/pro/development

Just because you're not paranoid doesn't mean everybody isn't out to get you.

one week ago
·
#109974
Wow, Ryan, thank you! I've tested and this works great! You are wonderful and brilliant. Thank you!!!
gressj selected the reply #109969 as the answer for this post — 1 week ago
  • Page :
  • 1
There are no replies made for this post yet.
Be one of the first to reply to this post!