Onsdag lanserte vi nytt design på artiklene på NRK.no. Vi ønsker at det skal gi en bedre leseopplevelse på mobil, brett og desktop. Nå er vi spente på hva dere synes!
Denne artikkelen er skrevet av Ida Håkonsson, Helene Guldahl og Kristin Breivik – designere for nrk.no
NRK jobber aktivt for å spisse innholdet som produseres for nett, og har «større, færre, bedre» som et mantra for å nå dette målet. Det innebærer blant annet at de vanligste artiklene strippes for fyllord og forteller mer effektivt. Å skrive en lengre artikkel skal være et mer bevisst valg, og stiller andre krav til teksten. Som et ledd i denne prosessen har vi allerede lansert en egen feature-artikkelmal som vi har skrevet om tidligere her på NRKbeta. Nå er det imidlertid vår vanlige artikkelmal som får en overhaling – for å gi dere en bedre leseopplevelse, og for at malen skal fungere bedre sammen med ny innholdsstrategi.
Denne artikkelmalen brukes overalt på nrk.no, og skal kunne dekke alt fra tradisjonelle kortere nyhetssaker fra innenriks, utenriks, og distrikt, til sport-, kultur-, livsstil- og vitenskapssaker. I tillegg må den kunne håndtere lengre, gravende nyhetsjournalistikk som fortsatt ikke hører hjemme i en featuremal, samt enklere listesaker fra alle våre redaksjoner. Ytringartikler bruker også malen, men for å skille meninger bedre fra nyhetssaker har vi noen ekstra designgrep på lur som vi vil lansere etter hvert. Videre skal malen dessuten fungere på Yr og Ut. Med andre ord – et svært allsidig rammeverk.
Økt lesbarhet
Artiklene har blitt lettere å lese. Smalere brødtekst, økt tekststørrelse og linjeavstand gjør teksten mer innbydende og mindre overveldende. Dette er særlig viktig for blant annet brukere med lese- eller konsentrasjonsvansker. Skrifttypen i brødtekst er endret fra Georgia til Helvetica. Helvetica står godt til NRK Etica Slab, en nyutviklet font som allerede er implementert på nrk.no/sport, og snart vil bli implementert som tittelfont på resten av nrk.no.
Tittel og ingress over bildet
Vi har flyttet bildet under tittel og ingress. Bildet står nå i kontekst av saken og er mer integrert i leseopplevelsen. Når bildet er øverst risikerer bildet å forsvinne på grunn av «banner blindness». Rokkeringen gir også gi en bedre opplevelse på mobil, hvor bildene er det siste som lastes inn. I tillegg skiller det nyhetsartikkelene mer fra feature, og gjør at artiklene står bedre til andre designendringer vi har på blokka fremover.
Tilpasning for større skjermer
For å gi en mer strømlinjet leseopplevelse med færre avbrudd på desktop, har vi skilt ut informasjonen om artikkelen og lagt den til høyre for bildet. Dette lar oss også løfte opp profilbilder av artikkelforfatter – og på sikt gjøre noen av dem mer prominente der det er vesentlig, f.eks. i artikler fra Ytring.
Hovedbildet er gjort mindre på desktop for å optimalisere balansen mellom bilde og ny, smalere brødtekst. Når vi har løftet tittel og ingress over bildet får bildet større fokus enn tidligere, til tross for redusert størrelse.
Relaterte saker
På høyre side av hovedbildet lister vi emnene artikkelen tilhører. Dette er for å gjøre det lettere for leseren å tolke tittel, ingress og bilde. I tillegg løfter vi automatisk frem siste saker fra disse emnene i høyrespalten for å gi bruker interessante veier videre.
Å løfte frem relaterte saker basert på emnetilhørighet er ikke et nytt grep. Vi har imidlertid måttet tilpasse artikkelmalen til vår nye innholdsstrategi. Den vil føre til at langt flere artikler formidler innholdet gjennom færre ord. Med kortere saker må vi sikre at viderenavigasjonen (de relaterte artiklene) ikke tar helt overhånd og skaper ubalanse i layouten – med mye luft under brødteksten slik vi ser gammel mal gjorde i bildet over. Derfor har vi både redusert størrelsen på relatertsakene, fjernet ingress, samt vi eksperimenterer med å vise færre saker. Der vi før hadde maksimalt seks artikler, har vi nå maksimalt fire, avhengig av hvor mange emner saken er tilknyttet.
Vi vurderer fortløpende om vi skal innføre en alternativ løsning for de lengre artiklene som også skal kunne leve i malen. Disse har tross alt mer plass til veier videre i sin høyrespalte. En løsning vil kunne være å øke maksgrensen for antall relaterte artikler i saker der teksten overstiger et visst antall ord.
Mobiloptimalisering
For å korte ned veien fra tittel, ingress og bilde til brødtekst har vi gjort noen grep. Bildeteksten tones ut når den går over to linjer. Ved å klikke på teksten vil man kunne lese resten av teksten. På desktop viser vi både tidspunktet for når artikkelen ble publisert første gang, og når den ble sist oppdatert. På mobil viser vi den mest relevante tiden øverst, og begge tidspunktene i bunn av teksten. Dersom en tekst er oppdatert er det tidspunktet for oppdateringen som vises øverst.
Ekspander og kollaps
Per i dag blir faktabokser plassert i bunn av artikkel på mobil og til høyre for brødtekst på desktop. På sikt så skal de kunne plasseres inn i brødteksten, slik at de kan stå i direkte sammenheng med teksten. Journalisten vil da kunne velge om faktaboksen skal være kollapset, for at den ikke skal forstyrre leseflyten mer enn nødvendig, eller åpen dersom den er viktig.
Kommentarfelt øker lastetid, og gjør veien til andre artikler lang. Derfor har vi valgt å kollapse kommentarfeltet som standard på alle artikler utenom Ytring, hvor dette er en viktig del av innholdet.
Fryder forandringen?
Vi håper og tror at vi har landet på en løsning som løfter artiklene på nrk.no og gir leserne en bedre opplevelse. Vi har imidlertid hatt mange runder internt med dette designet, testet ulike løsninger, og ser klart både fordeler og ulemper med de grepene vi har gjort. Noen av avgjørelsene er dessuten blitt tatt uten at vi har klare tall som forteller oss at dette er den riktige veien å gå (eksempelvis å flytte tittel og ingress over bildet). Dermed tenkte vi høre med dere beta-lesere; er NRKs nye artikkeldesign en forandring som fryder?