A Neopian Web Design Treatise: On Text by oddhatter |  |
Untitled Document
A MESSY DESK - In the last two sections of my "treatise", I discussed the
use of colour and images, two aspects of a site's design that factor largely
into its aesthetic value. However, there is yet another factor that is often
glossed over - the use of text. I'm not referring to text as in "writing", but
rather in a typographical sense - the usage of fonts, font sizes, and other
such things.
On Fonts and... Fonts
A typeface is an alphabet (and other characters) set in a particular design.
A font is basically, computer data that transforms text into a certain typeface.
This is by far the most obvious aesthetic aspect of site design involving the
use of text. When it comes to font choice - there is one major thing to consider
- is it legible?
In order to explain this further, I will discuss font classes for a moment.
There are a number of classes that all fonts fall into, but the most important
are those of serif fonts, sans serif fonts and decorative fonts.
Times New Roman is a Serif font(old style,
proportional). |
Courier New is a Serif font(monospace).
|
Georgia is a Serif font(proportional). |
Arial is a Sans Serif font. |
Verdana is a Sans Serif font(proportional).
|
Lucida Console is a Sans Serif font(monospace).
|
Note: the fonts used are Windows based and may not appear if you do not
have them installed - although you probably do. The words in parentheses refer
to sub groupings of that particular font.
A "serif" refers to the little strokes added at the tips of certain fonts,
such as Times New Roman. Typographically, it allows for visual continuity between
letters, making reading large amounts of text easier. This however, mostly applies
to printed works, although it is something to keep in mind if you believe people
would like to print out your work to read. As I suggested in my first article
however, it is easy to create a print friendly version of any content your visitors
may want to read and simply link to it.
Alternately, a sans serif font is one without serifs, such as Arial and Verdana.
Sans serif fonts are easy to read on computer screens, especially those that
are also proportional fonts. A proportional font(such as Verdana and Times New
Roman) is spaced proportionally, which means that each letter is spaced according
to its width. For instance, the letter "i" will take up less space than the
letter "h". The opposite of proportional spacing is monospace, where every letter
takes up an equal amount of space. Proportional fonts tend to be easier to read
than monospaced ones.
Two fonts that are generally known to be good for screen reading are Verdana
and Georgia. Verdana, for instance, is the font used for text in the Neopian
Times. Georgia provides a fancier, less plain look, without sacrificing legibility.
On that note - decorative fonts should generally be avoided for site content
for the obvious reason - they are often difficult to read. Like I have mentioned
many times before, a website that looks good but cannot convey its content properly
is ultimately a failure. As such, as tempting it is to use fonts that look like
Middle English script, cursive handwriting, anything funky looking, or any thing
else along those lines, please save them for headers and titles.
On a more personal note, Comic Sans Serif (it falls into the miscellaneous/decorative)
should be a font that is used sparingly, if at all. Yes, it used to be a cool
font, but it has been overused, exploited, and unfortunately, is distinctive
enough that it is rather obvious when used. On the other hand, it is difficult
to overuse a font like Verdana, merely because it is really a rather plain font.
Give them an option!
Something that most people forget is the ability to specify a number of fonts
that can be displayed in case the font of choice is not installed on the viewer's
computer. For instance, instead of specifying "verdana" as a font, you can also
specify "helvetica", its Mac equivalent, and "sans serif", its font group. In
the last case, by specifying "sans serif" - if Verdana is not installed on the
viewer's computer, the browser will select a font from the same font group.
<font face="verdana">
this specifies "verdana" as a font |
<font face="verdana, helvetica, sans serif">
this does the same thing, and adds a few backup fonts |
Similarly, although not usually necessary, if you are fond of very small font
sizes, you may want to provide a large text version of your site for those that
may be a bit hard of seeing.
Content, content, content.
Naturally, your text and font choices should be dependent on the content of
your site. This, however, does not void the earlier point I made about not using
decorative fonts for site content. Rather, decorative fonts(you know, those
cute or fancy or spiffy or swirly fonts) should be saved for titles and the
such. It should be obvious however, that a swirly, Renaissance-ey font would
not suit a pet page belonging to a depressed, black clad Battledoming pet. Nor
would a font reminiscent of Halloween flyers be appropriate for a pretty pink
Acara who enjoys visiting Faerieland in her spare time.
A Neopian Phenomenon?
This is something which I see more often on Neopets more than anything else,
almost to the point where it seems to be a strictly Neopian phenomenon. And
not in a good way. Glowing text. Yes, those ubiquitous chunks of "glowing text"
that plague user lookups and shops like the... plague. Really, it is so over
used, it is no longer cool (whether it ever was is questionable). Right now,
it is about as original and mind blowing as fringe jackets and polyester flared
pants. Above all, it is rarely easy to read. This is not a matter of sacrificing
legibility for aesthetic value or vice versa - it is neither. In small amounts,
such as in a short signature, it may be tolerable. Otherwise, plain text really
isn't that bad.
That's about as much as I can summarise on the use of fonts for web design.
Choosing the right font can be as important, if not more so, than choosing the
right images and colours for your site. Despite this, however, it is a topic
often ignored in favour of more "interesting" or "artistic" aspects of web design.
Either way, I hope you liked it - tune in next week(or the week after) for more
of my web design-y rantings.
Next time: A Neopian Web Design Treatise : On Accessibility(more on
it.)
|