Problem/Motivation

Follow-up to #2937639: Umami Theme - a11y context is needed for read more links. See comments #9-10 and #22-23 there.

Each card display for nodes has 2 links to the standalone node page:

  1. The node title
  2. The "view bundle" link (recipe, or article)

These links are unnecessary duplication, and undesirable effort for keyboard user's tabbing.

Proposed resolution

From comment #10 at #2937639-10: Umami Theme - a11y context is needed for read more links:

Remove link around titles.
Keep the View bundle link

Remaining tasks

Patch for the node card templates (2 variant displays)

User interface changes

No visual design changes.
Eliminates some duplicate links, greatly reduces effort for keyboard users when tabbing.

Comments

andrewmacpherson created an issue. See original summary.

goska_m’s picture

Issue tags: -accessibility +Accessibility, +Microserve
goska_m’s picture

Issue tags: -Accessibility +accessibility

I'm going to be working on this issue today

goska_m’s picture

Status: Active » Needs review
StatusFileSize
new2.33 KB

Status: Needs review » Needs work
andrewmacpherson’s picture

This doesn't need to do so much. We addressed the WCAG link purpose for the "view bundle" in the previous issue.

Now that #2937639: Umami Theme - a11y context is needed for read more links is fixed, the remaining thing is to remove the links from the node title in these card templates.

shaal’s picture

Status: Needs work » Needs review
StatusFileSize
new1.42 KB

Having the title as a link is what most user would expect.
I created a patch that using tabindex="-1" on the Title, so keyboard navigation would skip this link.

(I think we should also link the image itself to the article/recipe, and skip it the same way as the above solution, but perhaps that should become a separate issue?)

andrewmacpherson’s picture

Status: Needs review » Needs work

This was supposed to be a simple follow-up for something that was already agreed by the OOTB maintainers, in #2937639-10: Umami Theme - a11y context is needed for read more links.

The problem with this tabindex approach is it creates inequality, by treating users differently. Putting users into separate silos isn't good for accessibility or inclusion.

  • Sighted pointer users can click on the link title.
  • Sighted keyboard users, without assistive technology, can't operate the title link They may not be aware of it at all..
  • Screen reader users will not encounter this link if tabbing through the page, but it will be reported in the "list of links" tool, and they may encounter it in normal reading mode, or using the "next link" command

.

Now imagine three such users are having a conference call, and the mouse user says "click the title"....

(I think we should also link the image itself to the article/recipe, and skip it the same way as the above solution, but perhaps that should become a separate issue?)

This was already removed in a previous issue.

tim.plunkett’s picture

Issue tags: -accessibility (duplicate tag), -Microserve +Accessibility

Fixing tags

shaal’s picture

Status: Needs work » Needs review
StatusFileSize
new1.28 KB
new1.23 KB

Finally... the simple solution @andrewmacpherson asked for.

pawandubey’s picture

Patch#10 reviewed, tested and working fine as per the attached screenshot where the link is removed from the title.
We can move this to RTBC

shaal’s picture

@pawandubey thank you for reviewing this.
If you tested it and it's good, can you please mark it as RTBC?

pawandubey’s picture

Status: Needs review » Reviewed & tested by the community

Status: Reviewed & tested by the community » Needs work

The last submitted patch, 10: umami-1-link-per-card-3034751-10.patch, failed testing. View results

shaal’s picture

Status: Needs work » Needs review

Triggering testbot again as it looks like it was having a rough time earlier...

shaal’s picture

Status: Needs review » Reviewed & tested by the community

Status: Reviewed & tested by the community » Needs work

The last submitted patch, 10: umami-1-link-per-card-3034751-10.patch, failed testing. View results

pawandubey’s picture

@shaal

I just verified and found the file is changed in the latest version. So, please re-roll the patch.

Mixologic’s picture

Status: Needs work » Reviewed & tested by the community

that last rtbc->needs work was a bug in drupalci. If the patch doesnt apply, rtbc retesting will catch it.

gábor hojtsy’s picture

Title: Remove link from node title in Card display mode » Remove link from node title in Card display mode to improve accessibility
gábor hojtsy’s picture

Status: Reviewed & tested by the community » Fixed

Committed 390ffde and pushed to 8.8.x and 8.7.x. Thanks!

  • Gábor Hojtsy committed 390ffde on 8.8.x
    Issue #3034751 by shaal, goska_m, pawandubey, andrewmacpherson: Remove...

  • Gábor Hojtsy committed ef3e3b7 on 8.7.x
    Issue #3034751 by shaal, goska_m, pawandubey, andrewmacpherson: Remove...

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.