Heatmap over lesning av fonten på dt.no. Klikk på bildet for å få opp bilde av hele fronten.

Etter lanseringen av nytt design på alle nettavisene våre har vi fått Netlife Research til å gjøre en brukertest. En del av undersøkelsen var en eyetracking av brukerne mens de leste utvalgte eddanettsteder.

Undersøkelsen viser blant annet at så godt som hele artikkelteksten leses og at folk scroller og leser langt nedover frontene. 

Resultatene ga oss både nye innsikter og bekreftet noen av våre antagelser, som var basert både på andre eyetrackundersøkelser og på ymse brukerstatistikk.

De fire nettutgavene som ble testet var dt.no, tb.no, sb.no og dittoslo.no. Testpersonene var jevnlige lesere og kom fra dekningsområdet til en av de fire mediehusene.

 Her er noen av de viktigste funnene:

• Når folk kommer inn på  fronten er typisk adferd at de scroller langt nedover siden for å få et overblikk før de scroller opp igjen og velger saker de vil klikke på.
• Folk klagde på til dels for store bilder og titler på fronten.
• Folk leser bildeteksten til store bilder i toppen nøye
• Inne i artikkelen leser folk langt nedover i teksten.
• Bilder i hele tekstbredden er ikke et hinder for lesning når folk er interessert
• Mellomtitler er viktige blikkfang (Som påvist i andre eyetrackundersøkelser, f.eks Poynters )
• Ansikter er blikkfang i bilder (Også påvist i Poynters undersøkelse)
• Siden det er et tomrom nedenfor brødteksten får ikke leseren med seg elementene lengre ned
• Elementer i høyrespalten, som faktabokser, får liten oppmerksomhet, i det minste når de står helt alene.
• Ikke overraskende indikerer testen at godt skrevne saker om engasjerende emner leses mer enn tyngre tekster om mer abstrakte emner.

Denne heatmapen illustrerer flere av poengene i punktlisten over.

Hva gjør vi med dette:

Kunnskapen fra testen blir brukt både i det langsiktige utviklingsarbeidet vi gjør både teknisk og redaksjonelt. Dessuten er dette viktige tilbakemeldinger for alle som sitter rundt i mediehusene våre og desker frontene.

Vi har hatt litt rusk i maskineriet med artikkelmalen vår og har ikke vært helt tipptopp fornøyd med den. Utviklerne har jobbet mye med dette i det siste og ruller ut ny design til uka.

Denne bøter på problemet burkertesten påviste med at det tomme feltet under brødteksten stopper for videre lesning av elementene under.

Testen ble gjort for noen uker siden. I tiden etter har vi lansert betraktelige forbedringer på verktøyet frontredigererne bruker til å deske fronten.

Dermed blir det mye mindre teknisk mekk og mer tid til å jobbe med den journalistiske presentasjonen av sakene. Det vil forhåpentlig føre til at virkemidlene står mer i stil med sakenes innhold.

Metodikk

Eyetracktesten er gjort av Netlife research som del av en større brukerertest. Den er gjennomført med åtte testpersoner med alder fra ca 20 til ca 60. Alle de åtte testpersonene har tilknytning til dekningsområdet til en av de fire nettutgavene som ble testet.

Du finner flere heatmaps fra undersøkelsen i full oppløsning på vår flickrkonto. Alle bildene har CC-BY SHARE ALIKE-lisens.

Related posts:

1. Nytt design på alle Eddas nettaviser – slik har vi tenkt

17. oktober  fikk alle Eddas nettsteder, med et par unntak, et helt nytt utseende.  Målet er at innholdet skal komme tydeligere fram og brukerne få bedre opplevelser. Vi har kastet ut kolonnene på forsidene, går fra et loddrett til et vannrett design.  Journalistikken skal styre hvordan forsidene ser ut, og annonsestørrelsene følger den nye bransjestandarden.

Se for eksempel tb.no, Dt.no eller Dittoslo.no for en kikk på det nye utseendet. (I høyremargen finner du lenke til alle nettavisene våre. Med et par unntak har alle nå det nye utseendet)

Forsiden, sekssjonssidene, artikkelmalen, menyer, navigasjon og og bildegallerier har fått nytt utseende. Forskjellene fra avis til avis kan være store, siden fleksibiliet har vært et av de viktigste målene.

I journalistisk presentasjon er plass hard valuta. Jo viktigere en sak er, desto mer plass. Dette gjennomsyrer tankegangen bak det nye rammeverket. Prioriteringen av saken skal bestemme innholdet. Redaksjonene får fleksibilitet nok til å bruke layout som det journalistiske virkemiddelet det bør være på nett også.

De viktigste grepet for å oppnå dette er overgang til en modulbasert forside. Der de gamle forsidene stort sett var inndelt med en rad med en stor sak og så to rader med to små, kan frontredigererne nå velge hva slags inndeling hver rad skal ha. Du kan bytte antall saker på hver rad så ofte du finner det nødvendig.

I tillegg til at saker nå kan få den plassen de fortjener ut fra innholdet, gir dette oss mulighet til å skape brudd og uforutsigbarhet i inndelingen av front og seksjonssider, i stedet for det faste rutenettet leserne hittil har møtt dag etter dag.

Utviklingsteamet, ledet av Espen Grimsgaard, har fått til dette ved å laget et system i publiseringssystemet vårt, Polopoly, hvor journalistene velger layout for hver rad nedover på fronten ut fra dette settet med moduler:

Vi valgte å lage dette systemet selv, i stedet for å kjøpe det ellers utmerkede verktøyet Dr. Front. Siden CMSet vårt brukes av både ganske store og svært små aviser, med veldig varierende ressurser på nett måtte vi ha et system som både gir stor fleksibilitet til de som ønsker det, men som også kan gi et fast og relativt automatisert system for de som trenger det.

Redaksjonene får nå et godt verktøy for moderne nettjournalistikk. De får også en stor utfordring. All fleksibiliteten er arbeidskrevende: Innholdet må prioriteres hardere. Det går med mer ressurser til desking av fronten og seksjonene, for å utnytte mulighetene til å lage gode brukeropplevelser av journalistikken vår hver eneste dag i store som små redaksjoner.

Mindre er mer
Jo mer vi kan kutte bort innhold som ikke trenger å være der, som ikke bli klikket på, desto lettere blir det for leserne å finne det gode innholdet. Vi har åpenbart latt oss inspirere av designtrenden Dagbladet.no startet med sin redesign for noen år siden. Erfaringen fra Dagbladet var at når de kuttet 95 % av lenkene steg antall klikk. For mye å velge mellom fører til færre valg. Vi håper på samme utvikling hos oss.

Janne Flusund har ansvaret for design på nett i Edda. Her er hennes oppsummering av de viktigste endringene i det nye rammeverket:

• Vi kutter innhold:
  Vi tenker nytt på seksjonssider. Seksjonssider er typisk lite besøkt, og er ofte en kopi av forsiden. Nå skal de være mer spisset mot hvert enkelt tema og det er kuttet ned masse på innhold som ikke trenger å være på seksjon. Tidligere var vi bundet til å måtte “fylle ut” en hel kolonne med innhold, noe som gjorde seksjonene lite fokuserte. Nå er det lagt opp til moduler slik at en seksjon bare skal inneholde moduler som har noe på den seksjonen å gjøre. Nå må nettredaktørene deske seksjonene, noe som gjør at de må tenke mye mer fokusert og prioritere knallhardt hvilke seksjoner de egentlig trenger. Slik får vi bedre seksjoner.
• Vi går fra vertikalt til horisontalt design
  Det ligger i det nye designkonseptet at vi går fra et vertikalt design til et horisontalt design. Vi kan jobbe med moduler og ulike layout. Vi er ikke lenger bundet til en layout på tre kolonner. Med de tre kolonnene så stopper blikket, siden deles i tre og blikket presser nedover kolonne 1 og må scrolle opp og ned og opp igjen for å få med seg det som liger i kolonne 2 og 3. Kolonne 2 var lite klikket på, men kolonne 3 var enda mindre klikket på. En vestlig leser typisk fra venstre til høyre, derfor fungerer det bedre med et horisontalt design der leseren kan scanne hele bredden nedover på linje fra venstre mot høyre.
• Mer dynamisk forside
  Mer fokus på dynamisk innhold, mindre statisk innhold som ingen klikker på. Vi har sett at det statiske innholdet som lå i kolonnen til høyre for artiklene ble lite klikket på. Faste elementer har en tendens til å bli rammet av banner blindness-effekten, de blir etterhvert oversett av leserne. Med det nye rammeverket må nettredaktørene prioritere mye bedre og ta bort mye av det statiske innholdet som ingen klikker på. Det er lagt opp til at redaktørene skal bruke mer av de dynamiske elementene for å promotere nye tjenester heller enn å legge opp et statisk element som blir liggende år etter år. Vi får et mye bedre søk og meny med megameny som gjør at leserne kan søke i alt innhold og produkter og tjenester, ikke bare nyhetssaker.
• Megameny
  Med den nye megamenyen kan vi vise frem mye tydeligere hva som gjemmer seg bak hvert menypunkt. Vi bruker mer plass og grupperer menyelementene. Eksemeplvis får vi snart en ny markedsplass med bookingtjeneste hvor “Sett inn annonse” får en stor megameny som viser alle kategoriene og vei inn til annonsering i en megameny.
• Avis for alle
  I denne rammeverksprosessen har det vert viktig for meg at vi har fokus på Universell utforming. 20% av befolkningen har en eller annen form for nedsatt funksjonsevne. I det nye rammeverket har vi lagt stor vekt på å tilrettelegge både design med gode kontraster og fintstørrelser, html som fungerer optimalt med skjermlesere og tastaturnavigasjon og innhold som er tilgjengelig. Dette blir en prosess som vi kommer til å fortsette å fokusere på fremover. Alle som er med på å legge energi inn i avisen, både designere, utviklere og redaktører må bli bevisst på prinsippene for en mer brukervennlig og tilgjengelig avis.
• Gridbasert html, 1280 skjermer og nye annonseformater
  I fjor kom de nye annonseformatene. Vi var raske med å legge opp det gamle rammeverket med bredere kolonne 1 slik at vi fikk inn de nye formatene. Men det er først nå vi virkelig har utnyttet de nye mulighetene som det nye annonsekonseptet gir. De nye annonseformatene går opp i en grid, noe som gjør at vi nå kan lage et design som har en grid som går opp i bredden siden alle bannerne har et format som slutter på -80.
• Vi har lagt opp til en grid på 980 som støtter bedre de nye annonseformatene og gjør det mye lettere og mer fleksiblelt for oss å designe nyvinninger på avisene. Jeg gleder meg til å designe nye moduler på det nye rammeverket, nå har vi mye mer spillerom! Tidligere kunne vi ikke designe noe som gikk over de 3 kolonnene på grunn av måten det var byget opp på, men nå kan vi designe hele horisontale rader og putte de inn.
• Utvikling hver dag
  Dette åpner for mye mer fleksibilitet i den videre utviklingen av rammeverket. Vi kan raskt teste ut nye konsepter uten å måtte gjøre en helt ny rammeverksprosess. Målet er at vi nå skal utivkle rammeverket kontinuerlig bit for bit, noe som gjør at vi antagelig ikke vil ha behov for å gjøre en total rammeverksprosess/redesign igjen men altså gjøre endringer mer gradvis. Dette er bedre for leserne våre og vil gi oss mer spillerom for løpende innovasjon og testing.
• Flat meny-struktur
  Vi slutter å tenke hierarki i menyer, og ten ker mer i bane av kontekstuell meny. Menyen er mer oppløst, det betyr at hovedmenyen ikke lenger må kopieres ned på alle undersider. Nå kan vi lage under sider som har en meny som er relevant for hver brukeroppgave for hver side. Slik unngår vi å ha mange lag med menyer på undersider.
• Løsrevet bildegalleri
  Vi har laget et nytt bildegalleri som r løsrevet fra en galleri-seksjonsside. Slik kan vi lenke til en fullskjermvisning av galleriene uten å måtte vise frem først 3 menyrekke med menyhierarki før bildene dukker opp. Nå er bildene i fokus.

Gi oss tilbakemeldinger
Vi gleder oss til å se hvordan det nye rammeverket blir brukt i praksis, både av redaksjoner og brukere. Har dere innspill til oss i Edda Utvikling eller til enkeltredaksjoner i Edda om dette er det bare å bruke  kommentarfeltet. Vi vil vite hva dere mener.

Related posts:

1. Mobil videresending på plass for alle Eddas nettaviser
2. Sengetid er primetime på Eddas nettaviser

Fotoboka er mye. Fotoboka er en nettside, en programvare, og et produkt av programvaren i form av en bok som inneholder dine bilder og dine egne tekster. For du har virkelig full kontroll når du har lastet ned programmet til din harddisk.

For hva er det vi vil formidle med nettsiden Fotoboka.no? Hvorfor er den blitt som den er blitt? Hvorfor er den ikke hvit, glatt og glossy med standardlayout for hjemmesider? Mye av grunnen kommer av nettsidens eneste formål: Å være et kort stopp på veien gjennom konverteringen – et så kort stopp som mulig som skal før til et trykk på last ned-knappen.

Vi har valgt å vektlegge noe uventet og annerledes, en merkevare som kommuniserer trygghet, pålitelighet, vennlighet – og kanskje noe av det viktigste: Diskresjon. Anti-reklamespråk og forklaring med få ord var suksesskriterier, og vi mener å ha klart dette! Noen få ganger kan det være riktig å bruke gule bomber, krigstyper og utropstegn, men merkevaren Fotoboka ligger på motsatt kant.

Fotoboka.no’s design måtte oppfylle en del krav, til tross for å være en statisk og ensom nettside:

• Bidra til rask konvertering.
• Kommunisere trygghet, vennlighet, pålitelighet og diskresjon.
• Gi en følelse av hva produktet er.
• Svare på alle spørsmål enten det gjelder programvaren eller produksjonen.

Suksess på tvers av avdelinger og verdensdeler

Vi kan si at Fotoboka ble en stor suksess selv om forholdene ikke lå til rette for det. Miljøet rundt nisjene våre hadde en idé, og en programvare i utvikling fra eksternt hold, og i samarbeid med designavdelinga måtte det bygges en merkevare på 48 timer. For etter 48 timer skulle utviklingen av nettsiden starte. Når slike beskjeder kommer fra høyere hold er det bare å slippe alt man har i hendene og forberede seg på intensiv jobbing!

De første to ukene hadde vi fire viktige funksjoner i sving: Marked, design, utvikling, og søkemotoroptimalisering også kalt SEO – omtrent i kronologisk rekkefølge etter involveringstidspunkt.

For oss i designavdelingen medførte Fotoboka-prosjektet en bråstopp i alle andre prosjekter, men ikke i lang tid. Det var nok med én mann på saken i tillegg til kontinuerlig innspill fra kolleger fra alle avdelinger. Og det er noe med å jobbe så intensivt med ett prosjekt: Det blir en del av deg, og man tenker på det like mye utenfor arbeidstiden som i. Kanskje er det nettopp derfor vi klarte det på rekordfart?

Edda er midt i en periode med bytte av publiseringsplattform, noe som gjør at hver eneste webutvikler er dypt involvert. Dermed var vi avhengige av hjelp utenfra, og fikk leid en drivende dyktig utvikler som da var på vei mellom to jobber. Ingen av oss møtte denne utvikleren, men jobben som ble gjort var formidabel! Samarbeidet var tuftet på kommunikasjon via chat og e-post, og takket være tenk-før-du-skriver-prinsippet var prosjektet blottet for misforståelser. En vital faktor for suksess er å alltid formulere seg klart og tydelig.

Markedsavdelinga holdt kontakten med produsent av trykksakene, Memomiio Productions, i Kina. Den store tidsforskjellen på sju timer ble en utfordring som medførte både dag- og nattarbeid for markedsfolket, og det igjen, medførte at viktig informasjon lå klar i e-posten neste arbeidsdag. Nattarbeid ble det også for våre venner i Kina, og samarbeidet oss imellom vitner om selvoppofrelse og en sterk vilje til å gjennomføre på best mulig måte.

No related posts.