Website style guides real

4
margins, 50 px (logo location on extended pages) 548 px (centeral content area) 50 px (navigation bar) 341 px (moving thirds which contain images and iconography for each walk) 682 px (remaining thirds are always map of the walk and links to other pages) Grid Style Guide

Transcript of Website style guides real

Page 1: Website style guides real

margins, 50 px (logo location on extended pages)

548 px (centeral content area)

50 px (navigation bar)

341 px (moving thirds which contain images and iconography for each walk)

682 px (remaining thirds are always map of the walk and links to other pages)

Grid Style Guide

Page 2: Website style guides real

Heading: 21 pt light (all caps)Body: 14 pt (lower case)Always white text on a translucent or photographic background.

Font Style Guide

Page 3: Website style guides real

OF THE

NORTH NORFOLK COASTAL ADVENTURES

Logo Size and ApplicationStyle Guide

Full page logo at 355 px by 342 px.

OF THE

NORTH NORFOLK COASTAL ADVENTURES Small logo for use in the

top right corner of all other pages.77 px by 75 px

Always on the bottom of every page at the same scale. 100 px by 102 px.

Page 4: Website style guides real

Buttons Style Guide

The icons for the areas of information will sit along a vertical axis in the middle of each thirs depending on the relivant walk.

These will all be hover buttons, from which translucent rectangles of text will extend as shown on the far right.

Some of these will also link to extarnal websites when clickes. This would be relivent to things like travel where it might link to a train time table.

The buttons in the navigation bar at the bottom will all be active in the sense that when you are on the corrisponding page the relivant button will be the most opaque.