Slashdot Mirror
What Makes a Good Web Font
SitePoint writes "We've published an article on the way in which fonts are used on the Web. We found that a large "x-height" (the height of a lowercase 'x' in relation to the total height of the font) makes fonts more readable on a computer screen, as does a wide "punch width" (the width of the hole inside letters such as 'o' and 'b'). Helvetica is a good font to use online. The designer's choice of fonts is usually limited by the user's OS, but techniques such as SIFr (example) are allowing Web designers to provide their own fonts."
Personally, I like to change my default font to Verdana. I do this on my website, and in my browser. I simply hate Times New Roman, and am not overly fond of Helvetica either. Personally, I see why in logos and things users may want to use other fonts, but since these are typically images, the problem of users not having a font is a moot point. For the rest of websites, though, typically, most decent websites use a standard font such as arial, verdana, helvetica, or Times New Roman.
While this is extremely close-minded and un-artistic, this is honestly the way I prefer it. I hate it when my browser is taken over by someone else's fonts, cursors, or popups. To me, they're all the same intrusive, annoying thing, and are all on the same level of annoyance.
I do a lot of surfing using a text based browser (Links) on an 80x33 screen, and my guess is that most web site designers never anticipated that type of display. It's nice, however, to be able to read everything using the super-readable screen font generated by my video card, and for the most part it seems to work rather well.
Even with GUI browsers, I tend to override web site fonts with things such as Arial which I know work well on my machine, and which are relatively easy on the eyes.
If a site author really wants to use their own fancy fonts, I think they should create graphics.
Mainframe/UNIX Bit Twiddler and long time Windows/Linux Hobbyist.
The Theorem Theorem: If If, Then Then.
The user often doesn't know that they can change fonts. My wife occasionally does web design for her clients. It isn't her main line of work but sometimes a client wants that as part of the package. Invariably they want pretty fonts. Usually "pretty" is defined as what they personally like. It takes a fair bit of education to convince the client that they should not be specifying fonts, that the viewer should do that. And then it takes a bit of education to show the client how to set the font preference on their browser.
Ha thats not even the worst part! You can provide your own font face src according to CSS2. Read here for more info. Its absurd using javascript and flash when custom fonts are already handled by CSS.
Regards,
Steve
http://www.iliveonyourvisits.com/helvetica/
Arial was a Helvetica clone developed by Monospace way back when font cloning was the cool thing to do. Ideally, it sports the same spacing and metrics of Helvetica, making it a literally perfect substitute for Helvetica. Thus, they're both nearly equally readable on the web and in print, and anyone who tells you otherwise is being a prick.
The problem with most of the Fonts is, that they aren't optimized for Screen. The Article mentions Helvetica as a good Screen Font, personally i have never seen a good aliased Helvetica.
Aliased Text still provides better readability for small Font sizes.
A short List of screen-optimized Typefaces that can be found on almost every System:
serif: Georgia, Times
sans-serif: Arial, Verdana, Trebuchet
monospace: Courier
Since CSS allows you to choose different Typefaces for one Element, the last Font should allways be the "Standard Font".
example:
element {
font-family:Helvetica,Arial,sans-serif
}
If Helvetica isn't installed on the System, Arial will be used. If Arial isn't installed, the Font will be defined by the Browser (in this case the Browsers "sans-serif" Font).
It's also a good Idea to define a font-size for the body Element and then use relative values ("em" values) to set Font Sizes for Headings or similar.
From reading a lot of comments it seems like a lot of people are afraid of really horrible amateurish looking sites will arrive if people had access to more fonts. Why? Sure, some people will do this. And if you don't like it, don't go to their site. Having access to more fonts is only a good thing. It can allow sites to look unique (note, I'm not saying unreadable. There are a ton of fonts out there that are unique and readable). Magazines have unique looks and use a ton of fonts. Why can't the web support such features?
Sure there are some possible negatives, but they don't outweigh the positives.
IMO, this is indeed a Good Thing (TM).
Err.. no. I visited the example page, and found my browser memory usage jumped up by 45Mb, it suddenly began consuming all available CPU cycles and became totally unresponsive. I had to kill the process to close the page.
This isn't exactly what I call progress.
One thing that Microsoft -- or the people they hired -- got right.
Microsoft used to have some web pages for 'Internet/Web fonts'. These included both a collection of TrueType fonts (including Verdana) and some history and other stuff (e.g. a history of Verdana). The pages were up until a year or two ago.
Then, shortly after I commented to a business analyst (read: specifications author) on the suitability of Verdana, including both the high appeal of the font but also the potential risk of using MS intellectual property and the potential for sharing to cease, I found those MS web pages had been removed. I don't know whether they've since been restored or placed elsewhere.
Regarding the history and intent, translating into suitability, of Verdana, a quick google turns up:
http://www.fonts.com/AboutFonts/Verdana.htm
Do you have an example of it working? Netscape 4, IE5 and IE6 were all created when CSS was relatively new (at least in terms of popularity). None of the above implemented all of CSS1, and the developers probably never looked at CSS2. The developers of Netscape 4 were using a JavaScript based style sheet language at the time, and decided to go with CSS at the last minute, which leads me to believe they didn't do anything with CSS2.
Also, at the time, the CSS2 spec was still very new, and was most likely under development whenever these browsers were being developed.
Finally, I've tried it before and it didn't work. Not in any browser. Granted, it's been about a year, but IE hasn't been updated since anyway.
Grammar Lesson: you're is a contraction of "you are"; your means you possess something; yore means days gone by.
Well, let's consider the most common color combination for text and its background: black on white. In a subtractive color system (i.e. print), this is a perfectly suitable practice. The contrast of black on white is as stark and clear as possible, making for good legibility and comfortable reading. However, with an additive color system (i.e. on screen), the color white is produced by mixing red, green, and blue at full intensity. This is why the black on white combination can be overly luminous and too harsh on the eyes to allow extended reading on screen. There is never more light radiating from a screen than when it displays pure white, and this intensity can affect the clarity of fine detail in typefaces and other intricate patterns.
Pardon me for thinking here. A screen actively generates white at full power and black at 0. Paper reflects white at full power and black at 0. Wtf is the difference? Is this guy full of shit or am I missing something?
Please don't tell me paper white is not 100% reflection. It doesn't change the basic fact that white is the most reflective and black is the lest reflective just as white is full light and black is 0. Additive, subtractive (I keep wanting to say subtractitive), it makes no difference, white is maximum, black is minimum.
Infuriate left and right
Hmmm what does Mike Davidson think?
/ sifr.js
He makes it LGPL but obfuscates it to obviously stop reusage?
http://www.mikeindustries.com/blog/files/sifr/2.0
(Should i submit it on the[ ]daily)WTF(.com)?
By the way. Am i the only one who thinks that this JS+Flash combination - for a thing that is clearly a CSS's job - is nearly perverse?
Any sufficiently advanced intelligence is indistinguishable from stupidity.
Why would you need to view Flash on Slashdot? The only time I've ever seen it used here was when I was over a friend's house using Internet Explorer and noticed a lot of articles have annoying Flash animated advertisements associated with them. Kind of ironic since Hemos once said to let him know if their ad provider ever snuck in flash ads.. I guess they've revised that policy.
Ceterum censeo subscriptionem esse delendam.
The one that I, the reader, have chosen.
Uniqueness is not a virtue in design.
we might just have to agree to disagree...
the design decisions I am talking about are not made in a vacuum, they are based on research and feedback and often times take months to achieve even the slightest amount of progress. To think that a user, untrained in typography or any design methods, would be able to choose the "correct" font based purely on - what? - what they like? is a little ridiculous. That isn't to say that the user shouldn't be able to choose their own font - go ahead, screw up the design and lessen your experience - however, I should be able to specify the exact font that I've determined maximizes content delivery.
Design is not a graphic or a layout or a font. It is the interdependence of each element. In that regard, yes, uniqueness is a virtue in design. Different for the sake of different is not.
I could give specific examples (I quite frequently select a paragraph or two and drag them into email or chat windows), but the real issue is that text is deeply fundamental to the way computers behave, and altering the consistency and predictability of such a cornerstone of user interaction is a dreadful idea.