You are on page 1of 11

WelcometothePurdueOWL

ThispageisbroughttoyoubytheOWLatPurdue
(https://owl.english.purdue.edu/).Whenprintingthispage,youmustinclude
theentirelegalnoticeatbottom.

Contributors:KarlStolley,MarkPepper,AllenBrizee,ElizabethAngeli.
Summary:

Theseresourceswillhelpstudentsandteachersbetterunderstandtheuseofvisualelementsfor
rhetoricalpurposes.

VisualRhetoric:Overview
ThissectionoftheOWLdiscussestheuseofrhetoricaltheoryandrhetoricasitrelatestovisuals
anddesign."Visualrhetoric"hasbeenusedtomeananythingfromtheuseofimagesas
argument,tothearrangementofelementsonapageforrhetoricaleffect,totheuseoftypography
(fonts),andmore.

Whilewecannothopetocovertheseandmanyothertopicsindepthinthisresource,itwillbe
possibleforustolookatsomeofthecommonvisualrhetoricproblemsencounteredbystudent
writers:thetextelementsofapage(includingfontchoices),theuseofvisuals(including
photographs,illustrations,andchartsandgraphs),andtheroleofoveralldesignincomposinga
pagerhetorically.

Note:Muchofthecurrentuseof"visualrhetoric"isdirectedatanalyzingimagesandother
visualsthatalreadyexist.Thishandoutismeanttohelpyougeneratevisualmaterial.

Whatisvisualrhetoric?

Thetermvisualrhetoricfallsunderanumbrellatermknownasvisualliteracy,whichis
generallysplitintothreecategories:visualthinking,visuallearning,visual
rhetoric/communication(thoughclearlyvisualthinkingandvisuallearningmustoccurinorder
tocommunicatevisually).Thefollowingdiagramillustratestheseideas.Thegraphicismodified
fromSandraMoriarty'sdiagraminheressay,"AConceptualMapofVisualCommunication"and
from"TeachingVisualLiteracyandDocumentDesigninFirstYearComposition"(MAThesis)
byAllenBrizee.
ImageCaption:VisualLiteracy

Essentially,abeginningdefinitionofvisualrhetoricanditsapplicationsareasfollows:

Useofimagesasargument
Arrangementofelementsonapage
Useoftypography(fonts,etc.)
Analysisofexistingimagesandvisuals

OtherOWLresourcesthatarerelatedtovisualrhetoricandthatmayhelpyouunderstandthese
ideasarethefollowing:

VisualRhetoricSlidePresentation
ColorTheorySlidePresentation
UsingFontswithPurpose
DesignanEffectivePowerPointPresentation
HATS(Headings,Access,Typography,andSpace)SlidePresentation:ADesign
ProcedureforRoutineBusinessDocuments

Formoreinformation:

YoumayalsodownloadthepdfWorksCitedandWorksReferencedfrom"TeachingVisual
LiteracyandDocumentDesigninFirstYearComposition"intheMediaboxabove.Thispdf
containsanumberofresourcesonvisualliteracy,visualrhetoric,anddocumentdesignandthe
usesoftheseconceptsincompositionandprofessionalwriting.

Contributors:KarlStolley,MarkPepper,AllenBrizee,ElizabethAngeli.
Summary:

Theseresourceswillhelpstudentsandteachersbetterunderstandtheuseofvisualelementsfor
rhetoricalpurposes.

VisualRhetoric:TextElements
Textissoobviouslyvisualthatitsvisualnatureandpowerisofteninvisible.Whileitmightbe
interestingtolookatthehistoryoftypography,orthewaytypehasbeentransformedby
computers,whatwereallyneedtodoisthilonkaboutwhattypedoes.Let'sconsiderafew
examplesusingsomewordsthatareprobablyunfamiliar<http://www.lipsum.com/>toyouso
thatyoucanbetter"see"thetypewithoutconsideringtheactualmeaningofthewords(though
we'lltalklateraboutwhymeaningandvisualshouldandcannotbeseparated).

ImageCaption:LoremIpsumTextPlaceholder

Evenwithjustthesefourtypefaces,wecanseedifferentpersonalities(howeverlimited),levels
offormality,andevenhintsoftherhetoricalconceptethosemerging(one'scredibility).Novice
designerstendtochoosefontsnotaccordingtotheirrhetoricalsituation,butrathertowhatthe
thinklookspretty,orcool,orwhatever.Butit'simportanttothinkaboutthekindsof
visual/culturalassociationsthatdifferentfontsbringwiththem.Herearethesamefourfonts,
withtextthatappearsvisually/culturallyappropriate:

ImageCaption:Arial,CenturySchoolbook,Dauphin,FuturaXtra
BlackCondensedItalic

Thefirsttwofonts(ArialandCenturySchoolbook,respectively)maynotjumpoutatyouas
havingawholelotofculturalassociationsthat'spartlybydesignthefontsaredeliberately
nondescript(especiallyArial),andthusareusedquitecommonly.Notsowiththefontsusedfor
"MedievalHistory"(Dauphin)and"BigfootCaptured!"(FuturaXtraBlackCondensedItalic).
The"MedievalHistory"textlookslikeourculturalconceptionofMedievalscript.Thatis,the
fontlooksalmostlikeitwashandwritten.Likewise,we'veallseentabloidpapersinthe
checkoutlanesofthesupermarket,announcinginbold,loudtextallsortsofincrediblenews.

Let'slookagainatanegativeexample,wheretheseculturalcodesareignored:
ImageCaption:Arial,CenturySchoolbook,Dauphin,FuturaXtra
BlackCondensedItalicUsedOutofContext

Again,thefirsttwoexamplesmaynotjumpoutatyou.Butif"Indeepestsympathy"wereonthe
frontofasympathycard,itwouldseemcold,callous,impersonal.Withthe"LafayetteTeen
Center,"thatfontfacemaybeappropriatein,say,afundraisingdrive,butprobablynotfor
promotionalmaterialstogetteenstocomethereoffofthestreets(forthat,we'dwantafontthat
wasexciting,moreyouthfulinappearance).The"ChemistryLabReport"examplemightseem
OKatfirstglance(it'sformal,itevokesasenseofhistorywiththeword"chemistry"though
chemistryisarelativelyyoungdiscipline),butitfailsrhetoricallybecauseitdoesnot
acknowledgetheexpectationsofthegeneralaudienceofchemistsorchemistryinstructors.
Takeninthatlight,infact,thetextfor"ChemistryLabReport"looksridiculous.Likewisewith
"MuseumofNaturalHistory"westillseethetabloidheadlineinit,asthough"Overtakenby
Mutants"werethewordswe'dexpectnext!

HeadlineversusBodyText

Keepinginmindtheideaswe'vealreadycovered,thereisanissueofreadabilityinvolvedinfont
choices.Forexample,thisscriptfontisfineforthefollowingheadlinetext:

ImageCaption:LunchMenu

However,let'srepeatthetextfromtheprecedingsectioninthesamefont:
ImageCaption:Scriptblocktext

Now,thatfontmaybeOKifthat'sallthetextthereis.Butcanyouimaginereadingthatforfive
pages?25?Anentirebiologytextbook?Absolutelynot!Thisisspecificallywhywehavefonts
likeTimesNewRomanorArial(thoughtherearefarbetterchoices,inprint,thanthose):they
arecomfortabletoreadforquiteawhilewedon'thavetostraintoreadthewords.

TextandtheWeb

WhennovicedesignersbringsomeoftheirbadfontchoicehabitstotheWeb,theresultscanbe
disastrous.

First,thereistheissueofhowfontsgethandledontheWeb.Youmayhaveacomputerwith
hundredsoreventhousandsoffontsinstalledonit,andasyou'redesigningfortheWebonthat
computer,itmayseemnobigdealtousePosterWangedoodleMediumXtraBold,orwhatever
fontitisthatyou'refeelingisappropriate.However,youmustrealizethatnotallusershavethat
(andmanyotherfonts)installedontheircomputers.SostickwiththesimplestandardforHTML
text:Arial,Verdana,etc.IncertainWebauthoringprograms,youcanalsospecifysimplySan
Serif(noornamentation,likeArial)orSerif(ornamentation,likeTimesNewRoman)inthese
cases,yourWebaudience'sbrowserwilluseacommonfontontheuser'smachine.

Second,followingdirectlyfromthefirstissue,isscreenreadability.Somefontsthatlook
awesomeinprintfailmiserablyonthescreen(andviceversaTimesNewRomanisagreat
screenfont,butdoesn'tworkaswellwhenit'sprinted).Again,evenassumingthecompatibility
issueswejustcovered,fontsmeanttolooklikehandwrittenscriptbecomepracticallyillegible.
AndifthefontusedonaWebpageisntontheuserscomputer,theymayjustgetastringof
boxesornonsensecharacters.

TEXTSUMMARY:
QuestionstoConsiderWhenChoosingFonts

1.Whatkindsofexpectationsdoesmyaudiencehaveregardingfonts?Aretheyscholarsor
soccerfans?Churchgoersormoviegoers?
2.WhatamIrepresentinginmyfontchoices?AmIajobapplicant?Astudentwritinga
seminarpaper?Aclubofficermakingapostertoadvertiseaformaldinner?
3.WhatkindoftextamIrunningindifferentfonts?Headlinesorfineprint?Bodytextor
bulletedlists?
4.Whatdistanceismytextbeingviewedat?Onagreetingcardorabumpersticker?A
posteroraflyer?
5.WhatfontsarecommonlyavailableoncomputersthatIcanusefortheWeb?Whatkinds
ofalternativesareavailablefortextthatcannotbedisplayedinWebbrowsers?

Contributors:KarlStolley,MarkPepper,AllenBrizee,ElizabethAngeli.
Summary:

Theseresourceswillhelpstudentsandteachersbetterunderstandtheuseofvisualelementsfor
rhetoricalpurposes.

VisualRhetoric:Color
TherearethousandsofbooksandWebsitesthatcovertheuseofcolorfromallsortsofpractical
andtheoreticalperspectives.Wewilllimitourselvesheretosomebasicideasaboutcolor.Please
notethatweareonlyscratchingthesurfacebygivingprimaryconsiderationtocontrast.

Contrastisoneofthemostbasicandcriticalchoicesforcolor.Basically,contrastdealswiththe
brightnessofonecolorrelativetoanotherandcontrasttypicallyispushedtoitsabsolute
envelopeontheprintedpage.That'swhyblacktextonwhitepaperissocommon:thecontrast
betweenblackcharacterandwhitespaceincreaseslegibility.

However,blackonwhiteisnotthemostinterestinguseofcolor.Andwhendesigningforthe
screen,whitemaynotbethebestchoiceitcanbealmostblindingoncertainmonitors.Oneof
themoreconservativechoices,then,istorunblacktextoveraneutral,lightcolorlikebeigeor
evenmintgreen.

Manybeginningdesigners,however,findthemselvesoverwhelmedbythepalettesavailableon
mostcomptuers,andbeginchoosingcolorsforthepaletteoftheirdesignedbasedonfavorites.
However,resultslikethatcanbedisastrous:

ImageCaption:BlueonRed

Canyoureadthat?Notcomfortably!Imagineanentirescreenoftextlikethat.Partofthereason
thatthiscolorcombination(whichappearsmorefrequentlyontheWebthanyoucanimagine)is
sohardontheeyeshastodowithhowcomputerscreenshandlecolorinformation.Ifyoumove
yourfacecloseenoughtothescreen,you'llnoticeanalmostblackoutlineattheleftsideofthe
characters,andastrange,almostwhiteglowattheright.Why?Computerscreensaremadeupof
tinylittleboxesoflight,calledpixels.Eachpixelcontainsaredelement,agreenelement,anda
blueelement(youcanseethisevenbetteronastandardtelevisionset).Butwhathappensinthis
caseistheredelementoftheredareasofthescreenisfullon(leavinggreenandbluedark),and
theblueelementoftheblueareasisfullon(leavingredandgreendark).Theresultisaliteral
"blackhole"ontheleftside(remember,REDGREENBLUE),andaglowontheright(since
boththefarrightBLUEelementisfullon,asisthefarleftRED).

OK,enoughtechnicalinformation.Butanotherproblemwiththispaletteisthefactthatblueand
reddonothavemuchcontrastfromoneanothertheyareroughlythesamebrightness.Worse
thanthat,redisculturallycodedtojarus(justlikethebullsatthePlazadeToros).That'swhy
redistypicallyusedoneverythingfromstopsignsandstoplightstowarninglabelsandfire
alarms.

ImageCaption:GrayonYellow

Now,thisisnotanidealpalettebutitdoesillustrateourconcernwithcontrast.Thismaynotbe
afunpaletteforreadingseveralthousandpagesofanonlinenovel,butit'sgreatforsmallareas
oftextandencouragingasoft,peacefulmood.
ImageCaption:BlackonYellow

Partofwhatsatissuewiththesecolorstheblackversusthegrays,themutedversusbright
yellowsistheideaofsaturation.Saturationishowmuchofacolorthereis.Youmightthink
backtowhenyoupaintedwithwatercolorsasachild.Ifyoureallyscrubbedyourbrusharound
intheyellowpaint,youdgetadeep,brightyellow.Butbywateringthebrushdown,and
dabbingjustthetiniestbitofyellow,yougotsomethingofamorefaint,mutedyellow.

Oneofthecommonmistakesthatbeginningdesignersmakeisusinghighlysaturatedcolors
(whichisanotherreasontheredonbluethingdidntworkabove).Perhapsit'sbecauseweliked
thebrightestcoloredcrayonsaschildren.However,you'llfindthatmostsophisticateddesigns
tendtousemuted/desaturatedcolors.

Finally,theadvicewellleaveyouwith(besides"gopickupafewdozenbooksoncolor
theory")isthis:justlikewehavecertainculturallyloadedsensibilitieswhenitcomestofont
choices,thesameisoftentrueforcolor.Think,forexample,aboutthedifferenceincolor
schemesbetweenaBestBuyad(deepblues,brightyellows)andaFallcatalogueforJ.Crew
(deepwoodtones,crispbluegrays).Eachoneconveysalevelofexcitement(ornot),anda
degreeofsophistication.Observethecolorsaroundyouseewhattheydo,andwhatimpacts
theyhaveonyou.Bringthoseideaswithyouasyoudesignwithcolor.Andremember:it'snosin
toborrowandexperimentwithacolorschemeyoufind.

ColorSummary:QuestionstoConsider

WhenChoosingColors

1.Doesthecombinationofcolorsyoureusinglenditselftoeasyreading,eitheronscreenor
onpaper?
2.Aretheculturalassociations,ifany,accompanyingthecolorsappropriate?

Contributors:KarlStolley,MarkPepper,AllenBrizee,ElizabethAngeli.
Summary:

Theseresourceswillhelpstudentsandteachersbetterunderstandtheuseofvisualelementsfor
rhetoricalpurposes.

VisualRhetoric:UseofImages
Theimpactofimagesonone'sethos(credibility)cannotbeunderstated.Theillustrationsyou
use,thechartsorgraphsthatmakeupapresentation,andeventhephotographsyouplacewithin
adesignwillhavesignificantimpactastowhetheranaudiencetakesyouseriously.

A.ClipArt

Verylittlecommerciallyavailableclipartlooksgoodorhasanytypeofsophistication
especiallyclipartthatcomespackagedwithcommonsoftwareprograms.Clipartisoften
cartoonyandsilly,orabstractandgeneraltothepointofbeinguseless.Andremember:every
userofMicrosoftWordhasthesameclipart,andhasprobablyusedit,andwillrecognizeitwhen
youuseit,andbeunimpressedaccordingly.

Whenchoosingvisuals,thinkaboutthekindsofextrainformationthatisconveyed.For
example,thispieceofclipartseemstobeanicetouchforadvertisingapipeandcigarshop:
ImageCaption:Clipart

Butthentherearesomanyelementsthatsurroundthemainobjectofemphasis,whichinthis
caseisthepipe.Besides,again,thecartoonylook,thereareridiculous,outmodedfashions
(whichmaybeOKifthedesignisstrivingforanantique/nostalgiclook),plusthereisanissueof
colorsthatgetintroducedbytheclipart(ifyourdesignschemeisusingdeepredsandyellows,
say,thisisgoingtolookawful).Andwhatswiththeguysfacialexpression?Yetmost
beginningdesignerswilllooknofurtherthanthepipe,andruintheirdesignbecauseofit.Worse
still,forthisrhetoricalsituation(butcertainlynotforpublichealth),thereisthedepictionofthe
healthhazardousactofsmoking.

Ifthepipeiswhatsimportant,thenperhapsseekoutsomethingalongtheselines:

ImageCaption:PipeClipart

Again,thereisapaletteatworkhere(althoughitsnaturaltowhatwethinkofaspipe)butmore
importantly,thereisastyle:theroughlines,forexample.Whileit'snotcartoony,thispipemay
notfitintoatotaldesign(seetheOverallDesignsectionbelow).

Whyisclipartsodifficulttoworkwith?Becauseclipartisoftenstylizedandcolored,itmaybe
hardtofindsomethatreallyworkswellwithyourdesign,andmanagestopulloffthekindof
ethosyourestrivingfor.

B.IllustrationsandDiagrams

Likeclipart,illustrationsanddiagramscanmakeorbreakadesign.However,unlikeclipart,
whichismeantusuallyasanaccent,illustrationsanddiagramsoftenserveacentralpurposeto
inform.
Alwaysstriveforclarityinillustrationsanddiagrams.Thinkaboutmaps,forexample.Adriving
atlasoftheUnitedStatesdoesnotincluderepresentationsandlabelsofeverysingleoffice
building,townhouse,apartment,gasstation,andtoolshedbetweenNewYorkCityandLos
Angeles.Ifitdid,wedhaveahardtimereadingwhatwereallywantoutofthemap:theroads!
Illustrationsanddiagramsareselectivepicturesofrealitythatswhatmakesthemuseful.Inthe
caseofrepresentinglargeamountsofcomplexinformation,itisprobablyhelpfultobreakupthe
informationspatiallythat'swhydrivingatlasesoftheUnitedStatesareinbookform,andnot
giganticmapseachstategetsitsownpage,ratherthantheentirecountrysqueezedontoa
bedsheetsizedpieceofpaper.

C.Graphs

ProgramslikeMicrosoftExcelwillautomaticallygenerateeverythingfrombargraphstopie
chartsyoucanchoosethingslikecolorandscale.Someissuestoconsiderwhenchoosingto
graphicallyrepresentquantitativeinformation:

1.Everyonelikespiecharts,buttheyareonlyhelpfulintermsofshowingpartsofawhole.
Soifyourfiguresarenotinpercentages,piechartswontbeofmuchhelptoyou.And
unlessseveralpiechartsareincluded,theyarenotusefulfordemonstratingchangesover
time.
2.Bargraphsareespeciallyhelpfulforcomparisonsbetweenanumberofdifferentnumeric
variables,evenovertime.
3.Linegraphsareexcellentforplottingchangesinonevariableovertime,particularlyover
smalltimesegments.Whenmultiplecolorsareused,severalvariablescanbeplotted,but
toomanylinesmaybeconfusing,andabargraphmightbeabetterchoice.

D.PhotographsandManipulatedImages

Withtheavailabilityofdigitalcameras,scanners,andotherimagingdevicescoupledwiththe
easyelectronicdistributionofphotoqualityimages,photographsaremorepopularthanever.Yet
manybeginningdesignerstendtoavoidcapturingtheirownimages.ManywillsearchtheWeb
forimagesand,qualityornot,copyrightornot,willselectthefirstavailableimage.Again,we
stumbleontotheimportantquestionofethos,whichintheworldofphotographicimagesis
primarilytiedtotwoaspectsofthephotographicimage:compositionandquality.

We'llstartwiththesecondaspect,quality.Practicallyeverycomputerimageformathassome
settingsfor"compressing"theimage.Thatis,areasofsimilarcolorlosetheirinformation,and
arefilledinwithapproximationswhentheimageisopenedinaWebbrowserorotherprogram.
EspeciallywhendesigningforaWebaudience,thereisaconstantpushandpullbetweenthe
qualityoftheimage,anditssizeondisk.Thebetterqualityimage,thelargeritisondisk,and
thusthelongerittakestoloadinaWebbrowser.However,intermsofethosandthisitselfis
audiencedependentitisoftenwisetooptforaslightlylargerimagefile,ratherthansacrifice
quality.

ConsiderthesetwophotosofthePurdueMemorialUnion:
ImageCaption:GoodPicture

ImageCaption:PoorPicture

Inbothphotos,thesubjectmatterisclearhowever,thequalityisstrikinglydifferent.Whilethe
firstphotostillusesafairlyhighcompression,littledetailslikethewispsofcloudsandtreetops
areclear,asisthetextureofthebricksandthepanesinthewindows.Thesecondphotoisclearly
degradedtherearelargeblocksofbluevisibleintheskyarea,andtherearesparklesbetween
thetreetopsandclouds,andthebuildingandsky.Ofcourse,thetopphotofileisthreetimes
largerthanthebottombutisthespeedwithwhichthesecondphotocanbetransferredworth
thelossinquality?IfthisphotowereinthecontextofaWebpagemeanttoencouragestudents
tocomestudyatPurdue,whichwouldlikelyhaveamorepowerfuleffectonyourimpressionof
theUniversity?Why?

Intermsofcomposition,rememberthatphotosarebasicallyframesofreality.Anygivensubject
canbephotographedaninfinitenumberofways,bothintermsoftheframing(whatiswherein
theshot)andtheexposure(shutterspeed,aperature,etc.)Whenshootingorselectingyour
images,paycarefulattentiontohowtheshotiscomposed.Istheimagelight?Dark?Whatgets
highlighted?Whatisthecentralsubjectintheshot?Whatdoyounotice?Isthereanything
inappropriateintheshotthatyouwouldntwant?Now,thereareentirebooksandcourseson
photography,sowellhavetolimitourdiscussiontowhathasbeensaidsofar,withthe
exceptionofthatlastquestion:Isthereanythinginappropriateintheshotthatyouwouldnt
want?Digitalphotomanipulationhasopeneduphugepossibilitiesforimagemanipulation.
Considerthefollowingtwoimages:
ImageCaption:OriginalPicture

ImageCaption:ManipulatedPicture

Inthetopimage,variousclutter(inthiscase,streetlights)havebeenremovedtoimprovethe
overalllookoftheLafayetteskyline.Thequestionisthis:whatisthelinebetweenanaccurate
portrayalofreality,andanaestheticrepresentationofit?Howisourethosasvisuallyoriented
writersaffected,positivelyandnegatively,whenwemanipulateimagestoachieveacertain
effect?

Copyright19952017byTheWritingLab&TheOWLatPurdueandPurdueUniversity.Allrightsreserved.
Thismaterialmaynotbepublished,reproduced,broadcast,rewritten,orredistributedwithoutpermission.Useof
thissiteconstitutesacceptanceofourtermsandconditionsoffairuse.

You might also like