Khan / engblog

KA Engineering blog.
http://engineering.khanacademy.org
Other
29 stars 20 forks source link

"Skip to content" #20

Open itsjohncs opened 9 years ago

itsjohncs commented 9 years ago

screen shot 2015-05-31 at 3 24 35 am

itsjohncs commented 9 years ago

GitHub has this on project pages at least and I think it would be very appropriate for the blog since all that nav stuff is first in the tab order.

itsjohncs commented 8 years ago

Some more clarity on this: When you visit a page on GitHub and hit tab, the first element to receive focus will be a (previously) invisible link that says "Skip to content". When you hit it inside of a screenreader, you bypass the top nav bar and immediately enter the content of the page.

So steps to reproduce the feature on GitHub with Mac's built-in screenreader enabled:

  1. Go to https://github.com/Khan/engblog
  2. Enter the page if you haven't already with Ctrl+Option+Down
  3. See that your cursor is over an internal link "Skip to content".
  4. Ctrl+Option+Space click it
  5. Move to the next element by hitting Ctrl+Option+Right Arrow
  6. See that the next element is not in the top nav bar.

I believe that doing this for the engineering blog will be particularly beneficial for screen readers because of how massive the nav bar is.

itsjohncs commented 8 years ago

Does this look interesting to you as a starter task @beneater?