usability | 易学教程

Tooltips in the era of touch

阅读更多关于 Tooltips in the era of touch

Tooltips are an incredibly useful interface paradigm to know an application. They are the mapping between the visual control and the application specific action associated to that control. The user can explore the action without invoking it just by hovering the mouse pointer. The touch devices make this paradigm basically impossible. This limits the usability of the app, which becomes in some cases pretty mysterious. Do you know if a substitute for the tooltip concept exists for touch devices? They effectively lack one degree of freedom in ui interaction: the pointer position. How to regain

Minimum sensible button size on iPhone

阅读更多关于 Minimum sensible button size on iPhone

I'm designing an iPhone app that features a rather large set of onscreen rounded rect buttons. Given finger-based touchscreen UI, what do you think would be the smallest sensible button size? I need to fit as many of them as I can in the viewport without compromising the usability too much. Maybe there's an Apple-recommended minimum size? Right now it's 33x33, and it looked OK on a simulator, but I was playing with the app on a real phone last night, and it was awkward - the buttons felt too small. Apple says that the avg finger tap is 44x44 (from WWDC). All table rows are recommended to be at

Making checkbox and radio labels clickable

阅读更多关于 Making checkbox and radio labels clickable

问题 A large number of (dare I say most?) sites do not make the labels clickable for their checkbox and radio inputs. It seems to be a huge usability gain for very little effort. Are there any compatibility/functionality/usability issues with using <label> that would discourage developers from using this tag? Edit: Even StackOverflow seems guilty of this, e.g., when asking a question, the Notify daily of any new answers checkbox label is not clickable. 回答1: No reason other than laziness. <label> s

How do I customize the Add button in jqGrid?

阅读更多关于 How do I customize the Add button in jqGrid?

I have a jqGrid and when I do a seach I get a small dialog. There is a Add button at the top which has a "+" sign to add rows for advanced searching. Is it possible to change this button text to a plain old school "Add" without hacking into js library. Is there any way by writing an extendion? Is so how? <input type="button" value="+" title="Add rule" class="add-rule ui-add"> The method navGrid has some parameters which can be used to change the look of navigator buttons. I used additionally toppager: true option of jqGrid and cloneToTop: true option of navGrid for the case that one uses top

How to add one-click unsubscribe functionality to email newletters?

阅读更多关于 How to add one-click unsubscribe functionality to email newletters?

问题 I'd like to customize the "unsubscribe" links in our email newsletters so that they remove the recipient with a single click. Right now they just point to a generic page where the user has to enter their email address and select the newsletter from which they'd like to unsubscribe. It seems like this should be pretty straightforward, i.e. just include the email address and newsletter id as url parameters. But when I looked at examples from the lists I subscribe to, many don't include a

How does one write good error messages?

阅读更多关于 How does one write good error messages?

问题 While this is more of a written language issue than a coding one, it is something that programmers must do in circumstances where copy is not provided by a client or someone else. Any examples of error messages, good or bad, are welcome to make the point. I briefly searched and could not find a dupe thread. Ok, have at it. Thanks, all. 回答1: Apologise. Say what went wrong. Say how to resolve it. Be polite. The message should be worded so that the application accepts responsibility for the

Easily digestible UI tips for developers [closed]

阅读更多关于 Easily digestible UI tips for developers [closed]

问题 As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance. Closed 7 years ago . What are some key UI design tips that every developer should know? While there are a number of UI resources for developers (for

How can I use credit card numbers containing spaces?

阅读更多关于 How can I use credit card numbers containing spaces?

问题 Some fancy websites show an error dialog when it is detected that an untrained shopper has entered a credit/debit card number as it is printed on their card with spaces. Is it possible in some way to write a Java web app that handles these numbers with spaces as if they were correct? 回答1: My view is that any Web app that rejects a credit card number with spaces isn't doing its job. When you receive a credit card number, it's easy enough to do: String ccNumber = ccNumber.replaceAll("[\\s-]+",

Should I avoid using “text-align: justify;”?

阅读更多关于 Should I avoid using “text-align: justify;”?

问题 Is there any reason to avoid using text-align: justify; ? Does it reduce readability or cause problems? 回答1: Firstly, this is purely a design-related problem and solution. The design of your grid specifies if justifying text is needed. I think justify align alone has no major effect on usability. Bad typography that makes text illegible is what decreases usability. That said, make sure you have solid contrasts and a good balance of spacing in your type. Font-size matters too. This site is a

Moving a focus when the input text field reaches a max length

阅读更多关于 Moving a focus when the input text field reaches a max length

I do have a credit card number form. The number is divided into four parts just as on a real credit card. I want to add a JavaScript taste to the form where when a user types four letters in a field, the focus automatically goes to the next tag. But not in the last tag. By doing this, a user doesn't have to type "tab" key to move a focus. It is okay to add some extra class, id or name in the tags. <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>MoveFocus</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2