5 Typography Tips For Good Web Design


By , March 23rd, 2013 , Tags: , 0 Comments

Typography doesn’t mean font selection.Typography is about Visual Hierarchy, Alignment, Readability, and Communicating the content. All of those things make it easier for a user to follow the flow and understand the content.

It’s possible to create a wonderful design without the use of images at all. we can create elegance simply with typography and white space.

Elements of typography

1. Learn the Basics

Your first step towards more effective typography is to learn a bit about the art. If you’re unfamiliar with it’s concepts, you might think that typography must be a fairly simple discipline.
In reality, typography is quite complicated and is as much science as it is art.

The anatomy of a typeface involves very specific jargon, precise measurements and general standards that must be known and respected. As with many forms of design, you can only get away with breaking a rule if you know it well and are doing it intentionally to make a statement.

2. Watch Your Kerning

Kerning involves adjusting the spacing between two letters in a given font.

If you’re not used to looking for kerning issues, the problems may be subtle, but they’re there. By default, many typefaces, especially those with pronounced serifs, can possess inconsistent letter spacing.

3. Be Aware of Font Communication

Thick fonts with hard edges tend to look more masculine and manly while curvy, thin fonts appear feminine and girly.

This all may seem a bit obvious, but your typographic skill will improve by leaps and bounds if you are able to take this knowledge out of the implicit and instinctive part or your brain and turn it into explicit and intentional action.

4. Alignment

Alignment is an extremely important concept in typography. For some reason, non-designers tend to instinctively center align everything. In reality, center alignment is the weakest, hardest to read alignment and should be used very selectively.

This doesn’t mean that you should only use left alignment at all times. Just be sure to constantly ask yourself how important readability is vs. the particular aesthetic you might be trying to achieve.

Another thing to be aware of is mixing alignments. No matter which alignment you choose, try to be consistent throughout your design. It’s often (though not always) appropriate to center-align a headline over left-aligned copy, but experimenting with mixed alignments beyond this could result in a visually cluttered and confusing page.

5. Choose a Good Secondary Font

After you’ve chosen a primary typeface, the next step is to choose another font that will accent it. This is as opposed to a font that will conflict with primary choice.
just make sure that they are different enough to prevent visual confusion and that more emphasis is placed on the primary font.

Break the Rules

Remember that these rules are simply meant to be guidelines to help you create great typography. you can break these rules & can try for good typography by your experience & imagination.

Here is some examples of typography websites:

  1. New Zealand Opera
  2. Paravel
  3. Mixture
  4. Blog – Information Architects
  5. Squarespace
  6. Design Week Portland
  7. JJR2012
  8. Summer under the Stars
  9. Rule of Three
  10. How Can I Change the World?
  11. Ros
  12. The Real Awards
  13. Startup Giraffe
  14. Andolini’s
  15. Caava Design
  16. soworldwide.org
  17. BriAbby
  18. Levi’s
  19. zurb
  20. Gareth Lawn
  21. Tapmates





I founded CSS Matter in 2013 with the sole ambition of design, development, creativity and innovation on the Internet, which recognize and promote the best web designers, developers and web users in the world. I'm skilled, talented, creative and very passionate about my work. I like to work closely with people to ensure that each stage of a project goes great every step of the way. I like to ensure that all of my finished projects/work reflect how highly I would like to be perceived. I'm confident that with your ideas and my expertise we can create something that makes us both smile. If you like what I do, and think we could work together then don't hesitate to get in touch with me. Skype IM : cssmatter And Email

Want to write for CSS Matter?

If you're interested in becoming part of the CSS Matter team of authors, please send an email to Manish Salunke. It's best if you already have article ideas in mind – but if you don't, he'll help you find a good topic to cover.



Get Updates On Twitter

Do you want to get real-time updates, interesting web links, site news and announcements via Twitter? Follow CSS Matter on Twitter.



Subscribe to the RSS feed Today

The best way to keep up with CSS Matter articles regularly is by putting the CSS Matter RSS feed into your feed reader.