Tag Info

Hot answers tagged

14

There is no evidence that serif or sans-serif significantly impacts readability. Alex Poole conducted a study on Which Are More Legible: Serif or Sans Serif Typefaces?. His conclusion: What initially seemed a neat dichotomous question of serif versus sans serif has resulted in a body of research consisting of weak claims and counter-claims, and study ...


13

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.


13

Disclaimer: I am not a native speaker of a language which does use guillemets as a way to denote quotes. But I wanted to offer a view on how context can help identify if the content being referenced is a phrase or a case of pagination I believe there are two aspects to it I believe this is one of those cases where users can visualize whether a phrase ...


12

I think you're mixing up logo and icon. A logo doesn't have to be a square. There are several examples of famous non-square logos. But an icon should be square. It is mostly used as gravatars or also favicons (the small images in the browser tabs). But there is a strategy to design your logo similar to your icon. That means that your icon is also used in ...


12

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 ...


6

I guess it's because uppercase letters are both more distinctive and recognizable. Compare, for example, lowercase 'i' vs 'l' and 'I' vs 'L'. It has no effect for power users but important for newbies I believe.


5

There are very few advantages to using all caps, and that is why we usually don't. When we read text, largely what our brains are doing is recognizing the overall shape of words, rather than the individual letters. Lowercase letters have different sizes and visual densities; some have ascenders sticking up, or descenders sticking down. This means that ...


5

Some of the many factors impacting a font's suitability to a particular context are: x-height (the distance between the baseline and the top of most lowercase letters). Fonts with larger x-heights are more legible at smaller sizes. counter size (the hollow areas inside the letters). Letters with larger counters will be easier to read at smaller sizes, ...


4

The reasons why Font Awesome is so awesome have nothing to do with typography at all; it's simply a typeface full of scalable vector icons that, by way of including the font on your page, are instantly available when you need a sweet icon. From their site: "Font Awesome gives you scalable vector icons that can instantly be customized — size, color, drop ...


4

It's semantically incorrect, and I'm not sure of all the ramifications of that incorrectness, but I recommend using more semantically appropriate characters like right arrow → (→) and left arrow ← (←). I think most screen readers, if they audiblize them, would use the character names ("right arrow" and "left arrow"), and this is probably ...


4

If you want to consider users with special visual and/or cognitive requirements, it becomes quite complicated and there's no single answer. The W3C Web Accessibility Initiative's Web Content Authoring Guidelines (WCAG) provide a good starting point. That's probably the single most thoroughly-researched resource on web accessibility, though it's not totally ...


4

A non-blind user will usually already be familiar with that symbolic usage of « and », and also pairs ‹/›, </>, <</>>. Color, size, padding and border can improve the recognizability – your sample image shows the latter two used successfully. Localized text at the open/tall side of the symbols helps even more. If they appeared inside a text ...


3

The legibility decreases when using only caps (because the word has no defining shape anymore, it's more of a horizontal bar). Since legibility affects the time it takes to scan words, it does have a (small) impact on usability. However, all-caps can(!) look really stylish and if your users pay a lot of attention to style, this may just improve their ...


3

The best way is to show them. Take a screenshot of the tool itself and redesign it using properly treated Typography so they can see the difference. You can present your case with "Before" and "After" slides. In my experience because I like to advocate good design, sometimes will do this just for the heck of it because some bad designs look so gawd-awful. ...


3

I would simply make sure that each menu item was correctly padded/margined. If so, you'd get something more along the lines of this:


3

Actually, after writing that comment, I think I've thought of an answer the question. No, I don't think there is an ideal multilingual font size. The question is akin to asking "what is the ideal font size to use in the user interface for software that does everything for everyone?". It depends on context, purpose, audience and all the other usual factors ...


3

I believe it's partly alexeypegov's answer of distinctiveness, but also historical reasons. The first typewriters, which also had the first QWERTY keyboard, only supported upper case letters.


3

Although this could be a matter of opinion for many people, there are some references that may help you to decide. Text Treatment and User Experience. Here left alignment is recommended to avoid "rivers" of white space. The Perfect Paragraph. In this extensive article from Smashing Magazine, some caveats of justifying text are mentioned alongside the CSS ...


3

No, there is no such rules. But yes they are inside visible/non visible square area for size proposition like 16X16, 28X28,.....128X128 etc.Which helps in re-sizing or calculation in printing/html,css for better alignment. For your help: http://www.1stwebdesigner.com/inspiration/72-creative-and-smart-typographic-logo-inspiration/


3

Usually this is due to spacing and consistency; for example: All of these font's are easy to read correct? Though Calibri is the easiest because it's mono spaced. This means the eyes have an easier time reading them. Humans don't actually read the entire word instead they look at left-center of a word. T.he qu.ick br.own f.ox j.umps o.ver t.he l.azy ...


2

First of all small vs. large usage: For small text (document body text, or text far away), clean (undecorative text) is easier to read, because the space in between the lines within the characters is larger, leading to less strain on the eyes. For large text (document titles), decorative text gives the text "character" making it stand out. Since both the ...


2

Some fonts have a better readabilty than others, this may improve the way the user reads the content, which is what we want. In the case of the fonts you mentioned, Segoe, for exemplo, may look better in titles because it doesnt have a serif, but its a variable. Each font has its personality, some are better for headers, others for long articles, but all ...


2

Back in the day these were quite common so perhaps has become a form of an anti-pattern. But you are correct, these are actually punctuation characters...not visual arrows. So it is awkward to have them read out-loud in a screen reader (or view them if you are French). Today, I'd argue, we can do much better with CSS. Create the arrow icon as you see fit ...


2

You asked which is "better" and the Evil Closet Monkey cited an excellent article on legibility. But another interpretation of "better" concerns how the font will affect the reader's perception of the credibility of the information presented. This article notes a study that found certain Serif fonts created a slight increase of confidence for the reader ...


2

A few rules of thumb: I recommended providing at least two themes - dark on light and light on dark as some users may not be able to read one of the two. For light on dark, make sure the contrast isn't too high (e.g. use grey on black, not white on black). Make sure the contrast between the intensity of foreground and the intensity of the background is ...


2

There is no rationale to the best of my knowledge. It's a convention — one that's different in different places. For example in the UK it's much more common to see spaces or thin-spaces around em-dashes, or a spaced en-dash used instead of the closed em-dash. Long discussion on variations and what different style guides say at ...


2

In my experience in French, a language that makes common use of guillemets, you would have no confusion using « and » as previous and next page links respectively, and giving the arrows affordance (such as boxing them in the same way as the page numbers, as the examples Mark Nugent provides) would absolutely ensure it. Your biggest challenge, as others have ...


1

Just because the medium changes doesn't mean visual balance no longer applies. Because web apps are in a browser and browser sizes vary depending on the user, it is a bit different when comparing it to print media, where the designer knows explicitly the dimensions of the final product. Design is not an exact science, but setting appropriate css rules with ...


1

If you are not concerned about beauty/ugliness just try to imitate the Windows High Contrast colour schemes.


1

I'm still a HUGE fan of pixels. The problem however is that we're in the age of responsive design now. Unfortunately, Ems are starting to make more sense to me, even if I HATE what happens when you accidentally nest Ems or lose track of the base font-size. You could very easily end up with a font that's even smaller than you have now. Whatever you do ...



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