Wednesday, December 28, 2016

OUGD504 - Design for Screen - Typography

Avenir Next Condensed Regular 

Avenir Next Condensed is used as the default font for all large sections of body copy. It is also used for sections regarding contact information for letting agents. It is a san-serif font that creates an uncluttered and modern finish. Being condensed, it’s narrow bodywidth allows more information to fit into a tighter space. As I wanted to keep the design as uncluttered as possible, having a condensed typeface acts to maximise the white space and allow the images of the house and information on its features to take the centre stage. If then students still want to read more information on the house the typeface is still legible but not overbearing on the overall look of the design.

The lean proportions of the condensed typeface also makes it appear more stylish and sophisticated than its wider counterparts which is what I wanted the website to exude.

Avenir Next condensed is used on 61 of the top million sites on the web and is ranked #1,231.

( http://www.fontreach.com/ )



Din Alternate Bold

Din Alternate Bold is the primary typeface of the website used on its titles, sub headings, labels and stand out pieces of information. It is a striking and modern looking san serif typeface that fits in well with the overall aesthetic of the website. It too has a slimmer bodywidth making it appear more sleek and modern.

Din Alternate is used on 28 of the top million sites and is ranked #1,972.

(http://www.fontreach.com/)

Andale Mono 


Andale Mono is used sparingly on the website for sections such as ‘House Features’ and on the login page to create a subtle area of interest that attracts the users eye. This type could be seen as tacky and excessive if overused however when dotted around in small areas the font looks effective and engaging.

Andale Mono is used on 1221 of the top million sites and is ranked #173.

(http://www.fontreach.com/)



Regarding font size I used 12pt and above so the text was clearly legible at all scales. 

'16-pixel text on a screen is roughly the same size as text printed in a book or magazine; this is accounting for reading distance. Because we read books pretty close — often only a few inches away — they are typically set at about 10 points. If you were to read them at arm’s length, you’d want at least 12 points, which is about the same size as 16 pixels on most screens' 

https://www.smashingmagazine.com/2011/10/16-pixels-body-copy-anything-less-costly-mistake/

therefore for the important information on the page I used a point sixe of 16 pixels or above. 

No comments:

Post a Comment