When designing your site, a common mistake is to spend all your time working on nothing but content and layout. But, as in most things, it is always the little things that make you stand out from the crowd.

Typography is, when you think about it, one of the most important design decisions you can make on your website. Sure, your color scheme, layout, and logo are just as (if not more) important, but remember that the whole point of getting visitors to your site is for them to read your content, and that means that more than anything else, your site visitors are going to be looking at your typography near-continuously. So you can see why choosing a good typographic style is extremely important for every web designer.

There are a few main issues that you have to keep in mind when dealing with typography:

Minimalism

Never use more than three different fonts on a single page, unless you have an exceedingly good reason to. One for headers, one for subheadings, and one for content is more than enough.

Serif versus Sans-Serif

Serif fonts do not scale to smaller sizes well, so copy should always be in a sans-serif font. Headers are a different matter, so long as they are larger type.

Using CSS

Site-wide typography decisions should always be maintained at the stylesheet level. This is important for three main reasons.

• Good SEO technique requires content keywords to be coded semantically–headers should use <h#> tags, and emphasized content should use <em> tags. By keeping typography out of the html code, you make it easier to code semantically, and to update for keyword-related issues later on.
• Your pages render better. On dial-up connections, if you don’t use CSS, then every time a new page is loaded, the browser has to read the style commands over again, and so momentarily, your site will look very different from how you wish it to appear. With CSS, this problem occurs only on the first page load; every subsequent load uses the same style sheet, and so the problem never recurs.
• Bandwidth conservation & load times: by using CSS for typography, you save on bandwidth costs and your pages will load faster as a result.

Font-family attribute

It is sometimes tempting to resort to all kinds of fancy font faces, but remember that the end user will only see the fonts that they have installed on their computer. As a consequence, you must always remember to cite a number of fonts, from your first pick to your last, ending with a description of the font-family you prefer. For example, you might use the following in your stylesheet:

h1   { font-family: Garamond, Georgia, serif; }

body { font-family: Verdana, Arial, sans-serif; }

Column width

Dictating a maximum column width is useful for many reasons, but the most important one is that when you have a large block of text, it is much easier for the eye to read the text in narrower columns than in columns that take up the entire monitor width. Magazines and newspapers limit column width for the same reason you should: the human eye finds it much less stressful to read in smaller blocks of text.

Browser variability

Remember that how your site looks on your computer is not necessarily how it may look on someone else’s machine. Every browser may show typography differently; that’s why you have to pay careful attention to your css specifications.

Of course, this is certainly not all you’ll ever need to know about typography. But it is a start that will not only make your site more user-friendly, but also will help to keep more visitors coming back. After all, that’s what being a webmaster is all about.

Posted by Eric Herboso

Did you enjoy this article? If so, then subscribe to my RSS Feed.
There are more resources available at our On-line Webmaster Resource Center.

Good project management software is hard to find, but thankfully, after you read this, you won’t have to go looking very far. That’s because our group here at Omnistar Etools has already found the ultimate project management software: 37signal’s Basecamp.

Basecamp has everything you could ever want: an ease of functionality that allows even the most computer illiterate to understand and participate, an intuitive interface that allows and even encourages clear communication, and a beautiful design that will get you bonus points every time you use the software with clients.

Using Basecamp makes it very clear how closely good communication is linked to completion of projects on time and as ordered. With Basecamp, everything is so easy to use that poor communication on a project is nearly impossible. And the tools used to track hours spent on a project makes it clear exactly how efficiently work is coming along on each type of task.

Perhaps more impressive is the ability to use Basecamp not just with your employees, but also with clients to keep them abreast of projects as they’re being worked on. Keeping clients ‘in the loop’ has never been so easy: you can upload files for viewing, and they can easily leave comments that can be replied to at will. And since the site design is fully customizable, you can maintain the look and feel of the rest of your site.

But by far the best thing about Basecamp is the main Project Overview page. There, you can see exactly how everything is progressing, with upcoming deadlines, details of who is responsible for what, and reports of how many hours each person has spent on doing their assignments. Plus, it even creates an RSS feed, so you can be informed at your convenience or even on the go via PDA or cell phone!

Basecamp truly does offer everything you’ve ever wanted in project manangement software, and then some. If you haven’t used it before, you will be amazed at how simple a thing as ease of use will streamline your project completion. We use it here at Omnistar Etools every day, and it truly is something that we cannot imagine going without. It truly is the last project management tool you will ever need.

Posted by Eric Herboso

Did you enjoy this article? If so, then subscribe to my RSS Feed.
There are more resources available at our On-line Webmaster Resource Center.