Skip to Content

CCG: Serifs or sans-serifs?

5 replies [Last post]
eyerouge
eyerouge's picture
Offline
Joined: 07/30/2008
test.nystorlek.png

There seems to be a general idea out there that states that serfied fonts are easier to read when it's a lot of text. Reason is said to be that we'll form words easier and read them, instead of reading the text letter by letter.

At the same time some suggest that readability is better for sans-serifs when the text is shorter and/or in less than ideal situations like i.e. low resolution, dark setting, etc.

Questions:

1. Do you guys have any idea what's true and what's not, and could you point me into the right direction, to some sites, articles, research and science about this very specific issue?

2. Even more pressing: What should we use for our (yours as well) CCG? Please check it out at http://www.bgdf.com/node/659 and compare that to Gary Simpsons original >> http://www.bgdf.com/node/66 Keep in mind these cards will be playable both online as well as IRL.

Personally I lean towards Garys solution, but it would be nice with some input from you.

ilta
ilta's picture
Offline
Joined: 12/05/2008
It's hard to compare these

It's hard to compare these because one has Lorem Ipsum text, and the other has real text. Additionally, they are different sizes.

But in any case, I think the issue here isn't serif vs. sans serif, but the lack of contrast between it and the background, particularly given the fact that the background has a design (or even a number) on it. Note, for comparison's sake, Magic: The Gathering cards, which use, at most, a uniform mottled background, and black text. If the information conveyed by the skull or number is important, move it somewhere else. Otherwise, just get rid of it and re-examine your color palate.

I like the designs otherwise, though.

55cards
55cards's picture
Offline
Joined: 10/11/2008
Justified vs unjustified

It's also worth pointing out that the serif example is justified, and the sans-serif is unjustified.

Apart from being a bit old-fashioned (IMHO), full justification does not improve readability (especially with short line lengths of 5 or 6 words) because the word spacing can become erratic.

The old argument that serif fonts are 'more readable' probably stands for large amounts of text, but for short burst there is not much in it, and other concerns (text size, justification, line spacing, font/background colour contrast) are far more crucial.

Personally, I prefer the sans-serif treatment anyway, but that's more of an aesthetic reaction than a technical one!

MatthewF
MatthewF's picture
Offline
Joined: 07/22/2008
There's so, so, so much more

There's so, so, so much more to it than serif vs. sans serif. There are a ton of things that affect text legibility, including x-height, counter and bowl size, stroke thickness and variation, serif size and type, and more.

As a very general (but useless on its own) rule, for long passages of text (and there are no long passages of text on a card... I'm talking about paragraphs here), serif faces are easier to read than sans serif faces. Beyond that, there are far too many variables to generalize. When you're looking at serif typefaces, for example, an old style/humanist serif or a transitional serif is likely appropriate for long text, while a slab serif (aka "Egyptian") or, commonly, a modern serif face really isn't suitable.

Google the word "typography" for much more than you'll likely ever want to know. Test face usage in the real world or hire a graphic designer if you don't want to learn it all.

seo
seo's picture
Offline
Joined: 07/21/2008
Black text on light background

It's not just a matter of which one looks better on screen; if you're going to print the cards, there are important technical reasons to avoid the small white (or light) text on a darker background. Any of the samples will result in lots of illegible cards coming from the print shop.

For small text, no matter what font you use, the best (safe) option for commercial printing is 100% black text with overprint if you have any light background. That way you won't have to worry about registration problems.

If you need white text on darker background:
- Avoid small sizes (12pt and up is recommended)
- Avoid fonts with thin strokes. Bold is better.
- Try to use only 2-inks backgrounds.

What do I mean by 2-inks colors?
In most cases, in commercial printing, you'll form all colors from varying amounts of one or more of the 4 printing inks: Cyan, Magenta, Yellow and Black.
Eg: Blue is made with a lot of Cyan and some Magenta. Light blue will use little or no Magenta, probably less than 100% Cyan. Dark Blue might have some Yellow or Black (or both) added to darken the Cyan+Magenta combination.

Colors are applied one after the other. For color printing, this is usually achieved with a press that is actually several presses one next to the other, and paper goes from one color to the next, leaving the press once the last color is printed.
Printing is based on how oily inks reject water. Water (in small quantities, but water nonetheless) is involved in offset printing, and paper absorbs water. Paper is made of cellulose fibers, which are like rods that, when wet, grow in diameter (though not in length, but that's getting too specific for this post). In short: though the size change is relatively small, by the end of the printing process a paper sheet is larger than it was before being printed (it will shrink back to its original size once the paper dries). We're talking of probably just 1/16 of an inch for a 40" sheet, but keep in mind how thin the strokes of a 10pt character are.
This has nothing to do with finding a good printer. This is what happens WHEN you have a good printer, and he uses good quality paper. Card stock will stretch less, but there still might be some stretching.

So, white on cyan is just one ink, and all this paper stretching problem doesn't affect it. White on Blue means perfect alignment between a white on Cyan text and a white on Magenta text. White on dark blue means perfect alignment between Cyan, Magenta and Black y required.
Same goes for the brown background in your card samples: it's made of either Cyan, Magenta and Yellow (with a bit less of Cyan and a bit extra of Yellow) or Magenta, Yellow and some Black (again, with more Yellow than Magenta). Or it could be done with all four inks. My point is: you need perfect alignment of at least three plates to have white text on that background. And the stronger strokes of your text are less than 0.02 inches thick.

Enough ranting.

PS: I like the Times one better.

eyerouge
eyerouge's picture
Offline
Joined: 07/30/2008
Thanks for all the great

Thanks for all the great input! Interesting to hear stuff we didn't take into account - as always you guys have delivered useful insights, and it's a pleasure being here.

We'll soon release the original template file, think it will give people the opportunity to play around, not that it would automagically fix things, but might still generate interesting ideas.

Syndicate content


forum | by Dr. Radut