[PDF] Understanding the Aesthetic Evolution of Websites - Indiana

PDF document for free

1. PDF document for free

29102_3webevolution2017chi.pdf

UnderstandingtheAestheticEvolution ofWebsites:

TowardsaNotionofDesignPeriods

WenChenDavidJ .CrandallNorman MakotoSu

SchoolofInformatics andComputing,Indiana University

Bloomington,Indiana,USA

{wc23,djcran,normsu }@indiana.edu

ABSTRACT

Inart andmusic,time periodslike "classical"and"impres- sionist"arepo werfulmeansfor academicsandpractitionersto compareandcontrast artifactsthat shareaesthetics orphiloso- phies.Whileweb designshav eundergone changesfor25 years,welack theoriestodescribe ore xplainthesechanges. Inthispaper ,wetak eafirststepto wardsidentifyingandun- derstandingthedesign periodsof websites.Dra wingfrom humanisticHCImethods, subjectexperts ofwebdesign criti- callyanalyzeda datasetofprominent websiteswhoselifetimes spanov eradecade.Theseinformedjudgmentsreveal aset of keymarkersthatsignalshifts indesignperiods. Forinstance, advancesindisplaytechnologiesand changesincompan y strategieshelpexplainho wdesignperiods demarcatedby particularlayouttemplates andna vigationmodels arise.We suggestthatdesigners andmarketers candraw inspirationfrom websitedesignscurated intodesign periods.

ACMClassificationKeyw ords

H.5.m.Information Interfaces andPresentation(e.g.HCI):

Miscellaneous

AuthorKeywor ds

Designperiods;interaction designcriticism;websites; art

INTRODUCTION

FromGoogle's iconic,minimalisticsearchpage,toThe New YorkTime'swhite, newspaper-likelayout,toReddit's retro, text-heavyformat,itisclearthatour experienceof awebsite anditscreator isduein parttoits visualdesign[ 30].Website designhase volved dramaticallyoverthelast25years,from thesimplestatic pagesof texton graybackgroundsof themid-

1990stothe visually-rich,interacti ve, "responsive"designs

oftoday. Variousdesignstyleshav ecomeandgone,driv en inpartby changesintechnology (e.g.,HTMLframes inthe late1990's, mobiledevicesinthe21st century)andaudiences (e.g.,asthe webhas becomemainstream). Permissiontomak edigital orhardcopiesofallor partofthis workfor personalor classroomuseis grantedwithoutfee providedthat copiesarenot madeor distributed forprofitor commercialadvantage andthatcopies bearthisnotice andthefullcitation onthefirst page.Copyrights forcomponentsof thiswork ownedbyothersthan ACM mustbehonored. Abstractingwithcredit ispermitted. Tocop yotherwise,or republish, toposton servers ortoredistrib utetolists,requirespriorspecific permissionand/ora fee.Requestpermissions frompermissions@acm.org.

CHI2017,May 6-11,2017, Denver, CO,USA.

Copyrightisheldbythe owner/author(s).Publication rightslicensedto ACM.

ACMISBN978-1-4503-4655-9/17/05...$15.00.

http://dx.doi.org/10.1145/3025453.3025607 Todescribethehistoricalnarrati veof art,historiansand critics havedevelopedrichnotionsof "periods"or"movements"that describetimeinterv alswhen artistsandtheirworkha veshared aparticularaesthetic styleorphilosoph y(e.g.classical, roman- tic,impressionist)[ 22,31,32].Althoughthe analogyis not perfect - changesonthe webmaybe driven morebye volution intechnology thaninchanges inaestheticstyle, forexample - identifying"periods"of onlinedesign maynev erthelessbe usefultobetter understanditse volution over time.Periods enablecriticsto coherentlycompareand contrastworks ac- cordingtotheir particularqualities(e.g., impressionistart emphasizestonecolor andatmosphere). Bydefininga period, techniques(e.g.,screen printing),styles (e.g.,cubism),tools (e.g.,camera obscura),andv ocabulary(e.g., foundart)are identified,andbecome portableconceptsthat areappropriated, built-upon,andeven rejected(e.g.,impress ionistmusicasa reactionto romanticmusic)by futureartists.Periods posita definitionofart thatisinstitutional [3];in otherwords, artis creatednotin isolation butare "jointproductsofallthepeople whocooperatevia anart world's characteristicconv entions tobringw orkslik ethatintoexistence"[ 6,p.35].Thus artists mustwork withinthesocialcontext,con ventions,and histories ofcritics,g alleries,the public,andothermembersofthe art worldsothatwhatthe ydocan belegitimately regarded asart. Justasartists findperiodsuseful instimulating theirown work, researchersinhuman-computer interactionhav eargued that designersshouldbe aware ofthedesigned artifactsthatsur- roundthem, usingtoolslik eannotatedportfolios ofdesigned artifactstocompare,contrast,and describethecharacteristics, aesthetics,anduses ofexisting designs[9,18].Byamalg amat- ingartifacts intovariouscategoriesor designs,theseportfolios helpHCIpracti tionerssee particular"styles"ofdesignthat arisefroma singleorg anization.In fact,Ga verandBow- ers[18]argue thatannotatedportfoliosresonatewithHCI designersbecausethe yreplicatepractices thatartistsuseto articulateandmoti vate theirwork.Portfoliosnotonlyinform designersofthe landscapeofinteracti veartif acts,but canalso "inspire...asareference pointforfuture designwork" [18].

Somework hassuggestedexaminingdesign stylesfroma

historicperspectiv e,forexamplelookingatpastdesigns(e.g. patents)tohelp reflecton whatitmeans tohav eordesign an innovativeprototype[11,37].Past designsalsoreveal oldin- teractionstyles thatga verise torichexperiencesorsensations thathav ebeenlost,andinteractiondesignersmayfind inspi- rationbyre vivingthese experiencesintoday'susers[25,39]. 1 Thusitmay beworthwhile toholisticallyreflect uponmultiple designstyleso vertime, similartohowartistsmayreflecton orrespond tomultiplestyles andperiods. Meggsetal.[ 23]provide anexpansivehistory ofgraphicde- signfromEgyptian cuneiformtoweb andinteractiv edesign. Yet,unlikeinart, wearenotaw areofan yformalef fortto describeor characterizedesignperiods oftheweb, despiteits

25-yearhistory. Indeed,asBardzellandBardzell[ 5,p.18]

note,"[m]any HCIsystemsarepresentedwithlittle tonoref- erencetotheir ownhistorical genealogies...Yetother design fields...dohav esignificanthistories,andpracticingdesigners knowhowtouse them."Weseea needtounderstand thepat- ternsofchange inwebdesign, toexplain howand whycertain designshav estayedwhileothershavefaded, andtopro vide insightinto past,present,and futuredesignpract ices.Analo- goustoannotatedportfolios,webelievethatcharacterizingand capturingonlinedesign periodscould bevaluable towebsite designers.For example,designerscouldsearchfor websites belongingtothe samedesignperiod asApple's, orfindsites thatembracethe hacker aestheticofReddit. Marketerscould drawfromdesignperiodsthat have proven successfulinthe past.We alsoimaginedesignperiodstobe usefulbeyond HCI.Org anizationalscholarscouldexaminetherelationship betweeninnov ationanddesign:e.g.,arecompaniesthatare trendsettersin the"artw orld"ofweb design(bystarting newwebdesignperiods)more innov ative? Politicalscientists couldexamine whetherdesignperiodsrepresentparticular values(e.g.,conservatismvs liberalism). Inthispaper ,wedra wfrommethodsofHumanistic HCI[5]to takefirststepstow ardsde velopinga conceptofdesignperiods forwebsites.W eassembleda datasetofnearly14,000snap- shotsof9 prominentwebsiteso vera 13yearperiod usingthe InternetArchi ve[2].We thencreatedpostersshowingeach website'sappearanceatregular temporalintervals. Blending think-aloud[24]andintervie wtechniques[ 36]withinter - actioncriticism[ 4],wef acilitatedsessionsasking recruited experts - webdesignersandde velopersand visualartists - to offeracriticalanalysisof thewebsitedesigns, guidingthem toidentifydesign periods(as theyjudged them),todescribe similaritiesanddif ferencesofperiods acrosstime,toarticulate potentialperiodnames, andto formjustifiedpositions onthe forcesthatdro veshifts fromoneperiodtoanother. Ourfindingsmak ethreek eycontributionsto wardsthe notion ofdesignperiods. Althoughpreliminaryand basedona small sampleofwebsites andexperts, thesefindingsne verthelesslay thegroundwork forthelonger-termgoal ofunderstandingho w webdesignhas evolv edov ertime.First,ourfindings suggest thatthereare several key markersofwebdesign periods.Our expertsidentifieddifferences invisually-identifiable proper- tiesofwebsites thatserved toseparatedesign periodsfrom oneanother, specificallyinformationarchitecturalmodels(the underlyingnavig ationmodelaffordedbythedesign),visual flavors(aestheticqualitiesofthedesign), andmediacomposi- tion(ratiosof differenttypes ofmedialik evideoandtext).A shiftinmark er(e.g.,highlighting searchbarsoverna vigation bars)suggesteda shiftin designperiods.Second, drawing fromoure xperts'responsesand experienceswithwebdesign, weidentifypossiblef actorsthatsuggest whythesemarkers instigatednewdesignperiods. Increasedinformationdensity requirements,new technologicalinnovations,changing com- panystrategies,anddesign fashionshelpedcreatenew design periods.Third,we take apreliminarysteptowardsdescribing thehistoryof thewebaccording toglobaldesign periods, suggestingfourperiods inparticular:Rudimentary ,Chaos, Formative,andCondensation(usingnamessuggestedbyour experts).Wecloseby discussingimplicationsandlimitations ofourresearch inunderstandingweb designperiods.

RELATEDWORK

Scienceandtechnology studies,particularlystudies ontheso- cialconstructionof technology(SCOT) [26],hav eemphasized thehistoricalnature ofdesignand thatthesocial, cultural,and institutionalconte xtofartifactshasa key roleinshapingthe function,intent,and lookof designs.Thee volutionof tech- nologiessuchas lighting[8]andaut omobiles [20]hav ebeen probedthroughthe lensofSCO T.These studieshav erev ealed thesometimes surprisingrolethat humanshav einthe designs anduses(e.g., usesthatare bothunintendedor perhapssubtly intended[38]bythe designersthemselves) oftechnology . InHCI,there hav ebeencalls toexaminethehistoryofin- teractivedesigns.Wycheetal. [39]examined patentsand popularliteraturearchi ves toderiveculturalthemesindomes- tictechnologies.Leahu etal.[ 21]revie wedchallengesinAI's historyandho wsolutionsto suchchallengesmightalsoapply toubiquitouscomputing. Buxtongiv esahistorical account oftouchscreens [11],observingthat thisapproachcan "shed lighton thenatureof innovation. "TheBuxton Collection[1] isawebsite featuringhistorical collectionsofdesigns (e.g., computermice),b utdoesnot presenttheminanysystematic fashionnoroffer anyanalysis ofthedesigns. Twoparticularlinesofworke xaminingstyleha vedirect rel- evancetoourowninterestin designperiods.Øritsland and Burr's[25]researchseeks tounderstand theconceptof style overtimebyfocusingonph ysicalproductswith smalldisplays andlimitedb uttons(e.g., thermostats).Lookingatproduct linesfroma singlecompany ,experts wereableto identify distinctinteractionstyle periodsbased onhow theydif fered onthreeproperties: newtechnological innovations, company spirit,andcurrent societaltrends. Werefer toandb uildupon someofthese attributesof styleperiodsin ourownfindings. BertelsenandPold [7]presentan interactioncriticismguide to interrogateinteractiondesigns.Through useofthe guide,they examinedhowstudentsin multimediaeducationbothidentify andfindmoti vationsbehind interactionstylesofapplications suchasMicrosoft Wordand aweb-basedcalendar systemthat drawfrombaroqueandrenaissance architecture.While our workdoesnote xplicitlyusethis guide,wesimilarly facilitated sessionswithe xpertsto drawouttheirskilledjudgments on whatcountsfor designperiodsin digitalartifacts. Whiletheweb isarguably themostencountered interaction designtoday, littleworkhassystematicallye xaminedthe evolutionofitsdesign.Visualization toolshav ebeende- velopedtoseehow webpagecontenthaschanged(e.g., in Wikipedia[35]).Similarto howpast workhas examinedvi- sualizingthee volutionof webecologies[13],weare also 2 concernedwiththe evolution ofdesignecologies (trendsspan- ningmultiplewebsites). Ourmethodsfind inspirationfrom workthatusesvisualizationsas amethodto elicitrichfeed- backfrom users[12,34]. Lastly,abodyofw orkexamines therelationof websites'par- ticularvisualqualities tofactors suchasvisual appealand culturaldimensions.W orkbyReineck eetal.[29]hasmade greatstridesin operationalizingtheaesthetic qualitiesofa website.They foundthatimagemetricssuchas text/non-text areasandcolorfulness significantlyimpact theperceptionof vi- sualcomplexity ,andthatvisualappealdroppedwithincreased complexity.Wehopetob uilduponReineckeetal. 'sw ork byaddingne wf actorsthatmayhelpoperationalize thevisual qualitiesofwebsites. Inalater study,Reineck eandGajos [28] examinedwebsitepreferencesfromaround theworld, finding, forexample, thatvisitorsfromFinlandpreferredless colorful websites.They foundthatolderparticipants preferredmore complexwebsitesandspeculatethat "olderusersmight simply bemoreused tote xt-heavy'web 1.0'designs."Thisweb1.0 design,we argue,could beregardedasa distinctdesignperiod. Whilenota rigorousstudy, Cookand Finlayson[14]conduct astudysimilar toours thatexamines qualitative differences of websites,inparticular examining howdesign aspectsmapto culturalconstructslik eindividuality .Theysuggestthatpartic- ularimagesthat take upprominentspace reflectonasociety's individualismorlackthereof.W esimilarly askourinformants toidentifyimportant aspectsof websites,but inth econtext of identifyingcomponentsthat markof fdesignperiods.

INTERACTIONDESIGNCRITICISMSESSIONS

Wesoughttotake afirststep towards understandingwhatit mightmeanto talkaboutperiods ofdesignfor websites.While ahumanistic approachwouldprioritizeouro wnsensibilities asacademicsacti vely engagedinmodesofcriticismsuchas discourseanalysis andclosereading,wefelta needtoe xplic- itlyincorporate theexpertise ofpractitioners.Practitioners andresearchersare oftenmentionedas thebeneficiariesof researchresults,b ut,whenvie wedasexperts,they provide differentbutcomplimentaryways tounderstandhowtosituate awork withinanotionof periods - ourapproac hblendsour abilitiestodo andfacilitate interactioncriticism [4]withthe designers'long-termhoned,practical knowledgeof designing websites.For instance,wereasonthatdesignerswho have workedinindustrycanjudgethe underlyingor ganizational motivationsbehinddesignperiodsbetterthanacademics. Wegivevoicetothejudgmentsofourpractitionersviawhatwe callinteractiondesigncriticismsessions .We generatedlarge postersthatchronologically showeda website'sappearance overtime.Practitionerexpertswereguided bytheauthors, expertsincriticism,to treattheposter asag alleryofart pieces. Inessence,these galleries werecollectionsoftechnological artifactssubjecttointeractioncriticism, orclosereadings of designs[4].We facilitatedthesesessionsbyintroducing stylis- ticperiodsas conventionally taughtinhumanities (e.g.,music appreciation[31,32])andeng aginginpractices ofinteraction criticismrele vanttoperiodssuchasexplicatinganartifact's positionin history,reception, designers,interfacequalities,so- cialcontext, subjectmatter,andex emplars.We strovetocreate

WebpageDaterangeNo.of snapshotsMeansnapshots/yr

aol.com2000-20121,746 134.3 bloomberg.com2000-20132,169154.9 cisco.com1999-2013 1,27985.3 imdb.com2001-201393371.8 msn.com1999-20132,802 200.1 slac.stanford.edu1999-2013843 56.2 sun.com1997-20101,071 76.5 whitehouse.gov2000-20101,320120.0 yahoo.com1999-2013 1,800120.0

Table2.Snapshotscollected forour posters.

aneg alitarianenvironmentwheredialoguebetweenacademic andpractitioneris discursive, interpretative, andevolving. BardzellandBardzell [5,p.52-53]discuss ahumanistic methodologyinHCI bywhi chcriticaland socialscientific approachesareblended.Thee xamplesthey provide"blend" bydoingcritical analysisofempirical data.Analogously, our interactiondesigncriticismsessionsrepresentablendofempir- icaldatacollections methods - semi-structuredintervie ws[36] andthink-aloudtechniques - with interactiondesign criticism. Wedifferinthat ouranalysisisalsogroundedin thecritiques profferedbyoursubjecte xperts,practitionerswith extensiv e experienceinwebdev elopment,design, andart.

SubjectExper tRecruitment

FromSeptemberto December2015,we recruited10practi- tionersfromfour categoriesof expertise - webdesigner ,web developer,userinterfacedeveloper, visualartist - to seekdi- verseviewpointsonthe aestheticevolutionof webdesign. Thesecategories reflectourinterestincritiquesfrom experts tointerpretaesthetic qualitiesof websites,websitesas avisual artform,or theweb's underlyingtechnologies.All experts hadatleast twoyears ofprofessional experience(seeTable1).

Posters

Oure xpertsdidclosereadingsoflar geposters(about 1mwide by2mtall) thatchronologicallysho weda subsetofsnapshots ofawebsite' sappearanceo vertime.Weused theInternet

Archive'sWaybackMachine[2]asthe sourceofour snap-

shots.This servicehostso ver150 billionarchiv edpages, datingba ckasearlyas1996,thoughitsarchi vesare notcom- pleteandcontain errors(e.g.,some imageshostedon external siteshav edisappeared).Wemanuallyidentifiedadi verseset of9major websiteswhichhavebeensufficientlypopular to berepresentativ eofmainstreamdesignacrosstimeand for whichreasonablycomplete,long-termarchiv esexisted. We downloadedallavailable HTMLsnapshotsfor eachpage,av- eragingabout 4,000archiv espersite. Wethenrenderedeach

HTMLpageto aPDFusing anautomatedscript. Finally,

wemanuallyre viewedthe PDFs,removingrenderingsthat appearedgrosslyincorrect (e.g.,missingmajor components). Thisyielded13,963 highqualitysnapshotsofnine webpages, summarizedin Table2.Ourposters representav arietyof differenttypesofsites, includingmedia(A OL,MSN,Y ahoo), financial(Bloomberg), science(SLAC,theStanfordLinear AcceleratorCenter),technology (Cisco,Sun),go vernment (WhiteHouse),and entertainment(IMDB).W edonot claim 3

Firstuseof

IDOccupation (Years)Education GenderAgeRangeInternetRe viewedwebsiteposters W1webdesigner (2)Master M25- 341996bloomber g.com,slac.stanford.com,whitehouse.go v W2webdesigner (12)Ph.DM 35-44 1995yahoo.com,imdb .com,msn.com W3HCIdesigner (6)Ph.DM 25-34 1996cisco.com,bloomber g.com

U1UX developer (4)Ph.DM25-342006imdb.com, msn.com

U2UXde veloper (10)Ph.DF25-342000aol.com,yahoo.com D1webde veloper(3) MasterF18-242003cisco.com,sun.com D2webde veloper(6) MasterM18-242003aol.com,sun.com,slac.stanford.com D3webde veloper(10) MasterM25-341999slac.stanford.com,whitehouse.gov A1glassartist BachelorF45 -541998 whitehouse.gov, bloomberg.com A2studioart graduateMasterF 18-24 2002sun.com,aol.com

Table1.Recruitedexpertsin ourstudy .

Figure1.Sampleofone ofourposters.

thatthisset of9pages isstatistically representative ofthe entireweb - itis focusedonEnglish corporateand govern- mentwebsites,for example, andamuch largersetofsitesthat weremoremethodically sampledwould beneededto assess itsgenerality, butitnevertheless includesareasonablydiverse setofpopular websites,consistentwith thegoalof takingfirst stepstow ardsunderstandingtheevolutionofweb design. Ourlarge postersallowedexpertsto vieweach pageindetail andtocompare differentyears ofdesign;this gaveexperts bothalocal andglobal viewof apage's evolution. Theposters werehungon aw all,andour expertswere encouragedto sketchonthepostersdirectly tohelp themorg anize,record, andarticulatetheir critiques.W earchiv edthesemark ed-up postersaftertheinterviews.Anexampleofaposterisshown in Figure1.For eachposter, weshowed asubsetofscreenshots foragi venwebsite alongwiththedate,spaced3months apart.Whenpages werenot available ontherequired day,we showedtheclosestpagewithin 7days,or ifnoscreens hotwas availableatallforthatweek,we showedthe words"No Data." Werandomlyassignedtwo orthreeposters toeache xpertsuch thateachof the9 siteswas viewedby atleasttw oexperts.

SessionProcedure

Webeganour interactiondesigncriticismsessionsbydefin- ingourterminology ,includinga broadexplanationofdesign periodsbyanalogy witharthistory terms.For eachoftheir assignedwebsites,we asked thesubjecte xperttocriticallyin- terpretourposter andtodra wontheir experienceand practices toskillfully identifyandgroup togetherperiodsof similarde- sign.We paidcloseattentiontoelicitinge xpertstoarticulate, reasonabout,and judgethe qualitiesthatwere sharedbyeach websitedesignin eachperiod,and thenhow eachperiodw as differentfromitsneighbors. Thisallowed expertsto consider periodsaslocal, independententities,while alsoconsidering theirgloballydependent natureonother periods.Lastly, we askedourexpertsto give adescriptivename foreachperiod.

Wealsoaskedfollo wup questionssuchas:whatmakes a

designendure,wh ydocertain patternsappearanddisappear, howdidoneperiodinfluence thene xt,doyou hadaf avorite periodandwh y, andpredictthefuturedesignsforeachwebsite. Weclosedbyaskingour expertswhether theycould identify any"global"designpatterns orperiodsthat seemedtoapply tothebroader webandnot justtoeach individualsite.

FINDINGS

Ourstudysho wsthate xpertsidentifiedcommonthemeson howwebdesignhaschanged ov ertimeand theforcesthat havedriventhesechanges.It alsoprovidedinsightthatmight leadtoa firststepto wardsa notionofweb designperiods.

KeyMarkersofWeb DesignPeriods

Ourexpertsdescribedwebdesignperiodsintermsofparticular attributes,whichwecall markersbecausethey serveasuseful waystocharacterizethe differencesbetween otherperiods. Threespecifictypes ofmark erscameup repeatedlyinour sessions:(1)information architecturemodels, orthew ays inwhichwebsites affordna vigation, (2)visualflavor, orthe aestheticandvisual designelementsof thewebsite,and (3) themediacomposition, orthee xtenttowhich certainmedia suchaste xt,images, andvideomakeupa website'scontent. Wenowdiscussfindings foreachofthesemarkers indetail.

InformationArchitectureModels

Wefoundthatmany designchangeswere driven bythechang- ingnavig ationmodelsthatwebsitesemphasizedovertim e. Inotherw ords,particularelements onwebsitesgivecues to userson thebestw aystona vigateand absorbinformation.All ofoure xpertsmentionedthat thetypesofbrowsing behav- iorintendedby theseelementsw asak eymark erof asite's designperiod.In fact,W2 feltthatinformation architecture modelswerethe strongestgeneralmark ero fdesignperiods 4

AOL,2005

200120072012 SLAC,2000Cisco,2000

(a)IMDB(b) (c)

Figure2.Examplesofinf ormationar chitecturemodels highlightedbyour experts:(a)evolutionof navigationbarsonIMDBover time,(b)SLA Cpage

asof2000, showingpr ominentmenuof linksintheupperright,and (c)examplesofcard-and grid-basednavigation systems.

acrosswebsites(i.e., independentof aparticularwebsite' s companystrategyor specificvisualstyle).Participantsiden- tifiedthemenus usedfor navigation andforsearch astwo specificwebelements thatarecritical forconv eyinginfor - mationarchitecture modelsacrossnearly anydesign period. Changesinthe relative prominenceofthese twoelements seemtoreflect changesin boththenature ofwebsitecontent andusere xpectationsov ertime. Thenavigation barisanor ganizedlist ofthesite'smain content,andcon veys theinformationarchitecturemodelof thewebsite.Nine ofour participantsmentionedchanges in navigation,andfiveexplicitly identifiednavig ationbarsasthe primarymarkerforgroupingdesign periods.D2stated that navigationbarsmadewebsitesclearerandless wordy. W2 explainedtheimportanceof thenavig ationbarwhen exam- iningthesnapshots ofIMDB, asubsetof whichissho wnin Figure2(a).Hepointed outthatthe 2001designfeatured veryprominentnavigation menusthatoccupied mostofthe left,top,and rightareas ofthepage. By2007,the searchbar hadbeenmo vedto alarger,moreprominentpositionat the topofthe page.By2012, mostofthe navigation menuswere hidden,with thesearchbar occupyingan even moreprominent position.Hee xplained: Theformof thenavigationwould bethemain feature. Tome , itchang estheperiods.Yousee,[theyellow navigationbar onthe topin2001] iskindof similarwith[the barontop ofthe2007 design].They basicallypr ovidethe linkstothe information.Andthe websiteremo vedthenavigation atthe end[in2012 design]...Here[the formof navigation]is...how thewebsiteis defined. Ourexperts described"failed"attemptsatna vigationbars before2005.D2 andD3 thoughtthena vigationof SLACin the early2000s(sho wninFigure 2(b))was poorlydesigned.D2 felttheposition andorientationof thenavig ationbarlimited itsscalability, sothatnew linkscouldnot beeasilyadded, becausetheheight ofthebar hadtomatch theheightof the photone xttoit.Better-designedbars areusuallylocated horizontallyeitherbelo wthemain logooratthebottomof thepage,v erticallyon theleftorrightsidebar, orina table nearthecenter ofthe page.Card-like designswithtabs were commonaswell, asshown inFigure2(c).Among these variations,sixexperts(W1, D1,D2,D3, U1,U2)preferred theleftsidebar ,while thecenterwasthethe leastpreferred positionofna vigationbecause itwaseasilyoverlooked.W e canseethis consensusofthe expertsis alsowidelyused in currentwebdesigns. Searchbarsappearedineight ofournine websitesaround theyear2000. Expertsnoticedthat after2010,man ywebsites enlargedthesearchbar andmov edthemto aprominentposi- tionatthe top(e.g.,for IMDBinFigure 2(a)).W2commented thatthesearch barhasbecome acrucialdesign element: Idon't care[about]theinformation onthemainpage .Iused tolookat some[ofthe] "recommended" informationpushed tomeon YouTube ,but nowIevendon'tlookatthem.WhenI wanttoknow something,for example, adirectororamo vie, I gotoIMDb andsearc h.Sowhat Iexpect is,thewebsitecan givemethe informationthatI search forandthen Ibrowse afterthat, notbefore . D2,whow orkedas awebdeveloperfrom2008to2014, shared hisfirst-handkno wledgeonthe prevalenceofsearchbars. He notedhow webtemplatesthatwerewidely usedbycompanies thengenerallyhad aGooglesearch baronthe top.D3shared hisview thatsearchinghasev olvedinto adominantmanner offindinginformation, necessitatingthatweb designersem- phasizesearchbars over navigation: [In2000],people havenoidea howtolook upinformationso youshouldpr ovide asupernicestructure.But[inlate 2000s], youdon't careaboutstructure anymore,andyouonly search fortheinformation youar elookingfor .Sothose navigation barsbecomelessimportant,and search becomesathing . Othersignalsofinformationarchitecturemodelswerealso mentionedby oursubjects.Experts suggestedthatwebsite architectureshav eovertimereducedthecontenton themain page,simplifying themtoemphasize afew key productsor messages.Ahighlightcomponent(e.g.,the largeimage inthe

2012IMDBsite ofFigure2(a))isno wacommon approachto

quicklyconv eythespirit,tone,andmainmessageorproduct ofthewebsite, ase xplainedbyD1: Themainfeatur e(r epresentingtheircurrentmain product) ishighlighted...other informationonthemainpag eare (text) links.Thoselar geima ges(representingthemainfeature) are 5 designedtobe veryappealing. Youknow ,wemay notreadthe textbutwer ememberthepicturessubconsciously. Expertsnotedthat thehighlightcan takev ariousforms,includ- ingaprominent imagebanner oragroup ofimageswithout muchtext. RecentdesignsofAOLand MSNinFigure 5use animagewith ashortcaption forhighlightedne wsstories, whilestoriesof secondaryimportancejust have textlinks.

Visualflav or

Aswemight suspect,e xpertsidentifiedthe aestheticproperties ofwebsitesas astrongindicator ofdesignperiods. Ourartist subgroupwas quicktonoticeev enminorvisual changesof websitesov ertime.Threeelementswereeachmentionedby atleastthree experts:(1) colorscheme, (2)overalllayout,and (3)qualityor refinementofvisual elements. Colorschemesportrayacertain feelingofstyle andaesthetics tousers.F orexample, flatdesign[27],whichmak esheavy useofwhite spaceandembraces asenseof minimalism,iscur - rentlyquite popular(asof 2016).Designsin theearly2000s alsohadflat elementswithsimple colorschemes,b uttypi- callydidnot sharetheminimalistic sense(e.g., compare2000 and2013for Bloombergi nFigure3(a)).W3, D3,U1,A1, andA3indicated thatcolorscheme changeswereespecially importantforidentifying designperiods.W3 even proposed namingdesignperiods aftercolors;for Bloombergin Fig- ure3(a),for example,he named2004the"Blueperiod"and

2008the"Media-consumer black"period.U1 thoughtcolors

playanimportant roleinhumans' pre-attentive processing,so uniquelycoloredsections "popout" immediately.Alternating colorschemescan helpusersdiscriminat ebetweendistinct partsofa page,ashe explainedfor MSNinFigure 3(b): Ithinkthe key factortodivide theperiodishowthewebsiteis colored,whatkindofcolor schemesit uses.[In2004] youcan seethe blueandgr een,and[in 2011]youcan seeitcompletely flat.Thecolor really easilycatches people'sattention.Color isnotthe emphasis;thecontent istheemphasis. Colormay highlightthebor ders andaddemphasis.That'swhythecolor schemeisimportant. Layouttemplatesinwebdesign areusuallyhorizontally or verticallyoriented.Five expertsmentioned thatmodernweb- siteshadob viouslybetterlayouts thanearlierdesignsand thatagood layoutwas necessaryforan aestheticallypleasing website.U1thought agood layoutkept webpageelements distinctandor ganizede venwhenthepagehadfewsolid bor- ders.Whileo veralllayout hasdefinitelychangedovertime, ourexperts didnotexplicitly articulatespecificcriteria ofwhat constitutesagood layout.D2e xplained: Thenumberof possiblewebstructur esisfe w:horizontal, verticalorsome combinationofthem. Thedesignfashions changeandnevercomeback, butweb structure[layout]sel- domchang es. Thelayoutsfrom early2000sto thepresentare especially resilientanddo nothav emuch variability. D1gaveonepossi- blereason:the improv ementinte xtalignmenttechnologyin layouttemplatesallo wedaclean lookevenwhenthe amount oftext informationincreased. 1999
2000
2001
2004
2007
2009
2015
Figure4.Progression ofthe whitehouse.govlogofrom1999-2015. Visualelementqualityreferstothe complexityor sophistica- tionofimages, videos,text, andothervisual pageelements. Expertsdidnot viewthis asvitalas othercriteriafordistin- guishingdesignperiods, butse verale xpertsdidobservethatit hadimprov edwithtime.A1notedthelogoonwhitehouse.go v hadsubtlychanged over time(Figure4),withlater designs beinghigher-resolution andmoresophisticated.

MediaComposition

Text,images,andvideosareusedto disseminateinformation ona webpage,and theproportionsand compositionsofthese havechangedovertime. Allexperts notedthatwebdevelopers intheearly 2000susedte xt-heavydesigns onthemain page, whereasmodernde velopersbelie vewordypagesloseusers.

D1used theCiscopage (Figure3(c))asan example:

[Designinearly 2000s]only provides abunc hoflinks, there isactually noinformationon thepag e.Then later,the yuse somepictures, icons,andsomethingappealingtouser s.And the2008Cisco designis notmuch different from2004, having thesame linksbut usinglesswor ds.Whenwecomparethese two,the 2004onehas lotsofinformation here[the lowerpart ofthepa ge],b utusersmaybeconfusedbythe abundanttext. D2notedthat hyperlinksha vebeen partiallyreplacedbyim- agesandvideos: Nowthere aremorevideos.P eopledon'tliket oreadtext. I guessthatis ther easonthete xthyperlinksgo down[in]their number.Youcan seemorevideosthanjust thetext hyperlinks. WhenI seethehyperlinks, forexample ...in2000,I justread thelinkb utdon' twanttogoinand seewhatisinthelink. 6

200020042008 2013

(a)bloomberg .com

199920042008 2011

(b)msn.com

200220042008 2012

(c)cisco.com

Figure3.Someexamplesof thee volutionof visualflav orhighlightedby ourexperts,including (a)bloomberg,(b)msn,and(c)cisco.

ExplainingDesignP eriods

Asdescribedin thelastsection, ourinteractiondesign criti- cismsessionsre vealedthat peopleidentifiedinformationar- chitecturemodels,visual flav or,layout templates,andmedia compositionask eymark ersofdesign.Nowwedescribehow oure xpertsexplainedthesemarkers. Inotherwords,why didwebpages changethesemark ers?Whatled tothesede- signperiods?Øritsland andBuur describehow changesin designaredue totechnologicalinno vations,a company's spirit (rhetoric),and societaltrends[ 25].Whiledra wingfromthese factorsascriticalreasonsfor webdesign markers,our study alsosuggestsother forcesatw ork.

IncreasedInfor mationDensity

Expertsobserved thatovertime, thedensityofinformationof websiteshas increased,whichhas forceddesignersto think abouthow toorganizesomuch information.For example,W1 andD1 pointedoutthat itwas nottimeconsuming forearly webusersto browseand understandwebsites becausethere simplyw asnotmuchcontenttotra wlthrough.By themid-

2000's,however ,pageshadbecomemuchmoreinformation-

rich,andusers couldeasily getlostif pageswerenot well organized.Asaresult,themarkers ofinformationarchitecture modelsandthe layouttemplates evolv edtomeet suchneeds. Increasinglypowerful searchfunctionscanbereg ardedas responsestothis sortofinformation overload, forexample . D3explained themovefrom menustosearch features:"The menusimplicitlyar estructured asatree.It canbealongpath fromthemainpag etomy destinationpag e."

TechnologicalInnovation

However,informationdensitydoesnotfullyexplainthe rise ofsearchbars, whichbecamepopular intheearly 2000sev en amongsmall websites.Eightof ourexperts identifiedinno- vationsinwebtechnologiesas ake ydriv erofdesign change. W1mentionedthat easy-to-usesearchcomponents ledmany websitestoadd themaround2000, even forsitesthat didnot needthem. Othertechnologicalde velopmentsha veincluded imageformatslik eSVG forhigh-resolutionandresponsive graphics,scriptingtechnologies like JavaScript andFlash,and 7 improvedback-endsthatenabledynamic,customizedpages. Twoparticularformsofinnovation werementioned:hardw are andwebtechnology . Hardwaretechnologyimprovementshaveincludedbothnet- workanddisplaytechnology, andsev eralexperts identified bothofthese asdriving new designperiods.F asternetworks haveenabledtransmittinglargerfiles,such ashigh-resolution imagesandvideo, whilebetter displayshav eleddesigners to takeadvantageoftheir capabilities.U1explained: Thebetterr esolutionandtonal rangemakes...modern web pages[lookgood]eventhough theyhave aminimumnumber ofcolors. Imagineifwestillused themonitorsfromthe 1990s. Thosemonitors havelowresolutionandsmall colorspace. [If]webr owse currentwebpagesfromthose monitors,[they would]look awful. Theriseof mobiledevices significantlyaff ectedwebdesign, andmobiled evices arenowusedmorethanPCstoaccess the Internet[15,19].Responsiv edesignsarewidelyusedtoadapt thesizeand positionofUI componentstoa device's display. Threesubjects(D2, U1,U2)said thewidespreadadoption of sidebarswas duetothesedevices.U2 explained: Around2010,peoplefrequently browsewebsites fromthe mobilephone, butthescreen ofmobileismuchsmaller than thecomputermonitor .We usesomethingmaybecalled"flows" tomake thelayoutforthemain contentadaptto thedevices, andkeep akindofconstantsize ofsidebaron onesideof the screen.Usersmaybecan hidethesidebarinsomewebsites. In thisway ,userscanquickly targetthesectionsthe yare looking for. Webtechnologyreferstothe toolstodesign anddev elopweb- sites.With webtechnologiesconstantlyevolving, designers anddev elopershavehadincreasingflexibilityin theirdesigns overtime.Pastresearchhasfoundthat certaininnov ations inwebtechnology have beendirectlyresponsible forpopu- larizingtheInternet. For example,the graphicalbrowserin

1993ledto dramaticgrowth inonlineuse [33].Althoughour

expertsdidnote xaminethecode ofwebsites,the ydidmention thatwebtechnologies werelik elythecause ofcertainchanges, includingvisualelements suchastypef aceandimage quality.

Whenasked toidentifydesignperiods,W2 said:

Tome,[web technology]isther ealdistinction.I cannotsay justby lookingatthe screenshotsof thewebsites.That is notenough.W eshouldr eviewtheHTMLcode .Butwe still cantellsome ofthemfr omtheposter .Back to2000,the yare table-based.Andin 2010,they areCSS-based. Webtechniquesalsomadewebsites fasterand moredynamic. Forexample,D1pointed outthattheuseof animationshas evolvedovertime.Animationbecamecommonwith theadop- tionofGIFs andFla sh,but after2012,HTML5 animations graduallyreplacedthem duetotheir lighter-weightcode and higherquality. AnotherexampleisAjax, whichpre-fetches contentandgi veswebsites adynamicfeeling.Itcanupdatein- formation(e.g.,hourly top10 articles)indynamic components withoutreloadingstatic visualcomponents, whichbringsa smootherexperience forwebusers. Lastly,newpractices ofquicklyprototypinganddesigning websiteshav ehadaninfluence.D1,D2andD3mentioned theiruseof webtemplates, whichprescribecurrent visualfla- vorsandinformationarchitecturemodels. Populartemplates havehadadirectinfluenceonpropag atingparticularmark ers ofwebdesign acrossman ydomains.

CompanyStrategies

Theway inwhichinformationispresentedby acompany is apowerful symbol[16]ofits progressiveness andrhetoric.

W1,W2,D1, andD2noted thatchangesin designperiod

markerscouldbeattributed tothecompan ywishingto convey acertainspirit.MSNwasbroughtupas oneparticularexample. Before1998,msn.com was adomainoperated byMicrosoft asanonline serviceprovider .Whenmsn.com switchedto beingused byMicrosoft'sInteractive MediaGroup,its content switchedto bemoremedia-related, andthisw asreflectedin itsvisualstyle andlayout(see Figure3(b)).As welook backatthe designsacrossMSN' shistory ,D2stated thatwe foundits visualflav orreflectedthe visualflavorofMicrosoft's productsov erthattime.Inotherwords,t hedesignperiods ofmsn.comare intertwinedwiththe userinterface design changesofMicrosoft' ssoftware products. Morebroadly, theinformationorganizationof awebpage oftenserves amarketingpurpose.F orexample, webpagesput currentlypromotedproducts inaprominent position,andif thecompany hasmanyproducts,themain pagehasa more complexlayout.Thewebsite ownermay alsochange thelay- outofthe webpageto suitthirdparty advertisements.In the

2000s,man ywebsitesputtheiradvertisements onlarge float-

ingwindows, whichwebuserscouldnotmiss. Inaddition,D2 mentionedtheuse ofthe leftsidebaras a"darkpattern" [10]: Nowwemostly stick thenavigationbar ontheleft,nothaving tobestatic [i.e.,so thenavigationcan behidden],andput themain storyonthe rightside. Becausemostweb usersar e right-handed,user spreferkeeping theirmouseattheright sideofthe page .Thenuser shavehigherpossibilitytoclick thehighlight[the linksinthe rightmainpart ofthepa ges,e .g., advertisements].Also,if theywant toget thenavigation,move mousedir ectlytoit,whichis easy.

DesignF ashions

Designfashions changesthevisualflavor ofwebsiteson a largescale.W1,D1, andD2all mentionedthatsince thelate

2000s,many websiteshavehada commonlayoutfrom topto

bottom:a horizontalnavig ationbar, alargebanner,themain contentofthe page,and afooter(e.g., the2012Cisco designin Figure3(c)).Se veralexpertsmentionedthatthishorizontally- dominantlayouta voidsthe needforuserstoscrollvertically inorderto accessthe mostimportantcontent ofthepage.

D1work edinaITconsultancycompanyaround 2010,and

mentionedthat hiscompany routinelyusedthis sametemplate todev elopthewebsitesformanysmallcompanies.Similarly , W1mentioned thelarge horizontalbanneris verypopularand widelyusedin allkindsof websites. Designfashions mayalsobedriven bythewidespread use ofsomepopular technologicalelements.F orinstance, in

2014V ishalGaikarpopularizedthewebelement forinfinite

8 scrollloading[ 17],andthree ofoure xperts(W1,D1, D2) mentionedtheseelements arenow widelyused,especially on newswebsites.Asanother example,W1saidthatin thelate

1990s,man ywebsitesaddedsearchboxes, even thoughmany

siteswerenot complexenough toneedthem. Inhisopinion, theseelementswere addedlar gelytok eepupwith thecurrent designfashion asopposedtobeingusefulcomponents.

GlobalDesignP eriods

Althoughourdataset andsubjectpool arenotlar georrepresen- tativeenoughtodevelop aholistic"theory" ofev olutionofthe broaderweb,we nonethelesse xploredwhetherour subjects couldhelpsuggest rough"global"web designperiods.We askedourexpertsto reflectonthe webdesignperiodsthey noticedacross oursetof websitesandon thebroaderweb, insteadofjust ontheparticular siteswesho wedthem.W e soughttounderstand thee xtenttowhich designchangesmay bedependenton thecontext ofparticularsites, versusmore globalchangesthat areobserv edonthe webatlar ge. Expertsnotedthat onecoulddiscern whetherwebsiteswere ontheleading edgeofdesign periods.W1,D1 andD3thought mediawebsitessuch asbloomber g.comreadilyadopted more progressivedesignperiods,whilegov ernmentandeducation websiteslaggedbehind. Fore xample,inour datasetwefound thatmediawebsites adoptedflat designsana verageof about3 yearsbeforeother websites(e.g.,A OLin2010, Bloombergin

2009,MSNin 2010,b utCiscoin 2015,SLAC in2009,and

WhiteHousein 2014).

Ourexperts dididentifysomeconsistentpatternsin thedesign periodsacrossour websites.It shouldbeemphasized thatnot alldesignperiods happenatthe sametime(e.g., somelag asmentionedbefore), nordo theylook identicalacrossweb- sites.For websitesofthesamegenre,global designperiods aresomewhat morereadilyidentifiable.For example,media websitesoftenquickly leveraged newstandard frameworks andwebtechniques andtherefore endedupha vingsimilar layoutsontheir webpages(see Figure5).

Welookedforagreement acrossoursubjectsonwhat the

majorgeneraldesign periodsofthe webmightbe. Eightof ourexperts thoughtwecoulddivide periodsintofour rough categories(usingnamessuggestedby experts): •Rudimentary(U1), Simplicity(U2),or Informational (U3)period.Expertsusedw ordslike "naive"todescribe thedesignsof thelate1990s andtheearly 2000s.Pages at thattime werefunctionaland informational(text-hea vy), andlacked abalanceddesign.W1mentionedthat websites ofthe1990s werearrangedlik edigitalv ersionsof thefront pageof anewspaper ,wherethe structurerevolvesaround "headlines"thatare linksto otherpages,with short"articles" orabstractson themainpage. •Chaos,Gradient(U1), Light(W1), orRiseof theImage (W2)period.From2000to 2005,websitesseemed totryto formulateandinte grateweb-specificdesign principles,and manyfoundationalwebelementswere introducedduring thisperiod.Y etmany ofoursubjectsusedwords like"terri- ble,"and"overused, garish,colorful backgrounds"(W3)for thisperiod. Fourof oursubjectsthoughttheimageelements msn.comaol.com Figure5.Comparisonofmsn.com onDecember22, 2012(left)with aol.com(right)on December9,2012. Althoughmsn.comis column- dominantandaol.com isr ow-dominant,they presentsimilar visualexpe- riencescompared tothewebsitesinother categoriessuchas ITservices. thatbecamepopular duringthis periodwerejust decorative anddidnot offeran yfunction.Images wereoftenshaded, givinga3Dlook.The amountofcontent sharplyincreased andmadesome websiteslookcro wded. •Formative(U1)orCinematic(W3)period.Thisperiod beginsaround2007when Web2.0 becamepopular. Basic layoutsforwebsites ofdiff erentgenrewe reestablished, whichgiv ewell-organizedlayoutsformany websites.Five ofoure xperts(W1,D1, D2,D3,U2)thoughtne wweb technologiesbroughtlar gevisualchanges towebdesigns inthisperiod. W3thought thebannerbecame eye-catching andpopularin thisperiod(see cisco.com2008or 2012 designinFigure 3(c)),leadingto his"cinematic"term. •Condensation(U1),Sci-Fi (A2),orFlat (W3)period. Thisperiodstarted around2011, withanem phasisonre- fineddesignswith clearinformationarchitecture models. Flatdesignsare popularand websitesmake heavyuseofvar - iousmediatypes (text,image, video,animation).Adapti ve

UIsand responsive designelementsarewidelyadopted.

W1contributed aninterestingopiniononthee volutionof web designfroma purewebdesigner' sperspectiv e: Thelayout[in late1990s]is sortofweir d.Itlooks likeit justwantssome thingsthere .Ithink thisformis justwhen peoplewere learninghowtosetuplayoutpr operlybefore it becomesactuallypossible .Around 2005,peoplestartthinking therearetoo manylinksonthepag esandthe ydon't have enoughspacefor them.Sothe yneedsear ch.Then theystarted consideringtheusability.Somewebsitesusedtobeveryusable websites,but becameheavywithsometechniques. Whatare theparticularadvanta ges ofthem[techniques]?Soforsome reason,theyare somethingthatreally struckpeople.Sothe y bringusbac kandmak eusthinkaboutthe answer. W1alsomentioned "bringingback"older technologies,and W3thoughtit mightbesimilar tosomething inarthistory: 9 Intermsof arthistory, whenaperiod evolvedto another. Againbecause[designer s]wer eseekingthetruthin adifferent way,theyacteda gainstthemovethat camebefore .

DISCUSSION

Ourfindingssupport thefactors thatcomposevisual complex- ityfoundby Reineckeet al.[ 29].Thatw orkfoundthat visual complexitywasa strongpredictorforawebsite's initialvisual appeal.Ourmark ersfordesign periodscovermany ofthe markersthatmake upReinecke etal.'smodelof visualcom- plexity:ratiosoftext andnon-te xtareasare relatedtomedia composition,andcolorfulness andhueare relatedtovisual flavor.However,visualcomplexity doesnotcapturesomeof thenuanceswe foundinour markers,such astheinformation architecturemodel - thetension betweensearch andbrowse affordances.Whilecolorfulnessw asfoundby Reinecke et al.toplay aminorrole inappeal,our resultssuggestthat itis highlyindicativ eofdesignperiods. Ofcourse,the relationshipbetween visualappealand design periodsiscomple x.Reinecke andGajos[28]foundthat user ageinfluencedperceptions ofvisualappeal, witholderpeople favoringtext-heavypages.Thissuggeststhat visualappeal isnot anobduratemeasure. Assuggestedby several ofour experts,peopletendtolik ethedesigns thatimmediatelysur - roundthem. Thismaymean thatsomewebsites mayav oid moreprogressiv edesignsbecauseitmaybebeneficial topor- trayan imageofstability orconservatism. Aswith mosttechnology, wefindthat bothtechnological determinismandthe socialconstructionof technologyplay ake yroleinwebsitedesign.Newtechnologicalinno vations likeJavaScript bringaboutnewdesignperiods,butshifting societalconcernslik echanging companyspiritsormessages alsohelpto shapethem. Whenweask edoure xpertsabouttheutilityofour conceptof webdesignperiods, somementionedthat theyw ouldindeed findsomeinspiration fromthepast. D3describedw antingto useshadedna vigati onbariconsonawebdesign,butcould notfindman ysuchicons onthemodernweb.By goingback intime, hemightdisco verthat shadediconswere popular inthemi d2000s,using thosepagesasexemplars ofsuch icons.In fact,we foundthatexpertswereperhaps already implicitlyusingtheir ownnotion ofdesignperiods topredict futuredesigns.F ore xample,D1predictedthattherew ould bearestoration ofdiff erentshadesof colorsina fewyears, asareaction againstthe flatandminimal designsthatare currentlypopular. D1thoughtthiskindof designiso verused andmakes currentwebdesignsdrab.She especiallymentioned thatdesignswith solidbordersha ve advantages: Asauser ,I willbemoreattracted bytheinformation ina solidframe .Like[sun.comin2008]putsse veralpiecesof information(like thetitle)intheright curvedblock. Iwill noticethatb utIwon' treadallinformationther e.Then [in

2010],ituses solidborder foreach information.Iwill be

caught,I mayquickly scaneach ofthem. Shethoughtthere shouldbea renaissanceof adesignperiod featuringthevisual flav orsofsolid bordersandshading,al- thoughitw ouldnotbe anexactduplicationofthat pastperiod. Fromhere,we mightsuggestthat examiningthe demiseof designperiods wouldbe useful - atwhatpointdoesacertain markerofdesignperiodbecome tiredandin needofchange (asaturationpoint)?

LIMITATIONSANDFUTUREWORK

Weacknowledgethatour datasetissmallandnot statistically representativeofthebroaderweb(e.g.,no non-Englishsites), soourstudy doesnotlead tocomprehensi veconclusions about themarkers andcausesofdesigne volution.Instead, weview thechanges,forces, anddesignperiods wesuggesthere as astartingpoint forfurtherstudies withabroader varietyof pages(e.g., non-English,non-western,less popular,short- lived,etc.).Similarly,thispreliminarystudy reliedona small poolofpeople, andfuture studiesshouldinclude abroader setofe xpertise.For example,althoughourexperts were qualifiedtointerpret aestheticqualities ofwebsites,m ostdid nothav ethesamedepthofcriticalandsocio-cultural-historical analyticalskills thataprofessional arthistorianor criticwould. Futurework shouldincludethesevoicesto develop amore systematictheory ofwebdesign. Finally,we believe thatother criticalmethods(e.g., analysisandar gumentation)would be conducivetothestudyofweb designperiodsand shouldbe incorporatedintofollo w-upstudies. Oneway tomakealar ger-scalestudy practicalwouldbeto createtoolsthat automaticallydetect majorchangesin visual featuresov ertime,allowingparticipantstofocusonthese changepointsas opposedto havingto examinethousands ofdailyscreenshots foreachwebsite. Suchatool mayalso beusefulin itso wnright;four ofoure xperts(W2,W3,U1 andD3)thought itwould usefulfor webdesignersto explore historicalchangesthrough suchatool, andeighte xpertsbe- lieveditwouldhav eaplace ineducationandresearch.W3 opinedthatsuch atool wouldfoster adialogueon theev olu- tionofwebsites andallow peopleto viewe xemplarsofdesign periods.

CONCLUSION

Similartoartistic domains,weimagine thedev elopmentof awebdesign periodtheorywill offera systematicway to advancethestudyof historicalwebdesigns. Ourpaperis a firststepto wardsunderstanding howandwhywebdesigns havechangedovertime. Weconducted interactiondesign sessionsinwhich weasked adiv ersegroupof expertsto criticallyinterrog atechangesinwebdesignand theforces behindthem.W ehopethat ourconceptofandinitial findings onwebdesign periodsmay eventually leadtotheories and practicaltoolsfor understandinghow webdesignchanges over time,suchas annotatedrepositories ofhistoricaldesigns that futuredesignersand researcherswillbe abletoe xplore.

ACKNOWLEDGMENTS

Thiswork wassupportedinpartby theNationalScience

FoundationthroughCAREERgrant IIS-1253549.

REFERENCES

1.2016.The BuxtonCollection.

http://research.microsoft.com/en-us/um/people/ bibuxton/buxtoncollection/default.aspx.(2016). 10

2.2016.InternetArchi ve: WaybackMachine.(2016).

https://archive.org/web/

3.ThomasAdajian.2016. TheDefinitionof Art - The

StanfordEncyclopedia ofPhilosophy.http://plato.

stanford.edu/archives/sum2016/entries/art-definition/. (2016).[Online;accessed 19-September-2016].

4.JeffreyBardzell.2011.Interactioncriticism:An

introductiontothe practice.InteractingwithComputers

23,6(No v.2011), 604-621.DOI:

http://dx.doi.org/10.1016/j.intcom.2011.07.001

5.JeffreyBardzellandShaowenBardzell.2015.

HumanisticHCI.SynthesisLectures onHuman-Centered

Informatics8,4(Sept. 2015),1-185.DOI:

http://dx.doi.org/10.2200/S00664ED1V01Y201508HCI031

6.HowardS.Becker.2008.ArtWorlds (25thanni versary

edition,updatedand expandededition ed.).Univ ersityof

CaliforniaPress,Berk eley ,Calif.;London.

7.OlavW.Bertelsenand SørenPold.2004.CriticismAsan

ApproachtoInterf aceAesthetics. InProceedingsofthe

ThirdNordicConference onHuman-computerInteraction

(NordiCHI'04).ACM, NewYork,NY, USA,23-32.DOI: http://dx.doi.org/10.1145/1028014.1028018

8.WiebeE.Bijker.1992. Thesocialconstruction of

fluorescentlighting,orhow anartifactwasinventedin its diffusionstage .MITPress, Massachusetts.

9.JohnBowers. 2012.TheLogicofAnnotatedPortfolios:

CommunicatingtheV alueof'Research ThroughDesign'.

InProceedingsoftheDesigning InteractiveSystems

Conference(DIS'12).ACM, NewYork,NY, USA,

68-77.DOI:http://dx.doi.org/10.1145/2317956.2317968

10.HarryBrignull.2016. DarkPatterns: fightinguser

deceptionworldwide. http://darkpatterns.org/.(2016).

11.BillBuxton.2010. Atouching story:Apersonal

perspectiveonthehistoryoftouch interfacespast and future.InSIDSymposiumDig estofT echnicalPapers,

Vol.41.Wile yOnlineLibrary ,444-448.http://

onlinelibrary.wiley.com/doi/10.1889/1.3500488/abstract

12.StuartK.Card, JockMackinlay,and BenShneiderman.

1999.ReadingsinInformation Visualization:Using

VisiontoThink.Morg anKaufmann,SanFrancisco,Calif.

13.EdH. Chi,JamesPitk ow,Jock Mackinlay,PeterPirolli,

RichGossweiler,and StuartK.Card. 1998.Visualizing theEvolution ofWebEcologies.InProceedingsofthe

SIGCHIConference onHumanFactorsin Computing

Systems(CHI'98) .ACM Press/Addison-Wesley

PublishingCo.,Ne wY ork,NY,USA,400-407.DOI:

http://dx.doi.org/10.1145/274644.274699

14.JackCookand MikeFinlayson. 2005.Theimpact of

culturaldiv ersityonwebsitedesign.Advanced

ManagementJournal70,3(July 2005),15-23.

https://ritdml.rit.edu/handle/1850/7707

15.SusmitaDasgupta,Somik Lall,andDa vidWheeler.2001.

PolicyReform,EconomicGrowth, andtheDigital Divide:

AnEconometricAnalysis .Vol. 2567.WorldBank

Publications.

16.MarthaSFeldman andJamesG March.1981.

InformationinOr ganizationsas SignalandSymbol.

AdministrativeScienceQuarterly26,2(1981), 171-186.

17.VishalGaikar.2014.The 10HottestW ebDesignT rends

of2014.(2014). http://www.tricksmachine.com/2014/07/ the-10-hottest-web-design-trends-2014.html

18.BillGav erandJohnBowers.2012.AnnotatedPortfolios.

InteractionsJuly+August (2012),40-49.

https://interactions.acm.org/archive/view/ july-august-2012/annotated-portfolios

19.FriedhelmHillebrand.2002. GSMandUMTS: the

CreationofGlobalMobileCommunication .JohnW iley

&Sons,Inc.

20.RonaldKlineand Trev orPinch.1996. UsersasAgentsof

TechnologicalChange:TheSocial Constructionofthe

Automobilein theRuralUnited States.Technologyand

Culture37,4(Oct. 1996),763-795.

21.LucianLeahu,Phoebe Sengers,andMichael Mateas.

2008.Interactionist AIandthe promiseofUbicomp, or,

howtoputyourbox inthew orldwithoutputting the worldinyourbox. InProceedingsofUbicomp'08.ACM

Press,Seoul,K orea,134-143. DOI:

http://dx.doi.org/10.1145/1409635.1409654

22.VictorMargolin.1989.Designdiscourse: History,

Theory,Criticism.Univ ersityofChicagoPress.

23.PhilipBMe ggsand AlstonWPurvis.2016.Meggs'

Historyof GraphicDesign .JohnW iley& Sons.

24.JanniNielsen,T orkilClemmensen,and CarstenYssing.

2002.GettingAccess toWhatGoes oninPeople' s

Heads?:Reflectionson theThink-aloudT echnique.In

ProceedingsoftheSecondNor dicConference on

Human-computerInteraction (NordiCHI'02).A CM,

NewYork,NY, USA,101-110.DOI:

http://dx.doi.org/10.1145/572020.572033

25.TrondAreØritslandandJacob Buur.2000.T akingthe

Bestfroma CompanyHistory -Designingwith

InteractionStyles.In Proceedingsofthe3rd Conference onDesigningInter activeSystems:Pr ocesses,Practices,

Methods,andT echniques(DIS '00).A CM,NewYork,

NY,USA,27-38.DOI:

http://dx.doi.org/10.1145/347642.347658

26.TrevorJ.PinchandWiebeE.Bijker. 1987.TheSocial

Constructionof Factsand Artifacts:OrHowthe

SociologyofScience andtheSociology ofTechnology

MightBenefitEach Other.InTheSocialConstruction of

TechnologicalSystems:NewDirectionsintheSociolo gy

andHistoryof Tec hnology.MITPress.

27.AntónioPratas.2014. CreatingFlatDesignWebsites .

PacktPublishing.

11

28.KatharinaReineck eandKrzysztofZ.Gajos.2014.

QuantifyingV isualPreferencesAroundtheWorld. In

ProceedingsoftheSIGCHIConfer enceonHuman

FactorsinComputingSystems(CHI'14).ACM, New

York,NY,USA,11-20. DOI:

http://dx.doi.org/10.1145/2556288.2557052

29.KatharinaReinecke, TomYeh,Luke Miratrix,Rahmatri

Mardiko,YuechenZhao,Jenn yLiu,andKrzysztofZ.

Gajos.2013.Predicting Users'FirstImpressions of

WebsiteAestheticswithaQuantification ofPerceiv ed

VisualComplexityandColorfulness. InProceedingsof

theSIGCHIConfer enceonHuman FactorsinComputing

Systems(CHI'13) .ACM, NewYork,NY, USA,

2049-2058.DOI:

http://dx.doi.org/10.1145/2470654.2481281

30.DavidRobinsandJasonHolmes. 2008.Aestheticsand

credibilityinweb sitedesign.InformationProcessing &

Management44,1(Jan. 2008),386-399.DOI:

http://dx.doi.org/10.1016/j.ipm.2007.02.003

31.CharlesRosen.1998a. TheClassicalStyle: Haydn,

Mozart,Beethoven (expandededitioneditioned.). W.W .

Norton& Company.

32.CharlesRosen.1998b .TheRomanticGener ation(fifth

printingeditioned.). HarvardUni versityPress.

33.RonaldJ.V etter,ChrisSpell, andCharlesWard.1994.

Mosaicandthe WorldW ideWeb .Computer27,10

(1994),49-57.

34.FernandaB.V iégas,Scott Golder,andJudithDonath.

2006.Visualizing EmailContent:Portraying

RelationshipsfromCon versationalHistories. In

ProceedingsoftheSIGCHI Conferenceon Human

FactorsinComputingSystems(CHI'06).ACM, New

York,NY,USA,979-988. DOI:

http://dx.doi.org/10.1145/1124772.1124919

35.FernandaB.V iégas,Martin Wattenberg,andKushal

Dave.2004.StudyingCooperationandConflictBetween

AuthorswithHistory FlowV isualizations.InProceedings oftheSIGCHI Conferenceon HumanFactor sin

ComputingSystems(CHI '04).ACM, NewYork,NY,

USA,575-582.DOI:

http://dx.doi.org/10.1145/985692.985765

36.RobertStuartW eiss.1995.Learningfrom Strangers:The

ArtandMethod ofQualitativeIntervie wStudies.Simon

andSchuster, NewYork.

37.MikaelWiber gandErikStolterman.2014.WhatMakes a

PrototypeNov el?:AKnowledgeContributionConcern

forInteractionDesign Research.InProceedingsofthe

8thNordic ConferenceonHuman-ComputerInteraction:

Fun,Fast, Foundational(NordiCHI'14).ACM, New

York,NY,USA,531-540. DOI:

http://dx.doi.org/10.1145/2639189.2639487

38.SteveWoolgar.1990.Configuringthe User:theCaseof

UsabilityTrials. TheSociological Review38,S1(1990),

58-99.

39.SusanWyche, PhoebeSengers,andRebeccaE. Grinter.

2006.HistoricalAnalysis: UsingtheP asttoDesign the

Future.InProceedingsofUbicomp'06.Springer-V erlag, Berlin,35-51. http://dx.doi.org/10.1007/11853565_3 12

Web Design Documents PDF, PPT , Doc

[PDF] above web design

1. Engineering Technology

2. Web Design

3. Web Design

[PDF] above1 web design agency

[PDF] after web design what can i do

[PDF] antialiasing web design definition

[PDF] antiques web design

[PDF] are web designers in demand

[PDF] bayou web design plus

[PDF] best web design roundup

[PDF] brackets web design download

[PDF] codehs web design answers pdf

12345 Next 200000 acticles