Typography The Dark Arts Of Web Design

When it comes to typography, it seems like the dark arts of Web Design. It is quite fascinating really as typography is rather simple yet complicated at the same time. You see, most people tend to notice only when typography doesn’t seem right. Even though you can tell that it isn’t right, perhaps you can tell how it is supposed to be?

To clarify, typography is just about everywhere. We see it in ads (websites, TV ads, magazines), stores and malls, billboards, and even on clothes, bags, and other daily things. Even if it doesn’t look right, usually you can piece together what it is supposed to be even if your not a web design guru that knows all the names of each typographic font. What you should take away is the ability to choose the most appropriate typography in order for you to avoid losing the overall strength and impact of your Web Design.

[tweetlock id="542"]

[caption id="attachment_540" align="aligncenter" width="271"] How To Easily Create Chrome Apps Using HTML5 & CSS[/caption]

[caption id="attachment_553" align="aligncenter" width="300"] Instant Download[/caption]

[/tweetlock]

We hope this article will help you better understand typography and learn some basic concepts that will assist in better Web Design.

Picking The Right Fonts

Back in 2014, the most popular fonts in typography used were the following:

• Pacifico or BlackJack (Handwritten fonts)


• Chunk Five (Bold type font, an excellent choose for demanding attention)


• Quicksand (Flat font)


• Mixed Fonts (Sometimes mixing up handwritten fonts, flat fonts and bold type fonts go together well in web design)

In a survey conducted including 24 established web designers over 14 different countries listed the

Top 10 most loved web design typography fonts

as the following:

• Helvetica


• Arial


• Georgia


• Gotham


• Myriad Pro


• DIN


• Futura


• League Gothic


• Cabin and Corbel

Those are perfect choices for various Web Design projects and can be used in heads, sub-headings, and body text due to how balanced and elegant the smooth, no fuss lettering provides.

The main points to keep in mind is to choose fonts that are readable and beautiful but overdue it on the fonts. Stick with around 2-3 different fonts in a web design layout. There are so many legit free fonts that seem perfect fit for your web design, typically anything over a maximum of 4 fonts becomes cluttered and unprofessional looking. Focusing on the purpose of the design will help in narrowing down your favourite fonts that match.

Size Matters

Deciding which font is for the headings, sub-headings and body text is the starting point for any web design projects. Size should be incremental. It is recommended to start large and scale smaller. Body text should be the smallest and your headline the largest. Even within this hierarchy, you should analyze and decide which message/text that needs to be amplified.

Beyond using font size, you can also use colour, spacing and weight to establish your hierarchy, crafting a logical hierarchy in your web design can make your design easier to read and convey the message more clearly.

Remember to be mindful of margins. Don’t make foolish mistakes with alignment such as not leaving enough room between your words. Make sure there are enough spaces between letters, lines and paragraphs. It is a good idea to make sure your web design works and words are legible in a color that is easy on the eye.

Sense & Purpose

These are the fundamental things that you should understand regarding typography and is considered by many in Web Design to be an art in and of it, regardless it still needs to make sense. Only practice, research on trends and techniques will help you master this craft and ultimately provide better web design yourself and clients.

What are your favorite typography fonts? Have you got any web design tips and tricks to share with other graphics designers out there?