Why do web sites not place the cursor for input?

Question

To their credit, Microsoft puts the cursor in the text field ready for me to type in my authenticator code. Most web sites I've found, do not. So I look up with my shiny new code, ready to start typing, realize I need to move my hand to the mouse, place the cursor into the field then there's a 50% change I've forgotten the code and have to look back at my phone.

ttfkam · Accepted Answer

A lot (the majority?) of web developers know their framework and how to script things but don't know that HTML has been able to do things like this out of the box for over a decade. Even IE 10 supported it. So much simpler and more reliable than using JavaScript. https://developer.mozilla.org/en-US/docs/Web/HTML/Global_att...

mtmail · Answer

(From https://github.com/sveltejs/svelte/issues/6629#issuecomment-...) "The reason why autofocus should be generally avoided, is that it's messing up the focus order for screenreaders and similar assistive technologies. Additionally, logical "focus order" is also a success criterion on the official WCAG 2.0 accessibility guidelines by the W3C." https://www.w3.org/TR/UNDERSTANDING-WCAG20/navigation-mechan...

illamint · Answer

Cynically, I feel like these details are often lost in the two-week sprint cycle or other realities of modern software development process. The Figma file didn't specify autofocus, the PM doesn't care about it, and the engineer just wants to close their ticket so they can move on to the next one. It's a login page, who cares? What revenue or business metric does it drive? Same reason the input field for the code doesn't have its input mode set to numeric (to show a numeric keyboard on mobile devices), and the same reason the email field doesn't have the email input mode set (to show the email input keyboard with @ and . prominently featured).

alexchamberlain · Answer

I can get over that, but I've used a couple of websites where hitting enter in the code box doesn't submit the code and log you in - that is unforgivable.

bdcravens · Answer

Principle of Least Astonishment"In user interface design and software design,[1] the principle of least astonishment (POLA), also known as principle of least surprise,[a] proposes that a component of a system should behave in a way that most users will expect it to behave, and therefore not astonish or surprise users."https://en.wikipedia.org/wiki/Principle_of_least_astonishmen...Such a feature would negatively affect accessibility, without some sort of accessible clue about where the cursor was moved.

bdavbdav · Answer

Similar vein, there&rsquo;s a special place In hell for web / iOS developers who don&rsquo;t flag input fields correctly to allow autofill / password managers to work. I see it in a lot of crappy legacy iOS apps.

ravenstine · Answer

Even worse is when the input is initially has the cursor, but then the site's absolute genius SSR rehydration kicks in, not only erasing what you just typed, but also removing focus from the input.

eimrine · Answer

I needed 22 tab presses to achieve the comment field here w/o mouse and tab enter to send.

al_be_back · Answer

a couple of reason not to focus:1. on mobile devices, a focused also triggers Keyboard to open, that in turn may cause the page/content to scroll suddenly etc. that could annoy the user, 2. if there's content to read (a message, Terms etc), the user may end up not fill the form at all

dimaor · Answer

Sendgrid's lack of autofocus in the 2FA page is particularly annoying

codingclaws · Answer

One reason I don't see mentioned: you can't use keyboard shortcuts that use the backspace key.

NoZebra120vClip · Answer

While I normally feel like the designers don't care about accessibility, I feel like in this case, it may be a bit of a security issue. The site wants to do all they can to foil automation, for example, and if the caret isn't helpfully placed exactly where they need to start input, a human can figure that out better than a bot.

mdwalters · Answer

its because they're using autofocus

htfu · Answer

Vimium.gi

retrocryptid · Answer

The web is not designed to be useful for any purpose. It is designed to demonstrate plausible "technologies" developed by companies whose investors want to sell them to other companies.Anything beyond basic WEB 1.0 is intended to be "plausible" instead of "useful."

Why do web sites not place the cursor for input?

I can get over that, but I've used a couple of websites where hitting enter in the code box doesn't submit the code and log you in - that is unforgivable.

Similar vein, there’s a special place In hell for web / iOS developers who don’t flag input fields correctly to allow autofill / password managers to work. I see it in a lot of crappy legacy iOS apps.

Even worse is when the input is initially has the cursor, but then the site's absolute genius SSR rehydration kicks in, not only erasing what you just typed, but also removing focus from the input.

I needed 22 tab presses to achieve the comment field here w/o mouse and tab enter to send.

a couple of reason not to focus:
1. on mobile devices, a focused also triggers Keyboard to open, that in turn may cause the page/content to scroll suddenly etc. that could annoy the user, 2. if there's content to read (a message, Terms etc), the user may end up not fill the form at all

Sendgrid's lack of autofocus in the 2FA page is particularly annoying

One reason I don't see mentioned: you can't use keyboard shortcuts that use the backspace key.

its because they're using autofocus

Vimium.
gi

The web is not designed to be useful for any purpose. It is designed to demonstrate plausible "technologies" developed by companies whose investors want to sell them to other companies.
Anything beyond basic WEB 1.0 is intended to be "plausible" instead of "useful."