CHAPTER Planning for Focus and Flow 5 Desktop Publishing: Chapter 5 ©2008Thomson/South-Western.

CHAPTER

Planning for Focus and Flow55

Desktop Publishing: Chapter 5©2008Thomson/South-Western

Develop understanding of focal point.Learn to establish flow in a document.Incorporate white space as design principle.Explore differences between print and web

design.

ObjectivesObjectives

TopicsTopics

Focal PointFlowWhite SpaceWeb Page Design PrinciplesWeb Page StructureStandard DesignDesign Decisions

3Digital Desktop Publishing: Chapter 5

Visual element in a page design that the viewer notices first

Focal PointFocal Point


Text◦Attracts attention using

Font sizes Color Bold

Images◦Attracts more attention than text◦Bolder colors make more impact◦People images pull the eye more◦Angled images attract more attention than vertical or

horizontal images

Focal PointFocal Point(continued)


The following slides can be used to The following slides can be used to discuss good/bad design examples.discuss good/bad design examples.


Visual path created by arrangements of elements within a page design

Z Pattern◦Design in which eye moves from left to right, down to the

lower left and to the right again◦Duplicates usual pattern of reading text

Other Patterns◦Linear path◦Straight down the page

FlowFlow


Part of the page in which there are no images or text

Doesn’t have to be white in colorPart of the designPurposes

◦Reduces busyness on the page◦Gives reader a chance to “rest”

Sometimes called Negative SpacePositive space is the text and images on the pageObservers see both positive and negative space

White SpaceWhite Space


Design consisted of limited controlRestricted by limits of HTML codeMore options available todayNow designed with rules of their own

Web Page Design PrinciplesWeb Page Design Principles


Focus is always at the top of the page and flows down

White space is more important◦No margins to provide openness◦Add white space by increasing line spacing

Consistent page structure needed◦Get from link to link◦Know where they are going next

Web Page StructureWeb Page Structure


Links on the left sideInformation in the middleImage

◦Top of the page or◦Left corner◦Purpose of image is to provide visual reference

Bottom of page provides copyright or contact information

Standard DesignStandard Design


Good design isn’t a function of softwareGood design is a function of what the designer

needs to considerNew designers should trust their judgment

Design DecisionsDesign Decisions


Answer the follow questions…◦What is the area of a page called that is the first thing that

the reader sees?◦What types of elements make good focal points?◦In a page with text only, what type of enhancements cause

some text to become the focal point of the page?◦What makes an image a stronger focal point?◦What does the term “flow” mean?◦What is Z pattern?◦Why is the Z pattern an important design standard to

remember?◦Once the focal point has been established, what encourages

the reader to continue reading the rest of the page?

Assignments…ReviewAssignments…Review

Answer the following questions…◦What is white space?◦What is negative space?◦How can one “see” negative space more easily?◦How does the design of a web page differ from that of a

printed page?◦Why is it important to maintain a consistent design from one

page of a website to another?

Assignments…Review 2Assignments…Review 2

Use an index card to answer the following:◦Explain the guidelines that you should remember when making

a decision about the focal point on your page.◦Describe a zigzag pattern used in a page design and what

makes it a good design choice.◦Explain why white space is considered a part of the design of

the page and what makes up white space.◦Explain the importance of the placement of white space on a

page.◦Explain the difference between the negative and positive

space.◦Explain the difference in designing for a print page and a web

page.◦Explain the use of someone’s page design as it pertains to

copyright law.

Assignments…Assignments…

CHAPTER Planning for Focus and Flow 5 Desktop Publishing: Chapter 5 ©2008Thomson/South-Western.

Documents

Transcript of CHAPTER Planning for Focus and Flow 5 Desktop Publishing: Chapter 5 ©2008Thomson/South-Western.