38
votes
Accepted
What is the best number of paragraph width for readability?
According to studies, the line length should not exceed 70 characters. So keep your paragraph width between 50 and 70 characters.
So actually you should not care about the width in pixels, but rather ...
36
votes
Accepted
Is it a problem if <h4>, <h5> and <h6> are smaller than regular text?
Since <h*> means heading, this shows a hierarchy. The different numbers are a level ranking from high to bottom or maximum to minimum, where <p> is the last step.
Hierarchy: system in ...
36
votes
Accepted
How do you convey that the minimum size of an input is X characters?
The best approach is to inform the user about these rules in plain language next to respective input fields.
I would suggest enforcing a minimum and maximum character limit to handle edge cases and ...
18
votes
Accepted
How to show a huge amount in a small pill?
Your example doesn't look like a problem. But we can imagine the case where the balance is 450,173,827.45.
Consider removing "USD" since the user-specified currency is used throughout the app.
I don'...
12
votes
What is the best practice for data table cell content alignment
If the column is a text, left-align it
If the column is a number or number + unit, right-align it (like excel)
If it's a multi-part value separated by a common separator (like 1024 x 768 is multi-part ...
12
votes
Accepted
Images look bad with perfect paragraph width
It's not easy to propose an answer without seeing all the visual page content. These are some general concepts.
The design problem is not the text, in fact the statement of the question says that it ...
11
votes
What is the best number of paragraph width for readability?
The ideal paragraph width is not based on pixels per se, but on characters per line.
This of course depends on the size and spacing of your font type. The project I'm working on has a paragraph width ...
11
votes
What is the best number of paragraph width for readability?
tl;dr
An average of 60-70 characters is ideal for desktop viewing.
40-50 is more realistic on mobile.
Line length (measure in typographer speak) is an important factor for comfortable ...
10
votes
Accepted
Is there an intuitive way to display weeks as text?
Ah Socrates answered whilst I was drawing, so ignore the text ones as I'm suggesting the same thing, the other type is a calendar control programmed to select a week, for the line on which you place ...
10
votes
Is it a problem if <h4>, <h5> and <h6> are smaller than regular text?
The problem is based on an error. That headings in HTML have anything to do with design and they do not. The HTML heading elements are for document structure for the computer and have nothing to do ...
9
votes
Description and Value, which should be bold?
In your situation, I vote the same as other answers, highlight — through bold, colour or size — the labels over the data to allow for scanning behaviour, perhaps as people are comparing specs from ...
8
votes
Accepted
What's the difference between "account" and "profile"?
Profile typically includes information about you that is displayed publicly.
Account typically includes information you need to share with the company for them to provide you services.
Ex. An ecomm ...
8
votes
Is there an intuitive way to display weeks as text?
The matter is a bit subjective and it would require testing to ensure your users get the right idea.
Apart from keeping these UI elements contextual i.e Have text that clearly indicates that the user ...
8
votes
Accepted
Past simple vs present perfect in popup
Material Design discourages the use of the present perfect tense and encourages the use of simple word forms (see section Write in the present tense).
So I would either go for
Data imported. Will you ...
7
votes
Accepted
Emphasis in plain text
For totally plain-text you can use ALL CAPS (providing you do so sparingly), or you can _enclose in underscores_ (often used, as in SO's markdown, instead of italics) or you can *delimit* with ...
7
votes
Accepted
Can screen readers interpret Unicode styles fonts such as bold and italics?
If you want bold, use bold. Real bold. Not mathematical symbols. Those characters are intended for use in mathematics only. They are not, semantically, text at all.
U+1D5DB ‹𝗛› \N{MATHEMATICAL SANS-...
6
votes
Accepted
What's the best practice to let a user know a highlighted word is clickable?
Make it obvious by providing a signifier for what can be done (or should be done).
If it's important for users to correct this information than it's good to be a bit more obvious.
If you have tested ...
6
votes
Accepted
How long should I wait before creating an undo command when I'm typing text?
I'm not sure of any standards for this, but I'd start with creating undo "frames" after a .4 or .5 second pause, see how it feels and what your users think of it, then tweak from there.
Additionally, ...
6
votes
Is it ever OK to use italics?
I think it is perfectly fine to use italics.
The keys, in my mind, are to (a) use the proper markup and (b) use emphasis appropriately.
As far as proper markup, most (but not all...) tools for ...
6
votes
What's the name of the (old) experimental UX concept that revealed further details on demand?
Progressive Disclosure. This design pattern intends to reduce UI clutter, confusion and cognitive workload so that the user’s focus remains on the interface.
The example you described is achieved one ...
4
votes
Accepted
Text in UI readability vs. grammar – separate long words using hyphens
Microsoft's German style guide on the subject of Compounds:
The Microsoft standard is that compounds of three components or less
are written in one word, unless there are definite problems with ...
4
votes
Accepted
Word suggestion - "empty" vs "blank"
For the context in which you are attempting to use these terms I think blank and empty would be synonyms. Although empty seems a tad more suitable.
blank (adjective) - not written or printed on.
...
4
votes
Accepted
Too wide text for the screen?
You need to maintain a comfortable relation between the number of characters per line and the width of the container.
So either you set two or more columns, you make the font-size bigger or what I ...
4
votes
Accepted
Why do train departure boards use orange text on black background?
Simply because orange LEDs used to be brighter and more reliable than white ones. The Rail Vehicle Accessibilty Regulations require specific amounts of contrast in on board information screens and may ...
4
votes
Emphasis in plain text
Some parts of the following answer may depend on your target audience. Yes that's another way of saying 'it depends'!
The Wikipedia entry on formatted text says the following:
Formatted text has ...
4
votes
Accepted
In "Please add more X and Y to continue", should X and Y be alphabetical order?
Alphabetical order doesn't affect the user experience of the game, but it might affect the readability or understanding of the sentence. The user may perceive some priority in that the earlier one ...
4
votes
Accepted
Multi language text area
The best solution is provided by Google Translate: there is just one textarea. Users can set language with some buttons or the system suggest them the language detected.
If you want limit the range ...
4
votes
Accepted
How should regular black text change to show that it has become editable?
Text inputs on the web usually have distinct looks. Inputs and text areas typically look like they some some "depth" to it. You can try do add some borders or outlines to make it obvious that the ...
4
votes
How should regular black text change to show that it has become editable?
The most common way of doing this is to show uneditable text as text directly on the page and editable text in an editable text field. Are you doing something that prevents this?
4
votes
Accepted
Which sentence to use for save my name and email checkbox?
I would go with "Remember" instead of "Save". The data is being saved, but so is the current comment. "Remember" has the connotation of "make it easier for me the next time".
Remember my name and ...
Only top scored, non community-wiki answers of a minimum length are eligible
Related Tags
text × 334readability × 32
usability × 25
website-design × 22
image × 20
typography × 20
gui-design × 18
forms × 16
mobile × 16
accessibility × 16
hyperlinks × 16
layout × 15
color × 14
legibility × 14
labels × 13
formatting × 13
alignment × 12
navigation × 11
input × 11
font × 11
buttons × 9
text-editor × 9
user-expectation × 8
tables × 8
input-fields × 8