Tag Info

Hot answers tagged

52

Not everyone uses a mouse. Focus is vital for users who need to press Tab to move between interactive elements on your form/page. Creating a :focus style for your buttons (ideally similar to :focus on other elements) allows those users to see that they are no longer typing in a text input and that the submit button is active if they press Return. Even ...


8

Usability dictates that there should be nothing barring (or slowing) the user down from performing the action you want them to take. In this case, signing up. The 2nd option is the better of the two because it places the sign up form front-and-center, right where users need to see it. The icon is inherent (this is a school website, after all), so keep it out ...


7

I have no reliable evidence that my version is better, but speaking from my experience (10+ years) and regarding common usability rules, I suggest to make something like it showed below: remove unnecessary texts make the logo smaller and center make the button bigger


4

Focus is used for form elements. It shows that you've clicked into the text entry box (for example) and it will stay onFocus for as long as that element is selected. EDIT: For submit buttons your "highlight" or whatever you do for showing :focus will be there for as long as you are holding down the mouse button. The use cases for this are more limited. ...


4

There isn't really a "good" answer to your question, simply because they're engaged in bad practice. While that sounds negative, the simple answer is that they are not considering the User Experience properly: a flaw many designers and developers have, and one which I'm guilty of displaying myself on occasion. It may be that it takes too long, that they ...


4

Keep in mind that accessibility is more than just accommodating screen readers. Tooltips can be troublesome in a lot of situations: screen readers (as mentioned) non-mouse access (keyboard, touch devices, etc.) dexterity challenges (the (?) icons are often very small) In general, you will want to: make the target as large as possible make the tooltip ...


3

I'm more on board with @IgorGubaidulin's answer if it was my site, but working with what you have, I would just simply move the logo inside and be done with it: Option 1 Option 2


3

I think most users would prefer having to press "Save". It gives a sense of control. I fail to see how this increases the user experience when using a modal window. There really is no reason not to have a "Save" button, as they have to close the modal window after they are done anyways.


3

I think what you mean is strongly related with the difference of the mental model of the user on how a system/program works and the experience the user has when expecting the behaviour of his/her mental model. The term "logical" will be defined for each user a little bit different, based on knowledge, tech skills, experiences,... So to make a program ...


3

Yes. You do need a matching Cancel button to go with Save. If you don't, it may not be obvious how to close the dialog except via Save: This is particularly the case where the other buttons such as the X are only coloured on hover — as appears to be the case here. It may be less important if the X is always red. However, you should also consider ...


3

For mobile users, the mailto can prove to be a life saver, they can type continuously on their mobile in their native email environment (natural for mobile?) and won't have to deal with "Tap- Enter detail -Tap again to hide Keyboard-Move downwards". Here's another thread on mobile mailto vs contact form: Contact form on mobile vs. mailto: link? For desktop, ...


3

Users aren't likely to fill out optional fields. Most people's brains aren't wired to keep track of time while they're actively engaged in an activity. To have them quantify how long they spent on the project by entering a number will cause most users to short-circuit and skip that field entirely. If you absolutely don't have any practical means for ...


3

In the described scenario, you should never provide an edit option or you'll have the problem you're mentioning. Basically, you're writing to a database, so let's say I have this question and answer: Q: roses are red, sky is... A: blue And now I edit the question, effectively overwriting the database's value: Q: Your teacher is... A: blue Which can ...


3

Unless you have an extremely homogenous audience, trying to validate a phone number is generally a bad idea. Phone numbers around the world are quite different, and even in the same area, there are a number of valid phone numbers. For example, in the Netherlands a typical mobile phone number may be given as: 0623456789. Here are the valid ways that I've ...


2

You could visually display the current stage of the user. By doing that, you will be managing users' expectation on exactly after how many steps the form will be completed. download bmml source – Wireframes created with Balsamiq Mockups


2

There are two possible causes of users leaving that I can think of, and I'm not sure which one you're trying to solve: User gets cold feet and decides they don't want to complete the process after all. I don't think there's much that can be done here except to improve your messaging and make sure that users who get as far as the confirmation step are ...


2

I had a project manager once who insisted that dialog boxes randomize the arrangement of the buttons so that users didn't get in the habit of just clicking through the confirmations. At first, I hated the idea, but after seeing the results, I still do it in new projects, twenty years later. Unfortunately, just rearranging a few controls is probably ...


2

Designs should communicate in the most clear and concise way possible. Although I'd argue that e.g., is understood by most english speakers, I'd also argue that 'For example' is not too verbose. 'For example' convey the concept in the most universal way. It's less than 3 words, so it can be read in a single fixation. So I would just leave 'For example', ...


2

It sounds like the lack of a due date is a valid use case that needs to be made more obvious. It can be hard to tell the difference between "hasn't entered a due date yet" vs. "there will never be a due date." If the ability to enter things like "59 days" is not a critical feature, you can solve this problem by using a select dropdown instead of a text ...


2

Why do web designers force users to enter credit card numbers without hyphens or spaces? Laziness. In general, super-strict form field format requirements rarely benefits the end user. It's typically implemented that way due to lax parsing on the back end/status quo/low priority. Which is unfortunate.


2

Including an alt attribute is the first step for supporting accessibility on the web. WebAIM (Web Accessibility in Mind) has an article with several tips, Designing for Screen Reader Compatibility. Among the many tips is: Screen readers will read the alternative text of images, if alt text is present. JAWS precedes the alternative text with the word ...


2

Well, it's a bit of a "dirty" manipulation that could direct a user's potential dissatisfaction at himself rather than at the system :). A user arrives at page, creates an invalid password, gets an error message that says "The password must be over 8 chars". He looks for the password rules on the page. If he doesn't find them, he becomes angry with the ...


2

Not all form actions are equal (Reset, Cancel, & Go Back are secondary actions: rarely need to be used (if at all), Save, Continue, & Submit are primary actions: directly responsible for form completion). The visual presentation of actions should match their importance. Avoid secondary actions if possible. Otherwise, ensure a clear visual ...


2

Let's start from the beginning: If you want to attach to the path to completion advice, you should do something like this: download bmml source – Wireframes created with Balsamiq Mockups Compare it to this: Improvements: Labels aligned with inputs => Less visual fixations, just 1 visual direction, less horizontal space, but more ...


1

Simplicity. Both in terms of implementation and in telling the user what is expected. All users will understand what it means to enter the number with all digits and no dashes or spaces. Some small amount of customers will get confused if told that they can use dashes or spaces, and then they see their card only has spaces, no dashes. Keep in mind there ...


1

Your most common are likely to be: Full stop at end of address Commas instead of full stops Semi-colon or apostrophe instead of @ Spaces in middle or at end of address Bracketed note in field – eg. (office) Double periods.. Some common misspellings: Googlemail – Gogglemail, googlmail, goglemail Hotmail – Hotmial, Hotmal, Hoitmail, Homail, ...


1

I think this should be more specific than leaving a blank field. A blank field can get ambiguos as there can be many interpretations from the point of view of the user. I would go, as suggested by poison-ivy, with an explicit option for "no due date". Or telling the user via a tooltip, that leaving a blank would mean "no due date".


1

As a user, I wouldn't be certain if the box should be left blank, I should enter a "0", or if entries without due days weren't allowed. I think adding a checkbox for the due date and having the due date box greyed out if it is unchecked would be the most clear. Preventing the user from making an entry if there is no due date removes any ambiguity.


1

Having validation in place to check values when the form is submitted to prevent invalid input making it to your database or whatever is always a good idea, regardless of whether or not the form was previously submitted. If feasible, validating input as the user is filling out a form (i.e. after a user edits a field) is extremely useful as it let the user ...


1

answering only the translation part of your question: german: zum Beispiel french: par exemple italian: per esempio spanish: por ejemplo so this works in those languages exactly the same as in english.



Only top voted, non community-wiki answers of a minimum length are eligible