Snøhetta
Sammen med Snøhetta Design bygget vi vinteren 2023 de nye globale nettsidene til Snøhetta.
Med Snøhettas fokus på bærekraft og tilgjengelighet, var det naturlig for Snøhetta Design å sette dette i høysetet da de skulle lage de nye nettsidene. Det er lett å glemme at det som skjer digitalt og i "skyen" faktisk har et fotavtrykk. Serveren som nettsiden ligger på, routerne den passerer gjennom på sin vei gjennom internett, og enheten som skal vise den til brukeren – alt bruker energi. Selv om det er vanskelig å måle nøyaktig hvor mye ressurser en nettside bruker, er det et par ting vi vet spiller inn:
- Hvor mye data som må overføres for å vise nettsiden
- Hvor mye ressurser brukerens enhet trenger for å vise nettsiden
Så vi hoppet med dødsforakt inn i prosjektet, med et mål om å lage en interessant og velfungerende nettside, som samtidig forsøkte å adressere disse to punktene. Hvordan det gikk? Les videre.
Teknologi
- Craft CMS
- Azure Active Directory SSO
- OpenAsset
Bilder – den store synderen
Bilder og video utgjør en veldig stor andel av størrelsen på de fleste nettsider. En nettside med kun tekst hadde vært det aller beste, men er urealistisk for de fleste selskaper. Og for Snøhetta er det essensielt å kunne dokumentere prosjektene sine ved hjelp av bilder. Det var derfor naturlig å begynne med å se på hvordan vi kunne optimalisere disse utover å tilpasse, komprimere dem, og benytte moderne filformater som WebP og AVIF, som vi normalt gjør.
Vi utforsket ulike retninger, men det ble ganske fort tydelig at noen av retningene var mer visuelt interessante enn andre. Redusering av antall farger, dithering og oppskalering av bilder uten anti-aliasing, skapte et uttrykk som brakte tilbake minner fra tiden da CGA, EGA og VGA var skjerm-standardene, og Monkey Island var det beste spillet som var laget.
Vi mimret og eksperimenterte, og kom etterhvert frem til noe vi likte (16 farger, Floyd–Steinberg dithering, GIF og 2-4 ganger oppskalering). Dette ga oss et distinkt visuelt uttrykk, og en besparelse på 60-80% av filstørrelsen.
Optimalisér, optimalisér, optimalisér
Med bildene unnagjort gjøv vi løs på alle de andre tingene vi kunne optimalisere.
Javascript er den store synderen når det kommer til ressursbruk lokalt på brukerens enhet, så vi minimerte bruken og delte opp koden i mindre biter slik at de kunne lastes ved behov. Vi laget en forenklet modus der animasjoner og interaktivitet minimeres, og enda mindre Javascript lastes.
I tillegg tok vi i bruk statisk side-caching for å minimere ressursbruken på serveren, og la ressurser bak en CDN slik at disse lastes fra tilgangspunkter nærmere brukeren. Som med alle nettsider vi drifter ligger nettsiden på datasentre hos DigitalOcean som drives av grønn energi.
Resultatet ble en uvanlig lettbeint nettside, som i forenklet modus med low-res bilder er som en fjær å regne.
En enklere redaktør-hverdag
Snøhettas gamle nettløsning var bygget på en proprietær publiseringsløsning der innhold og design var tett knyttet sammen. Dette opplevdes som tungvindt og lite fleksibelt for redaktørene hos Snøhetta. Resultatet var at få personer var involvert i publisering av innhold, og at nettsiden ofte føltes utdatert.
Vi bygget nettsiden på Craft CMS, der innhold og design er uavhengig av hverandre. Vi modellerte innholds-strukturen slik at den var intuitiv for de oppgavene som redaktørene hos Snøhetta skulle utføre, og laget en verktøykasse med moduler som ga stor fleksibilitet.
I tillegg integrerte vi Snøhettas single sign-on løsning i Microsoft Azure, både for å gjøre terskelen for å bruke Craft lavere, og for økt sikkerhet og enklere tilgangs-styring. Vi integrerte også Snøhettas mediebibliotek hos OpenAsset, slik at redaktørene enkelt kan finne og bruke bilder derfra på en sømløs måte i Craft.
Etter en kort video-opplæring, var Snøhetta-ansatte fra hele verden raskt i gang med å publisere innhold i et forrykende tempo.
Pluss litt ekstra kreativitet på toppen
Som om ikke det var nok utviklet de kreative utviklerne hos Snøhetta ut noen ekstra, mer eksperimentelle moduler, som vi også integrerte i løsningen.
Til slutt satt vi igjen med en effektiv, interessant, fleksibel og skalerbar løsning, som kan vokse i takt med Snøhettas økende globale ambisjoner.
