In skeptics fashion, here's a peer-reviewed scientific literature article.

Type size, as reported in Table 8, was found to be a significant main effect. (F (2,104) = 6.582, p = 0.002). This result leads to the rejection of null hypothesis H3 and forces a conclusion that size does matter.

Legibility and comprehension of onscreen type by Scott Bondurant Chandler

Please avoid microscopic fonts (e.g. ≤12px)

There should be no font with less than 12px on screen as a default. It's too small as defined by the study above, for example.

Examine the following copy (for example: "votes", "answer", "views", "active", "featured" and many more):

screen shot of the site, with highlights around text pieces of a small font size

Notice the font size (e.g. "Inspect element" on Chrome)

All copy text should have a size of at least 13px.

  • 1
    Is this causing actual issues or is this just a "the technical implementation does not follow best practices" complaint?
    – balpha
    Mar 23 '12 at 12:18
  • Well, the best practice IS that fonts shouldn't be too small otherwise its unreadable, so BOTH, and the other issue is that you shouldn't have fixed sizes to allow proper scalability in the broswer (for example when I want to make the font size bigger).
    – Sklivvz
    Mar 23 '12 at 13:42
  • 1
    What browser are you using that doesn't scale the text correctly? You have tagged this "bug", but I'm still missing the bug report. Are you actually seeing any problems, or are you just citing guidelines that we should follow in your opinion but don't?
    – balpha
    Mar 23 '12 at 13:55
  • It's a bug: there should not be 10px copy on the site. You can verify this on any non mobile browser that supports the CSS.
    – Sklivvz
    Mar 23 '12 at 15:41
  • 1
    All fine and zoomable on my phone. I'm asking you one last time to turn this into an actual bug report of the "this is how I expect something to work, and this is what actually happens" kind, if possible with a screenshot. So far this is only a rant about how we should be following certain philosophies in our development.
    – balpha
    Mar 23 '12 at 15:50
  • @balpha: it's not a rant, done.
    – Sklivvz
    Mar 23 '12 at 16:12
  • That isn't copy text. Those are small labels. like copyrights or other nuance level text that is not the most important part of the view. I suppose we can raise it up a px or two. Mar 23 '12 at 17:32

I'm actually letting the answer/views/votes text ride at 11px. After making it larger it competes with the tags. and when tags are bumped up the page looks really even busier than it needs to. those 3 words don't need that much emphasis.

Let's try it this way for now.

  • So it's not really completed, it's by design...
    – Sklivvz
    Mar 23 '12 at 19:56
  • 2
    I changed the type size of tags from 11px to 12px. the tags are much more important than what I'd deem <small> level text. Users don't need the word "likes" or "tweets" to be large. small text has it's place with small notices, copyrights, *detail notes, etc. Mar 23 '12 at 20:33
  • 1
    also it doesn't help that your basing you argument on newspaper body type cites from 1945 and that we are not talking about body copy. Mar 23 '12 at 20:37
  • I don't really want to get in an argument here. It's a well known fact that modern (post 2010) web sites have typically 15px or 16px base font size due to improving monitors. I can live with an "artistic" argument, you are the designer and I will not let tell you how to do your job, essentially. I posted 3 relevant, modern well known articles to support my point. Nothing from 1945 or printed fonts. If you want to use small fonts, do so. I don't have to find it legible though :-/
    – Sklivvz
    Mar 23 '12 at 21:22
  • Wikipedia has basically everything at 13px...
    – Sklivvz
    Mar 24 '12 at 14:49
  • @Sklivvz Wikipedias footer is 11px, some other <small> type text is at 11px, so if you are appealing to them then Sean seems to have gotten it right. Also the modern approach to web design is mobile-first and responsive layouts, monitors haven't really been improving at all since people started using netbooks because you code for the lowest common denominator. For points of reference from the modern web: Twitter Bootstrap copy is 13px (<small> seem to be the same size), Quora go down to 10px, HTML5 boilerplate sets <small> to 9px.
    – Kit Sunde
    Mar 24 '12 at 21:29
  • OK, Wikipedia's footer is 11px. A lot of important elements, like the user names, the tags, basic interface elements, are smaller that 13px on the Skeptics design. Not so on Wikipedia.
    – Sklivvz
    Mar 24 '12 at 21:34
  • @KitSunde: Basically all fonts on the home are less than 13px. The only exceptions I can see are the titles and the numbers. Also, most fonts are less than 12px.
    – Sklivvz
    Mar 24 '12 at 21:50
  • 1
    @Sklivvz For what it's worth, I'm not really arguing against your point. I was just curious to see if Wikipedia was all 13px. Looking at some other SE sites (stackoverflow, scifi.SE, english.SE) it seems they use larger fonts. I have perfect vision so it doesn't affect me, but my dyslectic boss can't read anything smaller than 12px. I'm not sure if it's appropriate to have >= 12px font in all cases, but I don't have a strong option either way.
    – Kit Sunde
    Mar 25 '12 at 13:09

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .