Sunday, 18 April 2010

Bold Typography (Uses+Inspiration+Free Fonts)

Bold Fonts:

Bold fonts have always been popular in print design and advertising, but can often be under-looked in website design. However, bold typography is a great way to give designs a little extra punch and can do wonders for your image. Bold typography is all about creating impact, but it’s important to remember to direct that impact appropriately. Don’t just stick in huge welcome text if it’s going to detract from important content. Large, bold fonts can really grab your visitors attention, but that doesn’t mean that writing out bold text will automatically look professional. It’s not about the font, but what you do with it!

Styling Bold Text:

The examples below show how a little font styling can really make your bold text stand out. This kind of styling is very easy to do, but the attention to detail is what will do wonders for your overall impact.
bolde1 Bold Typography (Uses+Inspiration+Free Fonts)
bolde2 Bold Typography (Uses+Inspiration+Free Fonts)

5 Best Free Bold Fonts:

It can be really difficult to find great free fonts, as many look unprofessional or cheap. However, I’ve trawled the net and dug up my personal 5 favorite free bold fonts for you to download. All of these fonts are super professional, and hopefully they’ll give your next design a typographical boost!
AkaChen
boldf1a Bold Typography (Uses+Inspiration+Free Fonts)
boldf1b Bold Typography (Uses+Inspiration+Free Fonts)

Diogene Bold
boldf2a Bold Typography (Uses+Inspiration+Free Fonts)
boldf2b Bold Typography (Uses+Inspiration+Free Fonts)

Baar Zeitgeist
boldf3a Bold Typography (Uses+Inspiration+Free Fonts)
boldf3b Bold Typography (Uses+Inspiration+Free Fonts)

Whoopass
boldf4a Bold Typography (Uses+Inspiration+Free Fonts)
boldf4b Bold Typography (Uses+Inspiration+Free Fonts)

Kabel
boldf5a Bold Typography (Uses+Inspiration+Free Fonts)
boldf5b Bold Typography (Uses+Inspiration+Free Fonts)

Bold Text in Web Design:

Many well designed websites utilize bold typography as an eye catching way to draw visitors into exploring their site and/or services. Done wrong, bold typography can be distracting, ugly and ultimately pointless. However, the 10 sites below are all great examples of how to include bold typography in your designs:
boldr1 Bold Typography (Uses+Inspiration+Free Fonts)
Mike Precious uses great font-choice and subtle lighting/gradients to immediately draw the user’s eye. In this case the audience are first drawn to his work, as this takes visually precedence over the header/menu.

boldr2 Bold Typography (Uses+Inspiration+Free Fonts)
This website uses very bold, large headlines to immediately ‘wow’ the user. The user’s eye is drawn down the page, associating the similar typography near the top and bottom, as well as by the repeated ‘re’ message.

boldr3 Bold Typography (Uses+Inspiration+Free Fonts)
VideoHive use some lovely chunky typography to first explain what their site is all about and then draw people further into the site by encouraging them to learn more and sign up. By using images of text rather than plain text they can apply gradients and drop shadows to their headings to make them even more eye catching.

boldr4 Bold Typography (Uses+Inspiration+Free Fonts)
Alpha Multimedia Solutions creates an instant brand with their huge typographical logo. The way that the logo feeds into the main content area naturally draws the users eye downwards to explore their web page.

boldr5 Bold Typography (Uses+Inspiration+Free Fonts)
Evershed Golf create a central focus to their website, in order to draw attention to their events and popular golf school.

boldr6 Bold Typography (Uses+Inspiration+Free Fonts)
Logo Design Love combine their logo and heading into a bold footer. This instantly creates a brand, whilst letting visitors know what the site is all about.

boldr7 Bold Typography (Uses+Inspiration+Free Fonts)
Helvetireader uses a bold, bright heading to give personality to what would otherwise be quite a minimalist layout.

boldr8 Bold Typography (Uses+Inspiration+Free Fonts)
HugeType combines bold typography with a nice photo in order to create a striking header.

boldr9 Bold Typography (Uses+Inspiration+Free Fonts)
The Autumn Film push bold typography to poster like proportions. The white on red contrast is really striking, and really captures your attention.

boldr10 Bold Typography (Uses+Inspiration+Free Fonts)
Giant Creative also create a central focus to their website, through a use of elegant fonts and subtle background patterns.