10.04.2018 Views

design3

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

Typography<br />

153<br />

Figure 4.32. KRG typography in the logo<br />

For the headlines and body copy throughout the KRG site, is was important to chose a quality web<br />

font that was sans serif to maximize legibility, and to have a few different weights. Source Sans Pro<br />

Bold was used for the headlines and Source Sans Pro Light was selected for the body text. This is<br />

mainly because KRG wanted to maintain a modern, sleek look. The body text needed to have an<br />

open, inviting feel, so the line height was increased for legibility and to lighten the mood of the<br />

site.<br />

The home page needed to draw the visitor in with the latest news, while offering other content to<br />

explore. It also needed to be informative, covering different procedures and providing price information.<br />

Certain elements, such as prices, could be made to stand out using special CSS classes dedicated<br />

just for those purposes. Headlines needed to be clean and bold, with contrasting supportive<br />

text.<br />

Figure 4.33. Source Sans Pro font used on body copy<br />

The fonts themselves were implemented using @font-face, and the fonts are hosted at the site to<br />

provide maximum consistency. As you can see in Figure 4.34 below, the text has plenty of room<br />

to breathe. The menu has plenty of contrast, the news slider has a bold headline that gets your attention<br />

while making it easy to read. The text shadow in the callout box below the slider has a text<br />

shadow applied to it with CSS, which adds a slight variation to the rest of the layout.

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!