How the Web Looks to Me

It feels like I've tried to field the question about how I can use the web without using a mouse (or trackpad or equivalent), without "pointing", multiple times in the last couple of weeks. The answer is quite visual so I thought I'd share. This is how the web looks to me:

I navigate the web using the Keyboard Navigation extension in Google Chrome, which is what is adding all the little labels you see in the screenshot above. Install the extension, and press comma. The labels will pop up, then you type whichever character(s) show next to the thing you want to "click" on, and off you go.

It's super-simple, and easier to use than I expected. Why don't you try it out on your own sites? You'll get a sense of how the web looks from where I'm standing :)

5 thoughts on “How the Web Looks to Me

  1. Wow that is pretty different, much easier than tabbing through a bunch of elements as well. Thanks for sharing should save my fingers some mileage. Like you said i'll have to try it out on the things I'm building.

  2. Interesting. I've never seen or heard of this before. I've got a few questions...
    What were your motives in switching to this method, is it faster than the traditional point and click mouse/trackpad?
    Does it work on a tablets?
    How long did it take for this method of interaction to became natural?

    • I didn't actually say so in the post but I have some issues with repetitive strain injury that mean I need to be able to use my computer solely from the keyboard. I've recently switched to Chrome with keyboard shortcuts from Opera and its excellent keyboard spatial navigation. I have nothing to compare it to for "faster" but it took probably 2 or 3 days to get comfortable.

  3. Pingback: Unpacking and Editing a Chrome Extension | LornaJane

Leave a Reply

Please use [code] and [/code] around any source code you wish to share.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>