Chapter 8 Document Design 2 Page Layout 1. Creating Visually Effective Documents informed choices...

Chapter 8Chapter 8

Document Design Document Design 22

Page Layout Page Layout

1

Creating Visually Effective Creating Visually Effective DocumentsDocuments

Technical communication is based on informed informed choiceschoices.

Technical Communication Ch 8: Page Layout

Document Design 2

2

Creating Visually Effective Creating Visually Effective DocumentsDocuments

A technical communicator makes decisions about aspects of design based on the audienceaudience and purposepurpose.

Technical Communication Ch 8: Page Layout

Document Design 2

3

Creating Visually Effective Creating Visually Effective DocumentsDocuments

Readers - view a page as a whole unit- scan the page to get a sense of

layout and structure- determine the page’s “road maproad map”

by looking at title, headings and subheadings

Technical Communication Ch 8: Page Layout

Document Design 2

4

Creating Visually Effective Creating Visually Effective Documents Documents

Visual hierarchyVisual hierarchy- shows main items or most important topics in primary headings- shows secondary items in second level of headings or subheadings

Technical Communication Ch 8: Page Layout

Document Design 2

5

Creating Visually Effective Creating Visually Effective Documents Documents

Headings and subheadingsHeadings and subheadings- use same (parallel) grammatical structure- show the structure (outline) of the document

Technical Communication Ch 8: Page Layout

Document Design 2

6

Creating Visually Effective Creating Visually Effective Documents Documents

Electronic pagesElectronic pages

- web pages (often cluttered)- computer screens (shaped differently)- electronic text (fuzzier than print)

Technical Communication Ch 8: Page Layout

Document Design 2

7

Formatting a Page Formatting a Page Effectively Effectively

GridsGrids- vertical- horizontal- combined

see Fig. 8.3 on p. 135

Technical Communication Ch 8: Page Layout

Document Design 2

8

Formatting a Page Formatting a Page Effectively Effectively

White SpaceWhite Space- isolates and emphasizes important elements and areas- keeps related elements together- breaks up regular visual pattern- provides breathing room between blocks of information see Fig. 8.4 on p. 136

Technical Communication Ch 8: Page Layout

Document Design 2

9

Formatting a Page Formatting a Page Effectively Effectively

Adjust the guttergutter- white space between

columns

Use ample marginsmargins- white space around

edges of a page

Technical Communication Ch 8: Page Layout

Document Design 2

10

Formatting a Page Formatting a Page Effectively Effectively

Avoid orphansorphans- a paragraph’s opening line left at the bottom of the page

Avoid widowswidows- a paragraph’s closing line left

at the top of the next page

Technical Communication Ch 8: Page Layout

Document Design 2

11

Formatting a Page Formatting a Page Effectively Effectively

ListsLists- bulleted - numbered (for series or steps)

Technical Communication Ch 8: Page Layout

Document Design 2

12

Formatting a Page Formatting a Page Effectively Effectively

Tips for ListsTips for Lists

Don’t overuse bullets.Avoid using fancy icons.Use punctuations only when

required.Use parallel grammatical

structure.

Technical Communication Ch 8: Page Layout

Document Design 2

13

Formatting a Page Formatting a Page Effectively Effectively

HeadingsHeadings

- size headings by level- choose appropriate heading size- make headings visually consistent- make headings grammatically

parallel

Technical Communication Ch 8: Page Layout

Document Design 2

14

Formatting a Page Formatting a Page Effectively Effectively

Tips for HeadingsTips for Headings

- use no more than 4 levels of heading

- divide the text logically - do not write the first sentence as a

continuation of the heading - do not leave a heading floating at

the bottom of a page

Technical Communication Ch 8: Page Layout

Document Design 2

15

TypographyTypography

FontsFonts- use fonts from only one typeface- be consistent if you mix typefaces- use italics, boldface and all caps

sparingly- avoid going below 12-point type- make headings at least 2 points

larger than the text

Technical Communication Ch 8: Page Layout

Document Design 2

16

Search OptionsSearch Options

• Table of contents• Index• Running heads • Running feet• Electronic searching or

“find” feature

Technical Communication Ch 8: Page Layout

Document Design 2

17

Electronic DocumentsElectronic Documents

• Web pages• Online help• Adobe Acrobat and PDF files• CDs and other media

Technical Communication Ch 8: Page Layout

Document Design 2

18

Style Sheets and ToolsStyle Sheets and Tools

• Organizational style guides• Word-processing and

page layout software• CSS and HTML web pages

Technical Communication Ch 8: Page Layout

Document Design 2

19

Web Style GuideWeb Style Guidehttp://webstyleguide.com/wsg3/http://webstyleguide.com/wsg3/

index.htmlindex.html

Ch 8: Page Layout

Document Design 2

20

Chapter 8Chapter 8

Page LayoutPage LayoutDocument Design 2Document Design 2