Skip to:
Content

BuddyPress.org

Opened 2 years ago

Closed 2 years ago

Last modified 14 months ago

#7747 closed defect (bug) (fixed)

BP Nouveau: Member and Group Cover Image links are not accessible to assistive techonologies.

Reported by: mercime Owned by: mercime
Milestone: 3.0 Priority: low
Severity: normal Version:
Component: Templates Keywords: has-patch
Cc:

Description (last modified by mercime)

Every link must have an accessible name or discernable text for assistive technologies. "If a link contains no text, the function or purpose of the link will not be presented to the user. This can introduce confusion for keyboard and screen reader users."

Our cover image links have no link content:
Groups: <a id="header-cover-image" href="<?php echo esc_url( bp_get_group_permalink() ); ?>"></a>
Members: <a id="header-cover-image" href="<?php bp_displayed_user_link(); ?>"></a>

Possible fixes: add accessible text to the link or remove the link and replace with a div. Other possibilities welcome.

Ref: WCAG 2.0 > Principle 2: Operable - User interface components and navigation must be operable. > 2.4 Provide ways to help users navigate, find content, and determine where they are. > 2.4.4 Link Purpose (In Context) which is consistent in the new WCAG 2.1

Attachments (1)

7747.patch (2.5 KB) - added by mercime 2 years ago.

Download all attachments as: .zip

Change History (13)

#1 @mercime
2 years ago

  • Description modified (diff)

#2 @DJPaul
2 years ago

  • Milestone changed from Awaiting Review to 3.0

#3 @hnla
2 years ago

@mercime which link, where?

#4 @mercime
2 years ago

@hnla Per my post above, our cover image links have no link content::

Groups: <a id="header-cover-image" href="<?php echo esc_url( bp_get_group_permalink() ); ?>"></a>
Members: <a id="header-cover-image" href="<?php bp_displayed_user_link(); ?>"></a>

#5 @hnla
2 years ago

Yep I was just asking for a file reference really, wasn't clear where the link was and where it is wasn't an intuitive place to look :)

Really don't know why there needs to be an anchor/href there but the same exists for Legacy too.

I'll have a quick play around removing, try and see what if anything breaks, but this likely needs a deeper scan of the implementation of these cover images.

#6 @hnla
2 years ago

Well it doesn't seem as though the href is actually required for anything...obvious; I can remove and re-upload a new image ok so it feels as though we can probably change the element to a span or div as long as we retain the id token and delete the href attr.

I also note we link the group avatar on the group page not sure why we need to do this, a link for no apparent reason that simply loops back to the page already on!!!

#7 @DJPaul
2 years ago

Let's remove these links and replace with DIVs for Nouveau. Less certain about modifying Legacy at this point, but I don't mind too strongly.

Last edited 2 years ago by DJPaul (previous) (diff)

#8 @DJPaul
2 years ago

  • Priority changed from normal to low

@mercime
2 years ago

#9 @mercime
2 years ago

  • Keywords has-patch added

#10 @hnla
2 years ago

My tests replacing with a div for Nouveau seemed ok so lets commit your patch @mercime my only reservation being the Legacy changes, feel we should focus on Nouveau where we can change with impunity whereas are we sure we can change Legacy templates with certain safety e.g no one might have done 'something' based on the anchor??

#11 @DJPaul
2 years ago

I had exactly the same thought about whether we should change Legacy, but I didn’t say anything because I didn’t want to influence the discussion before Hugo commented.

I’m agreeing with hnla here

#12 @mercime
2 years ago

  • Owner set to mercime
  • Resolution set to fixed
  • Status changed from new to closed

In 11995:

BP Nouveau: Replace empty links for Group & Member Header Cover Images.

Props hnla, DJPaul.
Fixes #7747.

Note: See TracTickets for help on using tickets.