View
218
Download
0
Category
Tags:
Preview:
Citation preview
1
Reader As Artist
Janet M. Beyersdorfer, Ed.D CCSD #21
2
Author’s Tasks
Understand information
Establish audience
Simplify message
Integrate graphic and text elements Garcia, 1997
3
Comments on the next slide
The native reader of English will automatically look first at the upper left corner--less attention is paid to the remaining part of the page.
4
Reader Attention
35 % 25 %
25 % 15 %
X
Smith & Yoder, 1998
5
Eye Movement
Size of elements
Placement of elements
Presence of color
Content
Garcia, Eye Track Research, 1990-91
6
Comments on the next slide
Notice how your eye is drawn into the center of the photo on the next slide.
7
8
Text Elements
9
* Major Ideas
* Memory Hints
* Few Items per Page
* Bullet Listing
10
* Important Details
* Add Interest & Clarify Ideas
* Few Items per Page
11
* Bold * Italics
* Color
Styles
* Underline
Emphasis & Attention
12
Comments on the next slide
On the next slide notice how the text is placed on an angle, the colors chosen and the two sizes of font.
13
Fonts
Serif- has “flags”on a letter, draws eye along the text’s line
San Serif-- excellent for titles and captions
Script- very hard to read use
sparingly
Novelty- often used for
logos
14
Legibility
Ability to recognize letters and words
15
Emphasize Ideas
* Using rules not by underlining
* Using boxes
* Using italic, not bold
16
Size
Learn how now!
Learn how NOW!
Learn how NOW!
17
Color and Shape
Emotions
18
Content CuesVisual differences
ShapeDirection
SizeColor
19
Be Aware of the Z
On the next slide, as your eye finishes the first line the pencil draws the eye from the upper information to the information on the lower lines. Color is also helpful. Can you see the Z in the slide design?
20
Arrangement
Balance Proportion Space
21
Text Selection
* Usually two fonts / two styles / color
* 18--24 pt recommended body copy
* Double size at each heading level
22
Readability
Process blocks of text quickly and easily
* Serif
* Align left
* Avoid creating widows and orphans
* Use italics (not CAPITALS or boldface)
23
Text Wrapping
Text wrapping a graphic makes it difficult for a reader to smoothly read the information and process it . There are a variety of ways to wrap text around a graphic. All slow reading speed and influence comprehension.
24
Graphic Selection
* Clip Art
* Drawing and Painting
(* Animation, still photography and video)
25
Graphics
Promote thinking and increase learning
Visually informative not
Prioritize and emphasize information
26
ReferencesGarcia, M. (1997). Redesigning print for the web.
Indianapolis, IN: Hayden Books.
Flanders, V. & Willis, M. (1998). Web pages that suck. Alemada, CA: Sybex
Hyerle, D. (1996). Visual tools for constructing knowledge. Alexandria, VA: ASCD
Meyer, E. (1997). Designing infographics. Indianapolis, IN: Hayden Books.
Moline, S. (1995). I see what you mean. York, Maine:
Stenhouse Publishers.
27
Reinking.D, McKenna, M.C., Labbo, L.D. & Kieffer, R.D. (Eds.) (1998). Handbook of literacy and technology: Transformations in a post-typographical world. Mahwah, NJ.: Erlbaun Assoc.
Schriver, K.A. (1996). Dynamics in document design. New York: John Wiley & Sons.
Smith, I. & Yoder, S. (1998). On the web or off. Eugene, OR: ISTE.
28
WEB References
Burbules, N.C. (June 14, 1998). Rhetorics of the WEB: Hyperreading and critical literacy [On-line]. Available: http://www.ed.uiuc.edu/facstaff/ burbules/ncb/ papers/rhetorics.html
Nielsen, J. (June, 1996). In defense of print. [On-line]. Available: http://useit.com/ alertbox/9602html
Recommended