Settings

Theme

A small change to improve browsers for keyboard navigation

b.43z.one

207 points by h43z 4 months ago · 71 comments

Reader

ashwinsundar 4 months ago

I installed Vimium a few months ago and haven't looked back -> https://vimium.github.io/

Mouseless as well for navigating anywhere on the computer without a mouse -> https://mouseless.click/

  • ashton314 4 months ago

    For macOS users, I highly recommend ShortCat: https://shortcat.app/

    ShortCat uses the accessibility API to put Vimium-style keyboard links on buttons and text fields in any app.

    I find that Vimium works faster in Firefox than using ShortCat to click around websites, so I use both, but ShortCat technically should do everything (clicking-wise) that Vimium does.

    • sooheon 4 months ago

      Shortcat has a ~second delay before showing links, homerow (https://www.homerow.app) is faster.

      • ehnto 4 months ago

        I wonder if it has to do with accessibility API thread locking. I found a different extension I used to emulate an i3 style environment suffered when I used the Unity game engine. It ended up being limitations of the accessibility API.

        • sooheon 4 months ago

          Could be, but there is another app that does the same thing faster so there must be some optimizations available.

      • ashton314 4 months ago

        This delay is configurable. The delay is there so you can actually type a bit before the UI pops up, and then the UI will be filtered to just your selection.

        • sooheon 4 months ago

          The configuration lies. Even with "Show hints" set to "Immediately", there is a long delay. Feels like half a second on M1 Pro.

          • ashton314 4 months ago

            Fair, fair—it's default is longer, so dialing it down made it feel zippy by comparison.

            I'm trying out Homerow and I'm really liking it! Thanks for mentioning it. I might end up sticking with it actually.

    • lelandfe 4 months ago

      I wish this was paid or open source…

      • ashton314 4 months ago

        As I understand it, a payment system is in the works. I would gladly fork over some cash to support ShortCat. Looks like someone recommended Homerow, which appears to be pretty comparable to ShortCat, and it has a one-time purchase option.

    • CharlesW 4 months ago

      ShortCat is an incredible recommendation, thank you!

    • idk-92 4 months ago

      omg this is amazing. shortcat that is

  • daef 4 months ago

    i <3 tridactyl [0] - are there upsides to vimium i'm missing?

    [0] https://tridactyl.xyz/about/

    edit: added url

    • umbra07 4 months ago

      Vimium has better smooth scrolling. I really, really want to use Tridactyl, but I just can't stomach their smooth-scrolling implementation.

      • GlitchRider47 4 months ago

        Ha! I actually switched from Vimium to Tridactyl partly because I prefer the rough, snappy scrolling. It felt much more like the ctrl+d ctrl+u navigation in VIM.

        • Izkata 4 months ago

          I never started with Vimium (was using an even less known one), also in part because I find smooth scrolling disorienting. Also on Tridactyl now, once someone on here showed me the hintfiltermode, hintchars, and hintnames settings to get the old Vimperator behavior (which I also find so much better than any current defaults):

            set hintfiltermode vimperator-reflow
            set hintchars 1234567890
            set hintnames numeric
          
          Lets you type the words in links, and the hints filter down to only matches. If you go all the way to 1 match it automatically picks it, but as the hints filter down the numeric labels also reset - so there are no gaps betweeen the numbers and it's almost always between 1 and 5 to get the link I want.
    • theappsecguy 4 months ago

      Tridactyl is only available for Firefox unfortunately

    • ashwinsundar 4 months ago

      Probably not, use whatever makes you happy!

  • iLemming 4 months ago

    I no longer use vimium, I use vimium-c, but these should work in both, add these to your custom mappings - you'd thank me later:

        map gf LinkHints.activateOpenInNewTab count=999999
        map go LinkHints.click direct="focused" mode="newtab-active"
        map gb LinkHints.click direct="focused" mode="newtab"
    
        map gm toggleMuteTab
        
    I would typically do something like this - I'd press "/", search for an occurence, it navigates to one, if it's a link, pressing "go" - opens it in a new tab, "gb" - opens it without switching to it. I promise you, you'd love this.

    Share your interesting options.

  • pmdr 4 months ago

    Vimium, (neo)vim and vim key bindings have been life-changing.

  • magios 4 months ago

    i use i3wm so there are various keybindings you can use. for mouseless stuff i use xdotool to move the pointer in 16 or 64 pixel increments using the keyboard. if i could toggle the mouse pointer on and off i would.

jwr 4 months ago

Incidentally, I've been trying to use the keyboard to scroll webpages recently, and it's a disaster. Nobody does it, apparently.

PageUp/PageDown do not work correctly on sites that have a permanent topbar (some of the content is never shown). Cursor up/down often does something unexpected (for example in Mastodon, if you use PageDown several times and then cursor down, you will get yanked back).

I think it is a sad regression. Not everybody is able to use the mouse and its scrollwheel!

  • chrismorgan 4 months ago

    I use Space/Shift+Space and PageUp/PageDown and End¹ for vertical scrolling all the time. It’s nowhere near a disaster. I also disable JS by default, which… well, actually that might help sometimes. And hinder other times.

    Rarely, I find a page that doesn’t use the document scroll area, but makes its own which is not focused, and so you have to focus that (by Tab as many times as necessary, or by clicking) before you can scroll by keyboard. But that’s rare.

    Long ago, Firefox started compensating for sticky headers, reducing the amount it would scroll the page by, and it mostly works well, though it’s not flawless. I don’t think I’ve observed the same feature in other browsers. One amusing situation that can arise is when the header disappears when you go down and reappears when you go up, so that repeating PageUp and PageDown yields net movement in one direction.

    —⁂—

    ¹ End, but not Home, which is Fn+Left on my laptop, but the Left key hasn’t worked for over a year now. I’ve contemplated replacing the battery and keyboard, but the laptop’s falling apart in enough other ways it doesn’t quite feel worth the investment…

    • treetalker 4 months ago

      Just dropping a note to say I appreciate your asterism! :-)

      • chrismorgan 4 months ago

        A few years ago I thought long and hard, tried quite a few different things, and ended up settling on that sequence. And with this in my ~/.XCompose:

          <Multi_key> <h> <r> : "—⁂—"
        
        … I can get it by typing `Compose h r`. (“hr” as in <hr>, HTML’s Horizontal Rule.)

        At one point since then I came across another person on HN that had independently settled on the same three characters (em dash, asterism, em dash).

        In my personal dialect of the lightweight markup language I’ve been making, —⁂— is even the syntax for a horizontal rule. :-)

      • encom 4 months ago

        ▲ ▲

  • cool-RR 4 months ago

    I wrote this Chrome extension to solve this problem for myself 2 years ago: https://chromewebstore.google.com/detail/focustoscroll/jbcpo...

    Apparently no one else was interested in it. I still use it daily.

  • cluckindan 4 months ago

    In the EU and the US, this kind of broken accessibility is not legal and the service providers can be sued.

    Only applies to public and commercial services, though.

  • makeitdouble 4 months ago

    Mapping mouse events to key shortcuts might be the only way forward that could realistically work. Something like moving the mouse where the cursor/selection is, and sending scrolling events from there.

    The lenovo keyboard with its trackpoint and mouse buttons is a kind of solution to this, but IME scrolling is still a PITA as it needs two inputs (switching to scroll mode while moving the trackpoint)

  • maest 4 months ago

    Before adding the AI summary, google required:

        Tab+tab+enter
    
    to highlight the first link result.

    Now, with the summary, it's:

        Tab+tab+enter+tab+tab
    
    Just wild lol
  • mathiaspoint 4 months ago

    Sometimes page up/down seek the video on YouTube. That's terrible.

vunderba 4 months ago

On a related note, highly recommend the Firefox Vimium extension if you're a "keyboard warrior".

https://addons.mozilla.org/en-US/firefox/addon/vimium-ff

  • h43zOP 4 months ago

    I used to use vimium (and tried similar extensions) but it always scared me how big the codebase was for most of the popular extensions. In the end I came up with a tiny extension for just the things I need https://github.com/h43z/jkscroll

  • camdroidw 4 months ago

    Keyboard warrior is people who are on the 10% far end of political spectrums. I'd like a better term for such people but power users is too broad.

CodeMage 4 months ago

When you press Enter in the search box, Firefox finds the next occurrence of your search pattern. An easy fix that doesn't require an extension is to press Esc first, which closes the search box, and then you can press Enter.

  • h43zOP 4 months ago

    This works on links and buttons in chrome. In firefox just on links. In both it doesn't work for other html elements.

    • chrismorgan 4 months ago

      I was going to disagree with you, but… huh. It doesn’t work on buttons. Thought it did. Selection is set, but focus isn’t. Further workaround: Shift+Tab.

      This feels like it may be a bug, but at the very least it’s not a recent regression—I tested Firefox 44 and it shows the same behaviour. (44.0 is the oldest version I can run now, apparently. I tried 4.0 first, the first version with linux-x86_64 builds, which I have run successfully in the past, I think even in the last year, but now all versions before 44.0 are crashing on startup.)

remark5396 4 months ago

It may be well-known, but I’m quite happy with Vimium C for keyboard-based browsing. It provides a sufficiently good set of Vim keybindings* and highlights all clickable elements when you press 'f', not just <a href> ones.

Firefox: https://addons.mozilla.org/ko/firefox/addon/vimium-c/

Chrome: https://chromewebstore.google.com/detail/vimium-c-all-by-key...

* not exactly the same with Vim

blacklight 4 months ago

Or just use the Surfingkeys extension - it has a bit of a steep learning curve to customize it, but it's worth every piece of effort.

high_priest 4 months ago

Recently, I had written a post mentioning basics of my fully keyboard oriented workflow on Windows.

https://amun.pl/blog/post/working-on-windows-with-keyboard-o... (Sorry for missing images, I accidentally deleted them when messing with containers backups)

I mention the BrowseCut chromium plugin over there, which made navigating all kinds of pages, a total breeze.

Expecting questions if the BrowseCut extension works with Duolingo. It does not. Although, I have not had issues on any other pages.

lolive 4 months ago

For people using keyboard a lot, and who HATE to have focus going out of the HTML rendering panel, you can simply Ctrl-F Esc and you are back on focus. Best hint I read on the Internet since 1967 !

Leo-thorne 4 months ago

I’ve always found Firefox’s / quick find feature incredibly useful. But having to click on a link after selecting it always felt awkward and interrupted my flow. This little tweak is brilliant because it removes that extra step with just a few lines of code. If browsers allowed links to activate automatically once selected, navigating with a keyboard would feel so much smoother. I sincerely hope that becomes a standard feature one day.

dannyfritz07 4 months ago

I'm using Firefox and the links were activated when I hit enter in the quick-find prompt. Not sure why the behavior is different than what the author is seeing.

  • h43zOP 4 months ago

    The links yes, but what about buttons or other html elements?

    • hirako2000 4 months ago

      Buttons work too.

      The issue is with any JavaScript driven on click events tags. Some sites even have their <a> tags not responding to keyboards events, because they have a hash href, and a JavaScript handler to redirect.

      The web is beautiful place.

      • h43zOP 4 months ago

        I don't see it working on firefox for buttons but on chrome. Both don't work on other html elements (div,span,..).

OGEnthusiast 4 months ago

FWIW, using Chromium on Linux, I was able to use Ctrl+F + Escape + Enter to find and click on all of them except for the "span with an onclick handler".

  • h43zOP 4 months ago

    The span one is the important one though as most of the modern web does not use <button> anymore.

HankStallone 4 months ago

I use Qutebrowser, a keyboard-driven browser built on the Chromium engine. The controls are mostly vi-like (search with /), but easy to configure.

jiehong 4 months ago

Good idea!

I think browsers should also come with headingMaps [0] and landmarks by default for all websites. With a keyboard shortcut to access them, navigation would be great (assuming websites have a semantic DOM).

[0]: https://addons.mozilla.org/en-GB/firefox/addon/headingsmap

myfonj 4 months ago

Just chiming in with recommendation of yet another hints extension, this one is called »Yet Another Hints Extension (YAHE)« and is really minimal and nice. Signed, happy long-time user.

(YAHE) https://gitlab.com/jpallari/yahe

(BTW, does anyone here remember extension called »Hit-A-Hint«?)

globular-toast 4 months ago

What about the fact that almost all websites that I want to search in hijack the quick search key now? https://blog.gpkb.org/posts/lamenting-firefox-quick-find/

lolive 4 months ago

Link Hints, what else !!!!!! https://addons.mozilla.org/user-media/previews/full/232/2320...

stephen123 4 months ago

I like leopard links for that. cmd+t type "go/" and I get all of the shortcuts I've configured.

https://leopardlinks.com/

butz 4 months ago

With more websites shrinking their scrollbars or removing them outright, keyboard navigation seems to be the last resort.

massimoto 4 months ago

Control + Enter worked on the first three test elements for me on Chrome + Mac. I got alerts and redirects.

mudkipdev 4 months ago

The battery link is more interesting

  • b0dhimind 4 months ago

    yeah seriously wth, I just did powercfg /requests and it says an audio stream is in use... so many web apps open I wonder how much power its been eating.

lelanthran 4 months ago

Thos small snippet is a great thing to add to your site if you have all your links as buttons.

WhyNotHugo 4 months ago

> Just press ' and start typing.

This doesn't seem to work with English International keyboard.

  • garbagepatch 4 months ago

    Pressing ' twice places one ' in the search box and then you have to delete it. You can press ' <space> to get the search box empty.

  • arp242 4 months ago

    If you have dead keys you need two quotes, like everywhere else.

pvtmert 4 months ago

Honestly, most sites these days built in such incompetent way I cannot imagine how much disabled users suffer...

Since there is no tariff adding <div> in react code, even my teammates are using these as pseudo buttons. As a user, I cannot even tell if it's a button or not. The cursor usually doesn't change or becomes "I-beam" (text selection). Only way to understand is click random places and wait for mysterious stuff to happen.

apparent 4 months ago

Pressing down-arrow on WSJ articles unmutes the auto-playing video. This may have happened by mistake, but surely they've kept it this way on purpose. I hate it.

Keyboard Shortcuts

j
Next item
k
Previous item
o / Enter
Open selected item
?
Show this help
Esc
Close modal / clear selection