Derfor har kode24 fått nytt design

- Nå er det på tide å bli proffe, ryddige, brukervennlige og bitte litt mindre masete, forteller kode24-Jørgen.

Prøv å legg til kode24.no på hjemskjermen din, da vel! Da får du en feiende flott PWA. 📸: Ole Petter Baugerød Stokke
Prøv å legg til kode24.no på hjemskjermen din, da vel! Da får du en feiende flott PWA. 📸: Ole Petter Baugerød Stokke Vis mer

Hei, du! 👋

Tusen mega-takk for at du leser kode24. 😻

I snart tre år nå har den bittelille kode24-redaksjon arbeidet for å gi et hjem for norske kodere. Og ærlig talt synes vi at vi har fått utrettet ganske mye.

Hver dag skriver vi om flinke utviklere rundt og kring i hele Norge, som bygger kule ting på kule arbeidsplasser. At flere og flere av dere i utvikler-samfunnet også ønsker å bidra på kode24 er vanvittig gøy å se.

Da vi først lanserte kode24 ønsket vi at siden skulle bli lagt merke til, og vi tok hardt i med grafiske elementer og stiling.

Nå er det på tide å bli proffe, ryddige, brukervennlige og bitte litt mindre masete. Samtidig som at vi skal være en leken siden fortsatt og pådriver for gøyalt design.

Velkommen til kode24 v2.0!

«Det ble vanvittig fint. Men så lurt var det kanskje ikke.»
Tekst oppå bilder har ikke vært en suksessformel for kode24. Men det ser pent ut. 📸: Jørgen Jacobsen
Tekst oppå bilder har ikke vært en suksessformel for kode24. Men det ser pent ut. 📸: Jørgen Jacobsen Vis mer

Bilder skapte UX-krøll

Den grafiske stilen vi valgte til første versjonen av kode24 var faktisk litt småfrekk i norsk nettavis-sammenheng. Tekst oppå bilde var nemlig reservert til spesial-saker. Vi snudde det like så godt på hodet, og lot det være standarden.

Det ble vanvittig fint.

Men så lurt var det kanskje ikke.

Vi tenkte ikke på at når tekst skal ligge oppå et bilde, setter det noen vesentlige krav til bildet under: Det kan ikke ha tekst på seg, ansikter må være i den øvre delen av bildet, og aller helst på høyre side der teksten bryter og skaper mellomrom.

Tar du en titt på gamle kode24 på bildet over med dette i tankene, ser du fort hvordan vi har jobbet med begrensningene.

De av dere som har mailet med oss i redaksjonen har nok opplevd en litt stressa redaktør som maser om "litt bedre bilder".

Derfor har vi separert tekst og bilde i den nye versjonen.

Tidligere brukte vi, slik som alle andre redaksjoner i Norge, altfor lang tid på å piksel-perfekt redigering av forsiden. 📸: Jørgen Jacobsen
Tidligere brukte vi, slik som alle andre redaksjoner i Norge, altfor lang tid på å piksel-perfekt redigering av forsiden. 📸: Jørgen Jacobsen Vis mer

Farvel til piksel-perfekt

Du har kanskje også lagt merke til at sakene våre nå ligger én og én per rad, pakket inn i et fint kort med avrundede kanter.

Tro det eller ei, men dette er en ganske bisarr ting å gjøre i norsk mediebransje. De aller fleste tviholder på tanken om at saker skal ligge to eller tre horisontalt i bredden, med variabel font og bildestørrelse for å matche vertikalt med naboen.

«Utrolig frustrerende for utviklere, digg for pirkete journalister.»

Du skjønner, de aller fleste norske nettaviser, fra Dagbladet til VG tviholder på et grafisk grensesnitt for forside-redigering, hvor spesialfolk sitter dag og ut dag inn og justerer høyde på tekst og bilder. Slik at alt skal matche horisontalt.

Utrolig frustrerende for utviklere, digg for pirkete journalister.

Det gidder ikke vi lenger! Og vi tror brukeropplevelsen blir bedre i den nye versjonen av kode24.

kode24-koden var tidligere stappfull av slike callbacks. 📸: Jørgen Jacobsen
kode24-koden var tidligere stappfull av slike callbacks. 📸: Jørgen Jacobsen Vis mer

Spaghettikode med jQuery

Okay - vi bruker fortsatt jQuery på kode24. Og det funker helt fint i 2021 også det.

Det har å gjøre med at halve siden vår lever hos et CMS som tegner ut HTML-en for oss på serveren. I fremtiden begynner vi kanskje å bruke API-ene deres hodeløst med NextJS eller lignende, men dessverre er ikke tiden moden for det.

Dermed er jQuery et ganske passende verktøy for å manipulere eksisterende elementer på kode24, og legge til nye.

jQuery oppdateres faktisk fortsatt for å holde tritt med JavaScript, derfor finner du (forhåpentligvis) ikke et eneste spaghettikode-callback i koden vår nå. Alt er promise-basert og vi bruker ES6 kode og ny funksjonalitet uten polyfills.

Vi er heldige som har lesere med oppdaterte nettlesere!

Vi vil høre fra deg

Vi håper du liker nye kode24. Vi har laget og designet hele sulamitten sjøl, så dette er kode24 sitt eget formspråk ut og inn.

Vi har til og med beholdt open source-fonten IBM Plex fra forrige versjon, for å skape litt kontinuitet.

Nå vil vi høre fra deg. Har du funnet en bug? Har du forslag til en endring? Eller har du bare lyst til å rose oss opp i skyene?

Fyr av en mail til oss på hei@kode24.no, da vel!

Rettelse: Vi skrev tidligere at Amedia justerer forsidene sine manuelt. Det er feil. Amedia sine forsidedesign er automatiserte.