Fonts on websites
Category: DesignThe modern graphic designer has access to an almost inexhaustible variety of different fonts and font characters which gives him the uttermost liberty and flexibility for text formatting and the design of titles and logos. But not every font, even though it looks good on business cards and stationery, is suitable for the use on the screen.
Fonts have to be rasterised for the display on a screen, which structure is based on small pixels (picture elements). That leads to a so called sawtooth distortion 'cos all the curves and olique objects are pixelated. Especially when small font sizes are in use the phenomenon of merged letters or contracted character spacing will occur. The result is an odd typeface and the text or some single syllables become illegible. In the past the designers tried to avoid this problem by integrating titles, menu items or even whole text blocks as graphic files such as JPG, GIF or PNG. This was good for the legibility of the texts but very counterproductive for search engine optimisation (search engines can only deal with written text), grinding for editing with a content management system or simply not user friendly 'cos the user is not capable of just copy-pasting the text or changing the font size.
The most used font for text in the internet may be Verdana which was created for Microsoft and especially optimised for a perfect performance on the screen. Even in a smaller font size it clearly appears on the screen and is still excellently legible (see figure).
The most sans-serif fonts (e.g. Arial, Helvetica, Geneva, ...) are usable for the internet. Rather problematic are antiqua or roman typefaces (e.g. Times, Garamond, ...), fonts with an increased stroke contrast (e.g. Bodoni, Walbaum, ...) or italic, condensed or extra-thin font styles.
Of course the legibility of a text depends also on the text colour and the colour of the background. Dark text on fair background is optimal — the less contrast you have, the more exhausting the reading might be for the eyes of the reader.




























































































