Design Principles - Type Hierarchies

1.

A DPS from Shortlist free magazine.

Thumbnail sketch

Arial STD Black is used for all headlines.

Arial Regular is used as body copy.

Removing hierarchy:

The image of the T was the biggest and most contrasting image on the page.

The orange background of the type box created great contrast just the headings do.

The bold sub headings also create contrast however not as much as the orange.

New layout based on Hierarchy reads easier.

2.

A DPS from VICE free magazine.

Location: Vice Magazine Headlines

Typeface family: Franklin Gothic Trade Gothic Bold Condensed 20

Vice Sub headings

Typeface family: Dolly
Font: Regular Italic

The use of Franklin gothic stands out of the page while the italic creates contrast to the regular fonts used elsewhere.

The Hierarchy arranged to read from the top right. 

3.

A DPS with advert from Shortlist

The advert is the first and last thing you see on the page, the advertisements fund the publication therefore are the most important factor of the DPS.

Shortlist main typeface

Typeface family: Arial
Font: Regular Black, bold, regular and light

FROGGY STYLE

Typeface family: N/A
Font: N/A

MUPPETS MOST WANTED

Typeface family: Etica
Font: Display Heavy

The white on black title of the movie reads first.

'STYLE + GROOMING' reads after due to the contrast of white on grey being less than that of white on black.

The article ends by leading back to the advert.

Hierarchy based on deconstruction

1. Miyuki Zoku - Leeds clothing store

Creating a strong brand recognition by the 3 aspects being the first things to be read.

 Hierarchy:

1.

 2.

 3.

Miyuki Zoku logo

Typeface family: Franklin Gothic
Font: Extra Condensed

 4.

 5.

 6.

 7.

 8.

Black on grey creates contrast.

Courier Normal

2. Two Times Elliot website

The gap between 'Two Times Elliot' and the other headings show it is more important.

Hierarchy:

1.

Maison Light

2.

This image is focused on by its largest thumbnail.

3.

4.

5. 

3. YouTube Homepage

The actual content of the page consists of a logo, a search bar and two options along the top. This design is adaptable as the images of the page change daily.

The red is read firstly over the blue of 'sign in'.

1.

Trade Gothic Bold Condensed 20

2.

3.

4.

5.

6.

7.

1.

The Daily Mirror.

Notice the image used in the advert has been designed to be located on the bottom left of the page to create the effect the reader is holding the product.

This layout creates attention on the adverts, the initial headline will appeal to the reader, leading them to the adverts. An advert to finish upon is more memorable.

Daily Mirror Headline

Typeface family: Interstate
Font: Black Condensed

 Hierarchy re arranged

2.

Telegraph & Argus - Front page

The headline reads first as it is this that will attract a customer first.

I would edit the papers name so it sits horizontal just as the Independent does, this means it more readable when arranged in a newsagents:

3.

The scale of the headline creates the greatest impact.

The use of image as well as bullet points and sub lists create an interest.

The coloured sub heading along the DPS is then as it the second largest aspect of the page.