Make external links accessible - Githubissues

18F / ux-guide

Resources, norms, and practices for doing user experience research and design work at 18F.

https://ux-guide.18f.gov

Other

76 stars 29 forks source link

Make external links accessible #392

Closed geekygirlsarah closed 1 year ago

geekygirlsarah commented 1 year ago

Description of changes

This replaces text and emoji related to external links so they're more accessible to screen readers. See the original issue (#340) to see more details about the how and why.

The main change is in private-eye.js which does link rewriting. The rest of the changes are around removing the extraneous text on links to ensure they're rewritten correctly. The benefit is links can now just be added, no need to manually enter "18F/TTS/GSA access only" type text.

Before:

After:

Mac's Voice Over:

Known issues

This edits PrivateEye, an 18F library that inserts the lock icon and adds the external link indicator. I think the copy in here doesn't match that library, but still, probably means ultimately that library needs to be adjusted for accessibility.

Related issues

Resolves #340

Reviewers:

In addition to assigning reviewers in the GitHub interface, please also list who you would like a review from here and, if applicable, what kind of review you would like from them. For example, you might ask one person to review content while someone else reviews visual layout.

(Will add when it's ready)

[x] @katefisher808 to review links to see if they look right

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

github-actions[bot] commented 1 year ago

At least one link is invalid. Please check the output of the tests in the checks below. For more information, see the wiki page on automated tests.

katefisher808 commented 1 year ago

Reviewed from a design perspective! fantastic!