Nytt design på NRKbeta
Vi har i lengre tid jobbet med et nytt design for NRKbeta.no. Både mentalt, og på tegneblokka. Våre brukere, altså Dere, har opp gjennom det siste to årene siden vi sist endret designet gitt oss masse nyttige innspill og tips til forbedringer. Det er disse innspillene, samt en rekke opplagte forbedringer rundt temaet vårt i Wordpress vi nå har fixet opp i.
Og for å si det først som sist. Det er ikke store endringer vi nå har gjort. Det er mer snakk om en evolusjon, enn en revolusjon. Vi beholder “blogg-formen” på siden vår da vi vet det er det dere foretrekker. Mer Magasin-aktig form har vært diskutert, men enn så lenge kjører vi altså den gode gamle bloggformen. Vi benytter fortsatt et klassisk tospaltes bloggtema med sidebar til høyre, men vi har gått litt opp på bredden på den venstre innholdskollonnen fra 570px til 640px. Det er tross alt innholdet som står i fokus på NRKbeta
Dette gjør at bredden på NRKbeta totalt går fra 940px til 975px
Vi vil fortsatt ha relativt mange artikler (ti stykk) på forsiden, noe som i følge vår utvikler, Henrik Lied, gjør oss «tyngre enn VG», men det tror vi dere tåler.
Den høyre “sidebaren” er der vi kommer til å eksperimentere litt framover, og innspill på hvilke innholdselementer dere savner der, mottas med takk. I første omgang har vi mer rydda opp i gammel ræl, enn å pøst må på ny funksjonalitet.
Kommentarer
Mange har etterspurt en oversikt over antall kommentarer og mulighet til å kommentere når man kommer til bunnen av artikkelen på forsiden. Vi har nå lagt på en nydelig liten AJAX-funksjon, som gir det mulighet til å se de fem-siste kommentarene uten å bytte side, og en enkelt gå videre til selve artikkelkommenteringen.
En annen ting vi (endelig) har fått implementert er “threaded comments”. Nå kan du enkelt svare på en kommentar ved å trykke på “Svar på denne kommentaren”, også vil din kommentar bli plassert direkte nedenfor.
Andre elementer
Et av grepene vi har gjort for å “bryte” opp bloggen litt er et nytt element vi har satt inn en “Mest kommenterte/Siste fra”-boks mellom artikkel nummer to og tre. Innspill til flere elementer av samme slag som bryter litt opp er vi veldig mottakelige for.
I tillegg til de nye elementene er det også ryddet opp i endel designmessige ting, samt at vi har fått på plass den obligatoriske NRK-toppstripa. Dette gjør at vi ikke er helt fornøyd med toppen vår enda, og ser på flere muligheter til å endre designet på denne. (Vi vurderte lenge å ha en slik liten 90-talls-mann med “Under-construction-skilt” der oppe, men det ble stemt ned med minst mulig margin)
Helt i bunnen har vi også lagt til en litt mer innholdsrik og ryddig “footer”:
Systemet er fortsatt Wordpress, og programmering og theme er utført av Henrik Lied. Til designet har vi fått hjelp av Simon Bognø.
Finpuss
Det gjenstår nok fortsatt en del finpuss. Og dere finner helt sikkert litt feil her og der. Det kan godt hende du må slette cache-en i nettleseren din. Men alt i alt er vi veldig fornøyde med det nye designet. Hva synes du?
På denne dagen tidligere år på NRKbeta…
- Korleis NRKs API burde fungere - 2009
- Peter Sunde hos Grosvold - 2009
- Streame live fra mobilen din til nettet - 2008
- Sveip - 2008
- NRKbeta på Twitter - 2008






Widar for 6 måneder siden
Forandring fryder! Det virker i tillegg både oversiktlig og praktisk
Oceanwatcher for 6 måneder siden
Gratulerer med nye klær
Ryddig og greit og et friskt design. Gleder meg til å se den videre utviklingen. Jeg liker veldig godt at dere får utnyttet footer-delen av siden bedre.
Hva slags plugin bruker dere for Twitter?
Henrik Lied for 6 måneder siden
Kjekt at det falt i smak!
Må nok skuffe med at Twitter-boksene i footer er dei heilt tradisjonelle widgetene fra Twitter.com. Skulle gjerne fått bytta ut den engelske teksten (“x minutes ago”) med norsk, men ellers fungerer dei heilt fint!
Sjur for 6 måneder siden
Hva med iPhone? Kommer dere til å skru på mobile theme igjen?
Håper det!
Sendt from my iPhone!
Marius Arnesen for 6 måneder siden
Jepp.. Det er absolutt planen ja.
Øyvind Solstad for 6 måneder siden
Har skrudd det på nå. Si fra om det er noe feil i så måte!
Øyvind Solstad for 6 måneder siden
Ser at “threaded comments” ikke støttes i WP-touch – altså den utgaven du serveres når du er på iPhone. Så da kan kanskje noen av svarene bli litt rare siden det ikke er opplagt hva de refererer til.
Simon for 6 måneder siden
Mobil tema funker fortsatt ikke på Windows Mobile m/ Opera Mobile.
=/
Jørgen for 6 måneder siden
Blir vel vandt til det her også. Likte både det gamle og det nye
Håkon for 6 måneder siden
Dere har gjort samme feilen som hw.no gjorde når de la om sist. Det er Null luft mellom vindukanten på venstre side og teksten i artikkelen. Dette gjør det veldig tungt å lese. Få inn 1 cm eller noe rundt der med luft på venstresiden, så blir det så utrolig mye lettere å lese. Når teksten i nettleservinduet kommer for nærme alle forstyrrelsene utenfor vinduet blir det slitsomt.
Jeg bruker Opera 10.10 og sitter på Os X.
Martin Berglund for 6 måneder siden
Har du ikke et bredere nettleservindu 975px (+ scrollefelt, + +)?
En av de få stedene jeg opplever det du påpeker som et problem, er når jeg besøker NRKbeta fra iPhone/iPod touch.
Øyvind Solstad for 6 måneder siden
Jeg er faktisk enig, det burde ligget noen piksler som padding på tekstfeltet. Gjør det f. eks. vanskelig å markere tekst i mobile nettlesere.
Håkon for 6 måneder siden
Bredden på vinduet mitt er bredden på aftenposten.no minus kollona lengst til høyre. Jeg sitter på en laptop med 1440*900, stortsett ikke maksimert vindu (alltid en del vinduer) og selvfølgelig tabs som en vertikal liste til høyre i nettleservinduet. Maksimerer bredden på tabs-feltet for å se mest mulig av side titelene.
844*569 piksler i følge http://whatsmy.browsersize.com/
Luft på venstre side hadde definitivt vært positivt.
Halvard for 6 måneder siden
Jeg ser det er meninga at dere skal bruke Droid Serif via Typekit, men jeg kan ikke se den noen sted. Kommer?
Martin Berglund for 6 måneder siden
Den er i bruk i bloggpostene, men ikke i kommentarene. Hvilken nettleser bruker du?
Jeg bruker Safari 4.0.4
Halvard for 6 måneder siden
Chrome nå. Ser ut som Georgia her. Men det ser ut som ampersanden bruker den.
Martin Berglund for 6 måneder siden
Du har rett, Halvard. Jeg var for rask i avtrekkern.
Sjekket ‘Inspector’, men den forteller jo bare hvilke fonter nettleseren har å velge blant. Georgia er den aktive fonten.
Halvard for 6 måneder siden
Riktig. Men hvorfor er ikke Droid den aktive?
Henrik Lied for 6 måneder siden
Det var berre ein liten forglemmelse – hadde ikkje satt ‘nrkbeta.no’ til domene på typekit-kontoen vår. No skal alt fungere fint!
Melder for 6 måneder siden
Hei, ser bra ut, men “sitebaren” på toppen med snarveier etc. fungerer ikke i Google Chrome på Mac.
Martin Berglund for 6 måneder siden
Oj, det må vi få fikset. Det ser ut til å være et problem på enkeltposter, mens det fungerer på forsiden.
Forhåpentligvis er det ikke vanskelig å fikse.
Ingjerd for 6 måneder siden
Veldig bra. Litt irriterende at når man klikker på “Les mer” så havner man på toppen av siden igjen bare,
Trond for 6 måneder siden
Synes det ser litt rart ut med “dobbbel” header. Først NRK logoen, så NRK beta logoen under..
Marius Arnesen for 6 måneder siden
Ja… det gjør vi også. Og som skrevet i artikkelen er Headeren noe vi kommer til å jobbe mere med og eksperimentere litt med.
Grunnen til at det er to headere er at vi er pålagt fra NRK.no å ha en toppstripe som er felles for hele NRK-universet.
Trond for 6 måneder siden
Opps..gikk hus forbi akkurat den delen av artikkelen
Har ellers ingenting å melde om misnøye, resten er ting som man “venner” seg til
Eirik Knutsen for 6 måneder siden
Den digre svarte ramma hvor det står nrkbeta bør fjernes helt. Man kan heller skrive inn nrkbeta i den rød ramma. Designmessig synes jeg heller ikke rødfargen står veldig pent til den blå nrk-rammen. Synes i grunn det “røde temaet” som er valgt er skrikende, ville valgt en roligere farge.
En annen ting. Når en svarer på en eksisterende kommentar virker det veldig ulogisk tekstboksen hvor en fyller inn tekst plassere seg helt nederst på siden. Den burde plasseres rett under kommentaren man ønsker å kommentere.
Øyvind Solstad for 6 måneder siden
Hvilken rød ramme mener du?, Eirik? Og hvilken blå NRK-ramme?
NRKbeta-fargen er oransje, og den generelle NRK-stripen er svart, såvidt vi kan se?
Eirik Knutsen for 6 måneder siden
Hei igjen,
Beklager, jeg benytter en annen PC i dag som tydeligvis er bedre kalibrert, fargen er absolutt oransje og står mye bedre til blåfargen enn det jeg så i går. Flaut…
Øverste delen av siden inneholder fire rammer (striper). En helt svart, hvor det står Nrk, en blå, som inneholder ulike lenker til Nrks nettsider, en ny svart, hvor det står Nrkbeta og en oransje som inneholder ulike lenker til Nrkbeta.
Lars for 6 måneder siden
ros: renere, ryddigere/luftigere design.
ris: synes kontrasten i hovedmenyen gjør den vanskelig å lese. Forstørr / lysne skrifta. #FFD6B3 synes jeg er alt for nære oransjefargen?
Lars for 6 måneder siden
synes forøvrig også at kontrasten i brødteksten er unødvendig lav og lite lesbar. Det forringes kanskje ytterligere i kombinasjon med fontvalget? Jeg har kanskje dårlig syn, men god GUI og lesbarhet bør overgå grafisk penhet anyday.
PS: kommentarene går helt fint å lese. Men synes fokuset bør ligge på artikkelen…
Jan Hammershaug for 6 måneder siden
Gratulerer med en penere side! Enkel, ryddig og moderne. Med unntak av at sidenavigering for NRK’s sider ikke virker i Chrome 5.0 for Mac, ser alt bra ut så langt.
Mikael Berg for 6 måneder siden
Bra jobba, Henrik og Simon!
Martin Strand for 6 måneder siden
I Opera 10.50 felles det ikke ned noe når man trykker på NRK-knappene helt øverst. Knappene endrer tilstand, men til ingen nytte.
Martin Berglund for 6 måneder siden
Takk for tilbakemeldingen om Opera.
Vi jobber med å fikse navigasjonen til globalmenyen i toppen.
Morten for 6 måneder siden
Bra redesign!
Det er to ting jeg likte bedre før
1) Den NRK-headern synes jeg ikke noe om. Dere blir vel ikke kvitt den, men jeg liker den ikke lell. Om jeg vil inn i NRK-universet, går jeg til NRK.no, og ikke NRKbeta.no. Fins det en måte å ikke servere den om man kommer direkte til NRKbeta, og ikke via feks en lenke på nrk.no? Vil det bli godtatt av nrk.no? Man venner seg kanskje til den etterhvert.
2) Siste kommentarer er litt uoversiktlig nå synes jeg. I mine øyne var det bedre med å liste postene og så de tre siste kommentarene per post. Nå drukner alle andre poster, om en post blir mye kommentert.
Halvard for 6 måneder siden
Er designet basert på et theme eller bygget opp fra bunnen?
Henrik Lied for 6 måneder siden
Vi har i all hovudsak bygd opp themet fra bunnen av, men vi har måtte tatt med oss litt “legacy-funksjoner” fra det forrige themet, options.
Kjetil for 6 måneder siden
Ingen av knappene “Nyheter”, “TV”, “Radio” eller “Snarveier” virker. (verken i Chrome 4.0.249.89 eller Firefox 3.5.8 i Windows)
Martin Berglund for 6 måneder siden
Det ser ut til at en av pluginene NRKbeta bruker, nuller ut globalnavigasjonen. Forhåpentligvis får vi fikset det nå snart.
Kjetil for 6 måneder siden
Ser ut til å fungere greit nå.
Fredrik for 6 måneder siden
Savner å kunne trykke på bildet i “Mest kommenterte/Siste fra”-boksen. Det samme gjelder å kunne klikke på antall kommentarer for å bli tatt rett til kommentarfeltet.
Ole K for 6 måneder siden
Ser ut som dere stort sett har gjort en kjempejobb med videreutviklingen av designet. Liker både komposisjon, layout og fargevalg veldig bra (men som påpekt tidligere, lenkene i toppmenyen har en oransje-nyanse som gjør de litt vanskelig å lese).
Kun en ting jeg personlig har å utsette: trådet visning av kommentarer er noe jeg ikke liker. Enkelte artikler går jeg regelmessig inn på for å følge med på hvordan diskusjonen går. Da er det veldig greit om man enkelt kan fortsette der man slapp og lese hva nytt som har kommet siden sist. Dette er vrient når kommentarene er trådet. Hadde det kanskje vært mulig å kunne velge mellom trådet eller kronologisk visning?
Og som en liten side-note: jeg har RSSen til NRKbeta i Google Reader. Når jeg klikker på en artikkel fra Google Reader, så får jeg mobilvisningen av NRKbeta. Og den “husker” heller ikke selv om jeg deaktiverer mobil hver eneste gang. Peiling på hva dette kan være? (det var slik før det nye designet forresten)
Simon for 6 måneder siden
1) Jeg fant en liten bug da jeg svarte på en kommentar lengre oppe:
“for 0 sekunder from now” – der det står hvor lenge siden kommentaren ble publisert.
2) Jeg håper folk ikke vil misbruke “svar på kommentar” valget for å komme langt opp på siden. Dette ser jeg at skjer veldig ofte på en hel del andre nettsteder.
3) Den NRK headeren på toppen er grusom. Dersom dere absolutt må ha den bør dere ta bort NRKbeta logoen og putte den inn i den oransje stripa nedenfor.
Ellers er jeg veldig fornøyd. Bra jobba.
Simon for 6 måneder siden
HYL! Har dere tatt bort muligheten til å endre kommentarer? Den var jo gull å ha. Den vil jeg ha tilbake!
Martin Berglund for 6 måneder siden
Den pluginen var grunnen til at globalnavigasjonen ikke virket
WordPress er flott og fint, og det finnes massevis av fantastiske plugins, men alt er ikke like godt satt sammen.
Vi får se hva som er mulig å gjøre for at begge deler skal fungere sammen.
Morten Skogly for 6 måneder siden
Yeah, savner også den funksjonen. Spesielt når jeg skriver på iPhone, som er så glad i absurde erstatninger.
akarlsen for 6 måneder siden
Flottings!
Men med tanke på headeren; siden NRK-linja er øverst, trenger dere ikke å ha NRK-logoen i headeren når den kommer på plass (jeg vet ikke om dere “må” ha den). Hva med bare ‘Beta’? Vi skjønner jo at det er NRK.
Øyvind Solstad for 6 måneder siden
@akarlsen: Vi heter NRKbeta – ikke bare beta. Så hele navnet må med. Og vi må ha med NRKs toppstripe. Men er åpen for forslag om hvordan de skal designes.
Martin Bekkelund for 6 måneder siden
Pent, leservennlig, oversiktlig, sexy. Ingen ytterligere kommentarer.
Gratulerer!
Morten Skogly for 6 måneder siden
Fint, liker looken på kommentarene. Ønsker meg mer kontrast på teksten i toppnavigasjonen, akkurat litt for vanskelig å lese med litt glare fra vinduet bak meg. Gjør feks som på Publiser-knappen i kommentarskjemaet her med en liten “dropshadow” så blir det nice. Og ja, den NRK-toppstripa gjør det komplekst å få ting fint, to nrklogoer etterhverandre er jo ikke optimalt.
Kristian for 6 måneder siden
Kult med nytt uttrykk, det ser rimelig bra bra ut.
Enig med at Headeren ikke er helt optimal, synes også den bruker for mye vertikal plass. Hva med å kjøre the oransje stripa litt opp i høyden, flytte NRKbeta til the oransje stripen og fjerne den svarte? Fungerer det mon tro?
Runar Svendsen for 6 måneder siden
Jeg synes siden ser fin ut i vanlig nettleser (har ikke sjekket noe annet ennå), men jeg savner veldig en print-CSS. Så mye at jeg har laget en begynnelse:
.nrk-globalnavigation, #main_nav, #search, #breadcrumb, #page_footer .sitemap, #page_footer .center-col, #page_footer .footer-box, #sidebar, #comment-form-wrapper {
display: none;
}
Denne fjerner de mest unødvendige elementene for print. I tillegg kunne man justert litt på fontstørrelser på utskriften, men dette er detaljer som ikke er så irriterende.
Tor Arvid Lund for 6 måneder siden
Hei. Liker designet. Rent og pent
Men jeg merket meg noe jeg kanskje tror er et lite problem med minnebruk… Kort fortalt, så mistenker jeg at om jeg har en artikkel stående oppe i lengre tid, så vil den bruke mer og mer minne.
Lengre fortalt:
Når jeg kom på jobb i dag morges, så hadde jeg hatt denne artikkelen oppe fra dagen før:
http://nrkbeta.no/2010/03/10/dugnad-hvem-er-jeg-hvor-er-jeg/
Jeg bruker Google Chrome beta på Vista64, hvis det spiller noen rolle.
Det gikk da veldig sakte bare å scrolle sida. Jeg lukket den dessverre uten å se på minnebruken. Jeg testet å åpne igjen (da gikk scrolling bra), og har nå hatt den oppe i et par-tre timer. Minnebruken for denne ene tabben, har da gått opp fra rundt 30MB, til 340 MB.
Selvfølgelig _kan_ det jo være Chrome, men nrkbeta ligger i alle fall langt over de andre tabbene mine i minnebruk.
Kan det være twitter-saken nede i footer’en, tro??
I alle fall – tenkte bare jeg ville si fra.
Anders for 6 måneder siden
Hvorfor bruker dere ikke “more”/les mer-funksjonen? Synes det blir alt for rotete på forsiden..
Bjarte Minde for 6 måneder siden
Jeg liker dette svært godt! Men jeg savner to ting; muligheten til å redigere kommentaren en har skrevet i ett minutt etter en har publisert den, og muligheten til å få nye kommentarer/svar tilsendt på epost.