The following are some basic tips to improve your knowledge of web typography. I will get into some more detailed tips in a follow up article. These are some basics that any web designer or web developer should know.
Web Font Selection
Every font has a personality and a unique look and feel to it. Be sure that the fonts you select are appropriate for the website, legible and web safe fonts. There are numerous web font services either free or paid available but be sure that what ever you end up selecting is appropriate.
Web Text Should Be Readable
Ensure that you are able to read text on the website the you are designing without zooming in. Many web users do not actually know how to zoom into a page to enlarge the content. Be sure to take the target audience you are designing for in consideration. For example if the majority of users on a website are elderly ensure that the font is large enough to read without zooming in. Larger font sizes for body copy and headlines are now becoming more acceptable and trendy for web designers to use. The average font size for body copy on a website is between 12 to 16 pixels.
Proper Web Text Leading
Leading or line height as it is referred to as by some developers is the space between each line of text. Leading is important to make sure that the text on your website is legible. Having too much leading can cause the reader to perceive the text as being disjointed and unrelated. There needs to be enough leading to make it easy for readers to disfers between each line and for body appear paragraphs to appear as those they are a unit. A good rule of thumbnail is to add 2 to 5 points larger than the text size for leading. With that said each font has a different appearance and you will have to use your judgement to calculate the best leading for that particular font.
Use Proper Line Length
When line length is too long it makes it difficult for readers to follow and they become frustrated. It leaves the reader hunting for the next line and they can often lose their spot where they were reading. It is extremely important to consider when designing for web. Designing a great web layout and utilizing a grid will aid in creating an ideal space where the content can be placed. Another common rule of thumbnail to use for line length is to only have roughly 12 to 15 words per line or 52 to 78 characters not including spaces.
Contrast and Color For Web Type
Be sure that the text on your website has enough contrast from the background that it is easy to read at length. It is important to consider what purpose the website you are designing for is surving. For example is the website text heavy and are users going to be reading lengthy text on this website? If so ensure that your design choices such as background color and background textures etc. will enhance and not distract from the ability to read text.
Text Shadows and CSS Text Effects
As CSS keeps enhancing our ability to perfect type on the website it has also allowed more room for error. Be sure that all implementations of CSS type techniques such as text shadows etc are done in a manner which does not distract from the legibility of the type. Again there is a time and a place to be playful and experimental with web type but for the majority of websites the type should be highly legible. Be tasteful about the use of drop shadows, glows and other techniques.