139

Screen digits are right aligned to maintain positional consistency between what a number represents (in base 10 that would be units, tens, hundreds, etc.). E.g. If I were to have 764 and then multiply it by 24, the answer would be 18336. By aligning to the right I've consistently seen the same unit representation in the same position, and when I've had new ...


40

Digits are right aligned for similar reasons as you would right align them in a spreadsheet or a table. i.e. when you see multiple numbers (and they all have a fixed set of decimal places), then it's easier to compare the numbers with each other because the digits corresponding to each place value are in the same physical position, thus making it easier to ...


37

Luke Wroblewski (aka LukeW) wrote an article about different label position. Like many things in UX Design, its a question about pros and cons.http://www.lukew.com/ff/entry.asp?1502 Mateo Penzo then did some eyetracking to test Luke's article on label placement: http://www.uxmatters.com/mt/archives/2006/07/label-placement-in-forms.php For labels left ...


34

If you are looking for the most easily recognizable use of a 5-star system, they should work from left-to-right. The star-rating system is very common now, and when is the last time you saw it work right-to-left? Users will likely find it confusing and will have difficultly understanding why they only gave something 2-stars, when the meant to give it 4-...


20

Yes, this is a "standard". I am >25 too and I know where to look up this guideline :-) This is guideline 2.3/16 in: Smith S. L., Mosier J. N. (1986) Guidelines for Designing User Interface Software (ESD-TR-86-278), Bedford: The MITRE Corporation | http://www.idemployee.id.tue.nl/g.w.m.rauterberg/lecturenotes/DA308/MITRE(1986)smith-mosier.pdf Authors ...


17

Darkhorse Analytics has one of the easiest to understand explanations for improving tables The points relevant to alignment of table data are: Left align text (where appropriate) Right align numbers (where appropriate) Align titles with data Resize columns to data


17

The placement of the icons beside the numbers would go by the natural reading order. Status icons would appear at the end of the line. As seen in the example below, this makes sense because the viewer sees the subject first, then the count associated with the subject, and finally the status of the count. (For RTL languages, the figure would be a mirror ...


16

Of the two options you have given, the second one is the best, as it's more visually obvious where the message starts. Hence it is easier to use as people have to think less about the structure of the message and can focus more on the content. It can however prove problematic if you have some long names in the chat, so you will likely have to come up with ...


15

Netflix uses filled stars from the left even though the ratings are right aligned. This follows the ability to quickly scan down the list of ratings and quickly assess at a glance which film is higher rated. Same goes with Paragraph alignment, as per Evil Closet Monkey's answer.


13

I don't have any data about this question, neverthless here my thought: Readability is much better for right aligned numbers. Why? Consistency. The Decimal points always stays at the same location, decimal separators too. So it is much easier for a user to identify how big a number is. download bmml source – Wireframes created with Balsamiq Mockups ...


12

Same direction as your text. Star ratings are most easily read when the significant part (filled stars) comes before the filler (unfilled stars). "Before" can mean left or right, depending on the direction your user reads lines of text. Unless your site is in Hebrew, Arabic or another RTL language, the stars should be LTR.


12

Generally, align the left of the field, not the text content: There are several reasons for this: Better alignment. For boxed input elements (i.e. with outlines, borders or shadows), the vertical | edges of the box tend to attract the eye as it scans down the left column so the form will be perceived as more organized if that vertical line is left-aligned....


10

When using right aligned numbers you must note that decimal separators are aligned only if there are equal amount digits after decimal separator: 12 345,90 132 987,9376 Aligning such numbers left would probably be even worse, so in cases where number of digits after decimal separator are not equal numbers should probably be aligned by decimal separator. ...


10

It seems to me that your first approach (decimal aligned) is pretty obviously much more readable. The amounts are much easier to perceive because of the same position of digits of the same significance and so it is much easier to quickly spot lager differences of the numbers by just scanning the table. Only if none of this is relevant in your design, but you ...


9

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 value separated by x) then align by a separator. CSS for this would be something like text-align: 'x' center; (Reference: Web typography book)


9

I would strongly advise against right text alignment from the readability point of view, at least for countries where the text is read from left to right. It is the same case as reading a book, if it would be right aligned, your eye would get quickly tired by searching the start of every line. See the image: Also when user knows what he is searching for, he ...


8

Both options you presented have drawbacks. Have you considered removing the logout button? Other apps that I log into, such as Facebook, Twitter, and YouTube, have the logout functionality in settings. Is there a specific reason a user would need to logout functionality immediately accessible? Would users of your application need to log out frequently? ...


8

In the West we start writing and reading from the left and move to the right. As such, if the input would exceed the visible space of the input box, it makes logical sense to start from the left. If your centred search only allows for X characters, which would not take it past the bounds of the input box then the centred text-box could work. If you were ...


8

Best practice You'll find a lot of info out there about CTA tests and theories. But you're not going to find a whole lot that tells you what to do with horizontal alignment. The reason is, it depends on your design. The norm If your colleagues want to talk about what is more common, then you should align right, as you suggest. This is used more often than ...


8

Though design and user experience is becoming more dynamic and flexible, some things still remain traditional, just like anywhere you see the diskette icon, you automatically know its the save button and you might struggle to get used to another icon for save. Hence, I would suggest you leave the scroll bar to the right, the user (a lot of users) will ...


7

In the article How to Use Centered Alignments: Tips and Examples the following recommendations are suggested : There’s nothing inherently bad about a centered alignment, you just have to know how to properly yield one if you’re going to implement it with any amount of success. The first thing you need to learn is when not to implement a centered ...


7

As mentioned by @locationunknown in the comments, the vertical position doesn't change when the window is resized. But to answer your question. I believe it is because Google doesn't want you to travel visually far from the top of the screen. Most of the important information is in the top of the screen (highlighted with red). Tabs, address bar, profile ...


7

You could use the typical Office style way of aligning text. Don't deviate from things that are very common. Most WYSIWYG text editors also implement something like that. You could even consider giving these options in a menu that can be opened from the container that contains the text.


6

Keep the ability to see relationship across rows. Especially lists of text items should be aligned to the left for users who read text from left to right and numbers should be aligned to the right. Setting the vertical alignment to middle could be considered as a design trade-off that allows easier scanning of rows but if you frequently need to look up ...


6

Because the image and text are differently in each case I would do the following. 1st grouping I would only use that in an aligned left scenario 2nd grouping I would have to use this in a centered design 3rd grouping I would use this only when floating like elements next to each other.


5

There are some important points that appear to have been completely overlooked. Aesthetics are important too. You don't have to choose (enable your readers instead). Aesthetics It may be worth remembering that the use of justified text goes back a long way. Justified text is used in probably the most highly regarded and most valuable documents that exist. ...


5

I wouldn't say there's anything particularly inelegant about your design. You have the right number of options, i.e. no crucial functions are omitted and no superfluous functions are present. I only recommend two changes. 1) Reverse the location of the buttons. The confirm command should be on the right because western convention dictates a top-left to ...


5

There are good examples for each of the cases, but they are chosen in conjunction with the navigation placement and overall site design. OKCupid uses a top filter and it suits their needs well, however they already have a left navigation bar, a top filter is the only option that makes sense for them. oDesk on the other hand uses a left filter, which works ...


5

So, I've evaluated the answers and tried the option with the icon instead of the word and the result (as in: all the titles suit in there) would work fine now. But I'm still concerned about the familiarity of the icon and if it's appropriate even. What do you think? Remember that the button is used every time the user uses the app.


5

I would agree with most of the responses, that filling in the stars from left to right makes the most sense due to learned user behaviour from the majority of websites, and English being LTR. A user clicking a star for a rating could definitely be confused by unexpected behaviour. However, it was stated that this will not be a user-interactive piece. ...


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