Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Edits to improve site accessibility #2

Open
wants to merge 17 commits into
base: master
Choose a base branch
from

Conversation

christineiym
Copy link

Hi!

To improve site accessibility and flow, especially for sighted keyboard users and non-sighted users, I have introduced the following key changes (details specified in commit messages):

  • Remove the site avatar from the home link, so as to allow for alt text describing a student's features. Adding a space for a student to specify alt text and linking alt text recommendations in the comments. b5c160d
  • Add alt text to the icons in the footer, which currently simply are all read as 'link'. 68181c2
  • Add a more intuitive navbar and (in accordance with w3 recommendations) a skip to main content link. 218ecfa, a7e33a4 NOTE: With VoiceOver on Mac, it is known that the page may continue reading without skipping to content. But tabbing forward should work as expected, via a jQuery workaround. 89d7c82
  • Add a return to blog link at the bottom of each post (a previous/next post link would be more ideal, but is harder to implement automatically), to aid in keyboard navigation. 1e296b0
  • Make posts on the block page clickable tiles, with post title and description (not excerpt, but code can be modified to read an excerpt if still desired). This greatly reduces the amount of traversing through the DOM a non-sighted user may have to undergo, especially on the Mac (as opposed to JAWS). Having a description instead of an excerpt and "Read More" link also cuts the number of links in half for all keyboard users, since the title accomplishes the same purpose. 2483aac, 8f8c800
  • Enhance color contrast of borders. 174b40e

I have also made the following changes for instructional purposes:

  • Advance the year from 2020 to 2023, and edit the example post to include an example date. e73008e
  • Add a note for those deploying on a sub-page of their GitHub Pages website about the potential need to rename the master branch to gh-pages. f9b7388

An example raw repository generated from this template may be found here.

Testing was done on a MacBook Pro (Big Sur) with Chrome and VoiceOver, exploring all pages and experimenting with multiple posts.
Limited testing was also conducted with a OnePlus 6T, Android 11, using TalkBalk.

Please feel free to reach me here or via email!

Thanks!

@christineiym
Copy link
Author

Just following up on this :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant