Tag Info

Hot answers tagged

175

It's a legal compromise really. From an article on the New York Times: The design of modern billing blocks illustrates the tension between two intersecting interests: studios want uncluttered marketing materials, and industry organizations want their members prominently and fairly credited. Thus, it is neither accidental nor for aesthetics that the ...


51

This question probably belongs on Graphic Design. That said: Good visual design is about a lot of things, one of them being that it should be appropriate for the particular message one is trying to communicate. Comic Sans was designed for MS Bob, a failed UI concept of MS's back in the day. It was created to be informal, but legible at low-resolution. MS ...


38

It really depends on a lot of factors such as what is the frequency of certain characters that you expect and what fonts are available to you. I did a rudimentary by creating a program that iterated through all of the available fonts I had installed on my Windows box at the time and printed a line containing each printable ascii character on to the screen ...


24

Comic sans is a good font, if used correctly. It's for comic book situations like below. (usually all CAPS) It's not meant for emails or web page text. My suggestion is to show them the proper use of the font and ask them if they want comic book characters commissioned for the site. Then it will look correct. Sometimes, trebuchet MS or Tahoma will make ...


23

Old style figures are used in titles and paragraph text. According to Fonts.com old style is suitable for title and paragraph text due to the fact that this gives the text uniform look. The 'modern' style numbers should be used for tables and graphs, since these modern numbers align better when used in these contexts. There are fonts that support both old ...


21

It depends. It depends mainly on how users will be locating the data they are interested in. Numerical Stats in a Row If the page is repeating the same stats groupings in the same order, then positional memory will be used, and the numbers themselves also cue the reader in to positioning - Best bowling 5/45 has a different form to Economy Rate 1.51 and ...


18

The principal problem to my eyes is that I'm scanning column wise instead of left to right. Any marks that appear towards the bottom of the character indicating 'b' or 'd' would not be enough for my eyes to quickly determine the character. I suggest you make a change to one of the character's top strokes. Maybe a one pixel dot towards the 'inside' (left if ...


18

Monospaced typefaces do reduce legibility, albeit by a margin. In Universal Principles of Design, the entry on legibility states: Proportionally spaced typefaces are preferred over monospaced. One famous research on this is Beldie I. P., Pastoor S. & Schwarz E, 1983, “Fixed versus variable letter width for televised text”, Human Factors, 25, ...


16

I don't deal in print, but I have read quite a bit about fonts in the past. Recent studies have shown that serif vs. sans serif on a computer display is not really what affects readability, even at lower resolutions. Print, however, is a different matter. The studies consistently indicate that in print, serif based fonts are easier to read. That said, some ...


15

Like any normal web design, it's worth staying away from pixel sizes so if a user really needs larger text they can still use your site. Unless you're targetting a specific group of phones that you can test, it's best to let the OS and browser handle the size. font-size: medium; should be fine for content, and then you should be able to make em based ...


15

You may be able to play around with the idea of drawing them both using a single stroke, and differentiating by a small gap in between the vertical and the c curve. For "b" you could leave a gap at the top point where the c meets the l, and for "d", the gap could be left at the bottom instead. This effectively makes it appear as 1 stroke, or 2, and might ...


13

Considering your content is like most where the user will be reading the data more often. For example consider where your eyes go first: - Bowling Pins: 32 and now the opposite: - Bowling Pins: 32 - They user will come to the page for the first time and: See the bold data, than look at what they represent. The user will return to look up the data ...


13

The biggest problem is the visual emphasis lost by the bright colour (in this case green). You can say "ignore the other colour", but it's the biggest problem with the readability! So it's hard to successfully improve the readability without working on that colour. The menu on the left is very high contrast, causing it to distract the reader from the main ...


13

Having your cursor slanted would be a UX improvement over a permanently vertical cursor. Many word processors already do this. Here are some examples from MS Word: It gives additional feedback to a user that the text they enter will be italic, and it is visually less confusing when selecting text. At the same time, I can't think of any reason that it ...


13

As I mentioned in a comment, I don't think 'b' and 'd' are necessarily two characters that are confusing to most people. So there may be of limited interest/use in such a typeface. one and I and lowercase-L are confusing because they are often the exact same glyph in a lot of typefaces. Zero and O, thought usually slightly different are often seen as the ...


13

I think that the closest answer is: a compromise between visibility and legibility (which of course created some standard with time, or even: best practice). The main purpose for that is the need to fit as much text as possible, while still keeping the letters quite big (this is why the letters are almost always capital here as well). Fonts used here are ...


12

I think a user using an app like that (text rendered with no accents when accents are expected) would find it to be very unprofessional. As the accents play an important role in the language, leaving them out could: Cause users to just passed off as bad grammar. Change the meaning of what you are trying to convey. Look like gibberish. As for languages ...


12

A typeface is a distinct design of glyphs, a font is a specific variant therof, consisting of a full set of glyphs. Helvetica is a typeface, as is Courier. They are different typefaces, and by definition different fonts. Helvetica condensed bold is a font, as is Helvetica italic. They both belong to the Helvetica typeface, but they are different fonts.


12

I like to compare old-style numbers to lowercase, and new-style to capitals. Some typographers even talk about 'lowercase' and 'uppercase numbers'. To my eyes, using UPPERCASE in the middle of a sentence seems odd, also when using numbers in the text. old-style numerals just 'flow' better with the rest of the lowercase letters in a sentence. When available, ...


11

This is what I like to call reverse wireframes. It's very useful to see how your site has evolved over time OR to take a preexisting website and deconstruct it and pick it apart. The tool I use is: Wirify and can be used on most any page buy just clicking the bookmarklet. Just drag the below code to your bookmark bar and click it to turn the page into a ...


11

I think the best explanation I have found was in this article which explains how fonts constitute a typeface. To quote the article A typeface is a family of fonts (very often by the same designer). Within a typeface there will be fonts of varying weights or other variations. E.g., light, bold, semi-bold, condensed, italic, etc. Each such variation ...


10

I'd go minimalist with this. Start with a single font family. That is, a combination of bold, condensed etc. For example of what I mean see PT Sans from the Google Font API. If you plan to add any more, then justify it explicitly. That is, convince yourself that there is not only an asethetic, but a functional reason for the additional font. Obvious ...


10

This is Futura. Here's a screenshot of the same text in Futura on my computer: http://i.stack.imgur.com/ZETTG.png Some of the clues that indicate it's the same font: The perfectly round o The point at the bottom of the v The flat angles at the top and bottom of the b's vertical bar (and other similar vertical bars, like on the n and the r) The perfectly ...


10

Headings may use the same font as the body, but they are not required to. Plenty of great typography uses different fonts for the body and headings. In fact, there are fonts specifically designed for each purpose -- "text" faces for the body, and "display" faces for headings, titles, posters, and so on. If you have a single good font, it is acceptable, ...


10

Coda Sometimes a smaller font is a good way out of a tight spot. In this particular case, at least for the part of the problem shown, there is a better solution which is both clearer, and takes half the space, like so: I'm using a large enough font, 18pt Tahoma (open image in new tab to view full size), that the negative letter-space is OK.


10

How well a font displays on the web depends on how much hinting information it has had: http://en.wikipedia.org/wiki/Font_hinting Font hinting takes a tremendous amount of time to do as the font must be adjusted at each size. The reason Arial, Verdana and other older fonts always display well is because they have been meticulously hinted. Verdana has a ...


9

MIL-STD 1472F Section 5.14.3.5 has a pretty good section on displaying tables in a user interface, although it could stand some updating for modern GUIs. Here are some of the standards, along with my interpretation marked with a bullet for GUIs: 5.14.3.5.4 Titles. For a table that takes up multiple pages, column headers shall be on every page for table. ...


9

I think you've asked a leading question and are therefore getting answers that match your initial guess at the solution. The font variation answers are interesting for solving the general problem of distinguishing similar characters, and are particularly helpful for dyslexic readers, but in your case, you actually need to distinguish words, not characters. ...


9

Here is a bookmarklet that will make all the text transparent: javascript:(function(){var tag=document.createElement("style");tag.type="text/css";document.getElementsByTagName("head")[0].appendChild(tag);tag[(typeof document.body.style.WebkitAppearance=="string")?"innerText":"innerHTML"]='* { color:transparent!important; }'})(); To get this to work, add a ...


9

I think that really, it's the most standard non-strict font, in that it conveys a lighter tone given its non-strict nature as most fonts have. The curves and "smoothness" of it make it appealing for lighter messages, generally in a non-professional atmosphere. That said, I haven't seen all that much use of it in the past 4+ years, as there are many other ...



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