Questions tagged [input-focus]
The input-focus tag has no usage guidance.
41
questions
100
votes
12
answers
34k
views
Removing placeholder text on focus
Chrome, Safari, and Firefox 15+ remove the placeholder text after the users first key press in the text input field.
Opera, IE, and Firefox 14 and below remove placeholder text immediately after ...
- 3,872
27
votes
2
answers
4k
views
What value does :focus CSS state add for buttons?
We all know that :hover is required if you want to create sophisticated user experience. It allows users to recognize a click option on an element.
I wonder what value does :focus add for buttons? ...
- 795
21
votes
3
answers
2k
views
Are there any valid reasons for an application to steal focus?
This comment on another UX.Stackexchange question:
that's not to force you to read it, it's to ensure that websites don't pop up the window as soon as your mouse pointer goes to click something in ...
- 658
13
votes
10
answers
5k
views
Drawbacks of auto "focusing" on a web page's text field (JavaScript)
Do you guys know any drawback of focusing on a text field on a web page ?
It's pretty useful when you know users will use this text field more than others (like on the google homepage), but it's a bit ...
- 233
11
votes
5
answers
1k
views
What element should have the focus after a search?
A website has its own search (there are reasons for this; no, a Google site search will not do).
So, after a search is executed, for accessibility what element should have the focus? The number of ...
- 213
8
votes
1
answer
309
views
What element to focus after user input on a chatbot?
This is similar to What element should have the focus after a search?, but not the same case.
I'm building a chatbot with Flutter (mobile). This is the flow:
Bot asks a question.
User is presented ...
- 180
7
votes
3
answers
2k
views
Which button should get the focus at delete dialogs?
I thought that most destructive actions should be avoided from default actions. But when a delete dialog comes, I see that most Windows applications (even the OS), by default, set the focus at "...
- 495
6
votes
2
answers
978
views
What are the requirements from a multi-row tab control in order that users will be able to intuitively tell which tab is active?
In the implementation in Visual Studio 2010's "Tab Well" (a feature of the "Power Tools" extension), pinned tabs can be multi-row, non pinned tabs are in one scrolling row.
In Firefox's "Tab Mix Pro" ...
- 7,333
6
votes
2
answers
2k
views
Give focus to last focused element on navigating back in browser history — good or bad practice?
I've stumbled on this very obvious idea while working on a website with a lot of interactive items that lead to separate pages. Initially I thought it might be useful for users to have the last ...
- 175
6
votes
2
answers
559
views
How to decide if auto-focus on search makes sense for the site?
I have code reference site ( QueryPosts.com ) that is largely search-centric and has prominent search form in sticky top bar.
It has been suggested (and I considered it myself before) that search ...
- 163
4
votes
2
answers
2k
views
How to represent a switch "tabbed" state in Material Design?
Trying to determine a way to represent a "tabbed" state on a switch that looks like this:
Under the hood, it is just a checkbox that the user can tab-over and press enter to check/uncheck the box.
...
- 1,189
4
votes
5
answers
7k
views
Auto focus on the first form field; done right? [closed]
I want to add a bit to the flow of users, by making the first form field auto focus on page load.
Initially the auto focus scares me a bit (sometimes called offensive). But as said in that Q&A, ...
- 2,098
4
votes
2
answers
1k
views
What happens when the focus rectangle isn't clear?
I get a lot of clients that comment that the focus box isn't obvious enough in some browsers. Is it common and good practice to make it more obvious? If so, how exactly do people do this?
- 595
4
votes
3
answers
5k
views
Content slider / carousel accessibility best practices?
I'm building a content slider for a news site and faced with the issue of keyboard and screen-reading accessibility.
Case #1: Pure image slider
For generic image slider it appears you can go with ...
- 1,731
4
votes
1
answer
503
views
Creating user friendly autocomplete inputs for mobile devices
Note: Initially I posted this question for code review, but realized this is really a question about user interface.
I am working on an e-commerce website, I have 2 types of autocomplete inputs:
...
- 237
4
votes
2
answers
201
views
Should the focus be set on the first field on a mobile app registration form on screen load?
Should I set the focus to the first field on a registration form when the screen loads? This means that the keyboard is then in view and will obscure the rest of the form from the user.
The ...
- 123
3
votes
2
answers
291
views
How best to handle a popup gaining focus in the middle of the user typing?
Often I'll set some process off, then change focus to another program and be typing away in a textbox (for example), when the first thing pops up into view, maybe with a Yes / No box which I'd then ...
- 235
3
votes
3
answers
189
views
Are there any drawbacks to using tabindex to skip navigation elements and go to an input?
With a lot of sites I have to press tab ~7 times in order to get to the input that I want to use. I'm thinking that I will set the tabindex on that input to 1 so that it gets focus first. It seems ...
- 191
3
votes
2
answers
4k
views
Where should keyboard focus be after activating a button that brings up a non-modal dialog?
I have a button that shows a non-modal dialog, like this:
The "Show Symbol Picker" button brings up the symbol picker non-modal dialog. If the button is pressed again, the dialog stays open, and ...
- 721
3
votes
1
answer
109
views
multiple focused/selected items
Is there a thumb rule about multiple views containing selected items?
Currently in my application they do all get the same colored border but I think it can be improved:
The only idea I have is to ...
- 185
2
votes
2
answers
124
views
How to indicate window focus without being too subtle or too heavy handed?
My application has a window that shows the waveform of an audio sample and the text transcript of that audio:
(Sorry for the extreme blur, but this is proprietary software and I'm advised not to ...
- 561
2
votes
1
answer
42
views
Should I focus the cursor to the search field or leave that up to the user?
If I show the search field on a user click should I focus the cursor to the search field or leave that up to the user?
I see benefits for both arguments so atm I'm leaving it up to the user. If there ...
- 145
2
votes
1
answer
1k
views
(Accessibility) - Back button placement on the page in SPA
I am working with an SPA with Angular and the designs indicates that there is a back button and it is before the Page level heading usually the H1. For SPA, it is a general practice that we place the ...
2
votes
1
answer
435
views
What to focus on after row deletion
I'm designing the keyboard navigation for a table/grid. Each row in the grid has a "delete this row" button. After a button is activated and the current focused parent row of the button is deleted, ...
- 123
2
votes
1
answer
85
views
Is It Acceptable To Use Custom Focus Indications As Art Direction?
As part of a redesign of my personal site, I have a hero image with an animated flying blimp. When hovered, the blimp toggles to a different animation. I would like a keyboard user to be able to ...
- 143
2
votes
1
answer
1k
views
Link states – should keyboard focus replicate hover or active
I realise that this question may be quite specific CSS-wise, but it feels more like a UX question than a StackOverflow one.
My question is should links have a :focus state that replicates their :...
- 148
2
votes
1
answer
113
views
Is there a name for a modal that interrupts a task and steals focus?
It is very common in almost all modern operating system that some programs use a windows that "interrupt" whatever the user is doing, stealing focus to itself.
For example, I was just ...
2
votes
4
answers
4k
views
Accessible tooltip with links
I'm working on an accessible input component with built in tooltip. I've managed to create a solution that seems to work fine for people with limitations — whenever user focuses that input with ...
- 133
1
vote
2
answers
843
views
Auto-set focus in an input field?
In a form, some info is already filled in.
By tapping the X as seen in the image above, the user can then enter new info.
Question: Would it be a good idea to place the input-focus on that (yellow) ...
- 859
1
vote
2
answers
110
views
Which styling should the field have, once a value has been chosen?
I'm working on the input style for a dropdown field, and I have two options for once a value has been selected. The default field state is shown at the top, which has the same border color as the ...
1
vote
2
answers
213
views
Is there a standard keyboard only method of removing focus from all HTML form inputs?
When navigating an HTML form using Tab, a properly designed form will allow that all interactive elements are accessible and focusable, but how does one break out of the focus using the keyboard?
...
- 113
1
vote
2
answers
99
views
Undesired change of application focus by the OS
Some desktop Operating System (OS) do spontaneously switch focus among applications without the user being aware of it. A typical issue is when you are typing in text editor and suddenly another app ...
- 181
1
vote
2
answers
203
views
How to tell users that they have to change the focus from the input to apply the change
In HTML, if you have an input with an onchange, it doesn't register the change until you leave (or lose focus) that input. There's an onKeyUp function as well which would have the function run as they ...
- 904
1
vote
2
answers
81
views
Is it a good idea to refocus into a text box after validating it?
Let's say I have a text box where you only are allowed to enter integers. When the focus is lost, then the page should check whether the entry is an integer or not. If it's not an integer, then the ...
- 113
0
votes
2
answers
410
views
Disappearing input field placeholder aesthetics for web apps
Background
Users may provide various categorized input entries (e.g., danger, warning, avoid, and relax), such as those in the following image (e.g., "Relax #1", "Avoid #1", etc.):
Problem
When ...
- 225
0
votes
1
answer
252
views
Change or not field focus after autofill next fields
There is a form with following fields in following order:
Zip City State Phone
When user enter zip code fields city and state got auto populated based on zip code user entered.
The question is it a ...
- 111
0
votes
2
answers
129
views
Menus Depth in Mobile Games
I've played quite a lot of console games, and some of the game menus tend to go pretty deep. It might go something like:
Home Screen -> Play -> Multiplayer -> Online -> Create Room -> Customize.
I ...
- 451
0
votes
1
answer
86
views
Should a popup button get focus when changed?
I have a window which shows a table on the left half. On the right half I display properties of the item which is selected within the table. The user can now change these properties.
The properties ...
- 101
0
votes
1
answer
506
views
Should clicking outside a textfield hide the software (IME) keyboard?
I am developing an Android (Jetpack Compose) app and have observed that when a textfield gains focus, a software (IME) keyboard opens, and remains open even after I click outside the field.
This is ...
- 101
0
votes
1
answer
63
views
In a validator app, how to keep focus on the content you're validating?
I've got a specialized text validation application where the user can either type, copy/paste the text or load file in - then hit Validate for the screen to transition to the results area. Here's a ...
- 149
-1
votes
3
answers
170
views
How to focus visitors on the search bar when there's a category list also present?
I have a product category list on the left side of my store and I can't remove it.
What options do I have in promoting the search bar so that more people use it?
I added action text inside the ...
- 390