implement good typography to your website design combination

How To Implement Good Typography To Your Website Design


Closely observe many websites and make a comparison of each in terms of the way each one looks and feels. You will notice that some will stand out looking professional while others just look inadequate. The subtle reason behind this is the way Typography is being applied to a website. Expert designers can see this and have the right sense of implementing good typography to your website design that will make it look very clean and professional. The purpose of this article is to give you stark idea on how to implement good typography to your website design in case you have to do the designing yourself and not hire the services of a professional designer.

Choosing font size

The preferable size of font that your content should adopt is 11, minimum. You may opt to increase it a little bit to size 12 and your readers will be happier. But bigger fonts would require more space, if you don’t have plenty of that you might as well settle with the minimum.

Color combination of fonts

If you cannot decide right away what font colour and background combination to apply, remember that there is only one combination that’s guaranteed to work 100% all the way. That combination is black on white – meaning the font colour is black and the background is white. Although page titles need not follow this norm, but the page content or the body almost certainly should. There might be some slight shading on the background, that’s ok to help strengthen some elements on the page design.

Fonts applicable for the content title and body

The most appropriate font type you can apply to the content title is San Serif. This is perfect for grabbing one’s attention. For the content body always settle for Serif font. The purpose of this is to amend readability while reducing eye stress.

Proper height of each line

Observing the correct line-height for professional website typography would indicate a difference of 7 points compared to the height of the text of the content body. So, if you implement an 11 font size of your text, the line height should be 18. If text is 12, then line-height is 19. Got the idea?

Implement a grid layout of content

In order to make efficient use of space, implement a grid layout of your content. No wonder newspapers are very good at squeezing so much information in limited space because it uses a grid type of layout. It helps if you split your page content in grid format to increase readability. Employ as many columns as you can but be consistent along the way to avoid confusion.

Stave off bad-looking arrangements

Use left-justify in your content only when it is extremely needed. Be certain that the headlines and some parts of the text that are given more emphasis always stay full. Windows and orphans may be unavoidable in the body, but try as much as you can they don’t display in headlines or in parts that are given more focus.

Does back-end font check out?

Browsers will only display fonts that are available in the system when showing a website.  No matter what particular font you decide to use during website designing, the determining factor over what will ultimately show on screen is the user’s installed font in his computer system.  A website designer needs to anticipate the final output of his design on another user’s machine.  It would be much wiser to play safe and to pick only standard fonts since they are very common in all computers.  The likelihood that it will show as-is in other computers is much greater.  If you must use some special font, make it a set of fonts, which include standard fonts to support in case special fonts are not present in a user’s computer system.

Related Posts

the best iphone apps every web designer and developer should have_typographymanual

Typography: Best Practices For A Modern-Looking Website

If painters have their brushes and sculptors have their clay, web designers probably have their fonts. Web designers are known...
, ,

Top 7 Typography Trends to Use This 2018

It’s 2018 and ‘tis the time to be done with the old and in with the new–new fonts and typography,...

Lets Talk