page design / style guide importance design principles design elements

21
Page Design / Style Guide Importance Design Principles Design Elements

Upload: lucinda-hicks

Post on 23-Dec-2015

221 views

Category:

Documents


1 download

TRANSCRIPT

Page Design / Style Guide

• Importance

• Design Principles

• Design Elements

Importance

• First impression is purely visual

• Sloppy format alienates reader

Good Page Design

• Helps reader understand your information

• Helps reader locate information

• Helps reader notice important content

Basic Design Principles

• Proximity• Alignment• Contrast• Repetition

Proximity

Use white space to place related items close to one another

GroupedNot Grouped

Martina Aleverez

AAA Consultants, Inc

4357 Evington Street

Montclair, NJ 50517

(416) 232-9999

Martina AleverezAAA Consultants, Inc

4357 Evington StreetMontclair, NJ 50517

(416) 232-9999

Proximity

White space gives shape to document and orients the user

spaceformargins

space forillustrations

space forheadings

Alignment

Arbitrary placement of text causes confusion for the reader

Alignment RelationshipArbitrary Placement

Martina Aleverez

AAA Consultants, Inc

4357 Evington StreetMontclair, NJ 50517

(416) 232-9999

Martina AleverezAAA Consultants, Inc

4357 Evington StreetMontclair, NJ 50517

(416) 232-9999

Alignment

Grid lines can be used to create the page layout

Contrast

Use contrast to establish hierarchy and focus

Contrast EmphasisNo Contrast

Martina AleverezAAA Consultants, Inc

4357 Evington StreetMontclair, NJ 50517

(416) 232-9999

Martina AleverezAAA Consultants, Inc

4357 Evington StreetMontclair, NJ 50517

(416) 232-9999

CAUTION: Don’t overdo graphic contrast !

Contrast

Taylor each paragraph to its purpose

• Long paragraph: no more than 15 lines– Information closely related – history, background

• Short paragraph: – Complex material

– Step-by-Step instructions

– Emphasizing vital information

• Instead of indenting short paragraphs, separate them with a blank line

Contrast

Use lists for easy reading

• Advice or examples• Conclusions/recommendations• Criteria for evaluation• Errors to avoid

• Material for a procedures• Equipment in a procedure• Parts of a mechanism• Steps in a sequence

Items you might list:

Contrast

Select type that is easy to read

Arialabcdefghijklmnopqrstuwxyz1234567890

Times New Romanabcdefghijklmnopqrstuvwxyz1234567890

Serif Sans Serif

Avoid all Caps

TYPE IS TO READ

Type is to read

48 point

36 point

24 point

18 point

14 point

12 point

10 point

8 point

posters

presentation slides

titles

text

footnotes

Repetition

• Same grid pattern throughout

• Same type treatment (font, size, color, etc.) for headings, subheadings, and text

Use repetition to unify your communication visually

Repetition Use consistent headings and subheadings

Section headings should be descriptive and parallel

Non-ParallelNon-Descriptive

IntroductionBackgroundMarx GeneratorsLine PulseBeam GenerationTransporting BeamPelletsResultsConclusions

IntroductionBackgroundMarx GeneratorsLine PulseBeam GenerationTransporting BeamPelletsResultsConclusions

ParallelDescriptive

Introduction

Past Designs for Particle Beam Fusion

New Design for Particle Beam FusionCharging Marx GeneratorsForming Line PulseGenerating Particle BeamTransporting Particle BeamIrradiating Deuterium-Tritium Pellets

Results of New Design

Conclusions and Recommendations

Introduction

Past Designs for Particle Beam Fusion

New Design for Particle Beam FusionCharging Marx GeneratorsForming Line PulseGenerating Particle BeamTransporting Particle BeamIrradiating Deuterium-Tritium Pellets

Results of New Design

Conclusions and Recommendations

Long lists with no sub-headings hide organization

Performance ofthe Solar One Receiver

Introduction

Steady State Efficiency

Average Efficiency

Start-Up Time

Operation Time

Operation During Cloud Transients

Panel Mechanical Supports

Tube Leaks

Conclusion

Performance ofthe Solar One Receiver

Introduction

Steady State Efficiency

Average Efficiency

Start-Up Time

Operation Time

Operation During Cloud Transients

Panel Mechanical Supports

Tube Leaks

Conclusion

Performance ofthe Solar One Receiver

Introduction

Receiver’s Efficiency

Steady State Efficiency

Average Efficiency

Receiver’s Operation Cycle

Start-Up Time

Operation Time

Operation During Cloud Transients

Receiver’s Mechanical Wear

Panel Mechanical Supports

Tube Leaks

Conclusion

Performance ofthe Solar One Receiver

Introduction

Receiver’s Efficiency

Steady State Efficiency

Average Efficiency

Receiver’s Operation Cycle

Start-Up Time

Operation Time

Operation During Cloud Transients

Receiver’s Mechanical Wear

Panel Mechanical Supports

Tube Leaks

Conclusion

Design Elements

• Text

• Headings / Subheadings

• Graphics

• White space / grid

• Headers and footers

• Physical features