Jeg har nettopp publisert en bak kulissene-artikkel om hvordan vi bygger CMS Conf 2026-nettsiden, og det er mye mer enn “bare en landingsside”.
I artikkelen går jeg gjennom:
- hvorfor vi valgte Astro 5 + Tailwind CSS 4 for ytelse og vedlikehold,
- hvordan vi bruker et Git-nativt headless CMS (Pages CMS) i stedet for en tradisjonell backend,
- hva vi gjorde rundt SEO, Schema.org og hendelse-spesifikk strukturerte data,
- og hvordan vi forbereder nettstedet for AI-først-fremtiden av søk med ting som llm.txt, llm.json og automatiserte oppdateringer under byggeprosessen.
Det er en praktisk historie om design, frontend-arkitektur, content-workflows og optimalisering for både søkemotorer og LLM-er, bygget av et lite, fokusert team.
Hvis du er interessert i moderne konferanse-nettsteder, statiske arkitekturer, eller AI-klar SEO, kan du finne det nyttig.
#Astro #TailwindCSS #SEO #LLMO #AISEO #HeadlessCMS #StaticSites #CMSConf
Bygging av EN konferanse-nettside i 2026: Hvorfor vi valgte Astro 5, tailwind 4 og EN AI-først-tilnærming
Mariusz Szatkowski Developer {WordPress | WooCommerce | AI | GEO | AEO | LLMO}
- desember 2025
Da vi startet planleggingen av den digitale tilstedeværelsen for CMS Conf 2026, visste vi at standard “WordPress-tema + plugins”-ruten ikke kom til å cutte det. Vi ville ha noe annet. Vi trengte en side som ikke bare var en brosjyre, men en høytytende content-plattform, rask, vedlikeholdbar og eksplisitt designet for AI-alderen.
Her er historien om hvordan vår nettside-team, Agnieszka Palmowska, Maciek Palmowski og jeg, bygget fundamentet for CMS Conf 2026 ved å bruke en moderne stack som er sweet spot for webutvikling nå.
1. Hastighet som standard: Astro 5 & tailwind CSS 4
Vi valgte Astro 5 av en enkel grunn: ytelse er en funksjon.
Som standard sender Astro null JavaScript til klienten. Dette betyr at sidene våre lastes umiddelbart, noe som er kritisk for mobilbrukere som sjekker programmet eller foredragsholdere på ustødig konferanse-wifi. Vi kombinerte dette med Tailwind CSS 4 (ved å bruke den nye Vite-pluginen), som har vært en åpenbaring.
Vi målte implementeringen i mange verktøy, ett av dem var Google PageSpeed Insights og her er resultatene:
Artikkelinnhold 100 oppnådd
Men la meg forklare hva dette faktisk betyr i praksis. Når vi snakker om “null JavaScript,” snakker vi ikke bare om mindre pakkestørrelser. Vi snakker om en fundamental endring i hvordan vi tilnærmer oss webutvikling. Tradisjonelle SPA-er (Single Page Applications) sender ofte hundrevis av kilobytes JavaScript bare for å rendere det som kunne vært enkel statisk innhold. Astro snur denne modellen på hodet.
Slik fungerer det: Astro rendrer hele nettstedet ditt til statisk HTML ved build-tid. Det “hydrerer” kun interaktive komponenter når nødvendig, og selv da gjør det det intelligent. Hvis du har en komponent som må være interaktiv (som en navigasjonsmeny eller et skjema), kan Astro isolere bare den komponenten og laste JavaScript for den uavhengig, og la resten av siden være lettvektig HTML.
Denne tilnærmingen gir oss det beste fra begge verdener: ytelsen til statiske nettsteder med interaktiviteten til moderne webapplikasjoner når vi trenger det.
Teknisk tips: Hvis du går over til Tailwind 4, bruk @tailwindcss/vite-pluginen. Den kompilerer CSS-en din på millisekunder, noe som gjør utvikleropplevelsen utrolig rask. Vi implementerte også LightningCSS (Rust-basert) for minifisering og bygde en tilpasset Vite-plugin for å forhåndsinhente kritisk CSS, og eliminerte den forstyrrende “flash of unstyled content” (FOUC).
La meg dykke dypere i vårt Tailwind CSS 4-oppsett. Den nye versjonen introduserer en helt ny arkitektur. I stedet for å skanne filene dine for klassenavn ved build-tid, bruker Tailwind 4 CSS-in-JS med Vite-pluginen for å generere stiler på farten. Dette betyr:
- Umiddelbar HMR: Når du endrer en klasse, oppdateres CSS umiddelbart uten full gjenoppbygging
- Mindre pakker: Kun klassene du faktisk bruker er inkludert
- Bedre TypeScript-støtte: Full autofullføring og type-sjekking for utility-klasser
Vi implementerte også et tilpasset design-token-system med Tailwinds CSS-variabel-funksjon. Dette lar oss opprettholde konsistens på tvers av nettstedet mens vi fortsatt har fleksibiliteten til å overstyre verdier når nødvendig. For CMS Conf definerte vi vår fargepalett, typografi-skala og avstandssystem som CSS-variabler, og deretter refererte til dem i vår Tailwind-konfigurasjon.
Våre ytelsesoptimaliseringer stoppet ikke der. Vi implementerte:
- Kritisk CSS-inlining for innhold over folden
- Lazy loading for bilder og iframes
- Ressurs-hints (preconnect, prefetch, preload) for eksterne ressurser
- Service worker for offline-funksjonalitet
- CDN-optimalisering med automatisk bildeoptimalisering
Resultatet? Vår largest contentful paint (LCP) er under 1.5 sekunder på 3G-tilkoblinger, og nettstedet vårt scorer 100 på alle Core Web Vitals.
2. Styrke teamet: Pages CMS
En vanlig flaskehals i statiske nettsted-prosjekter er content-håndtering. Utviklere elsker Markdown; markedsførings-team… ikke så mye.
Maciek løste dette ved å integrere Pages CMS (https://pagescms.org). Det er et briljant headless CMS som fungerer direkte med ditt GitHub-repository. Det gir vårt content-team et vennlig UI for å administrere blogginnlegg og forfatterprofiler, men under panseret er det bare å committe endringer til repoet vårt.
Hvorfor dette fungerer:
- Zero Infrastructure: Ingen database å vedlikeholde, ingen servere å patche.
- Git-Nativ: Hver content-endring utløser vår CI/CD-pipeline, og sikrer at ingenting går i stykker.
- Kostnad: Det er gratis for offentlige repositories.
Men la meg forklare hvordan vi faktisk implementerte dette i praksis. Den tradisjonelle CMS-tilnærmingen involverer ofte en separat database, autentiseringssystem og API-lag. Dette legger til kompleksitet, kostnad og potensielle sikkerhetshull. Pages CMS tar en helt annen tilnærming.
Her er vårt oppsett: Vi opprettet et dedikert content-katalog i vårt repository med klare mappestrukturer for forskjellige content-typer:
content/
├── blog/
│ ├── post-1.md
│ └── post-2.md
├── speakers/
│ ├── speaker-1.md
│ └── speaker-2.md
└── schedule/
├── day-1.md
└── day-2.mdHver Markdown-fil inkluderer en frontmatter-seksjon med strukturerte metadata:
---
title: "Bygging av Moderne Konferansenettsteder"
author: "Mariusz Szatkowski"
date: "2025-12-18"
tags: ["astro", "tailwind", "cms"]
status: "published"
featured: true
---Pages CMS leser disse filene og presenterer dem i et brukervennlig grensesnitt. Vårt content-team kan:
- Create nytt content gjennom en web-basert editor med live preview
- Edit eksisterende content med en rich text editor som outputs ren Markdown
- Administrere media ved å laste opp bilder som automatisk optimaliseres og lagres i vårt repository
- Review endringer gjennom et innebygd workflow-system med draft/published-stater
- Samarbeide med kommentarer og forslag direkte i CMS
Skjønnheten i denne tilnærmingen er at når noen gjør en endring i Pages CMS, skaper det en pull request i vårt GitHub-repository. Dette betyr:
- Alle endringer går gjennom vår vanlige code review-prosess
- Vi kan kjøre automatiserte tester på content-endringer
- Vi har et komplett revisjonsspore av hver modifikasjon
- Vi kan rulle tilbake endringer om nødvendig
- Vi kan deploye content-oppdateringer uavhengig av kodeendringer
Vi implementerte også tilpassede valideringsregler for å sikre content-kvalitet. For eksempel krever vi at alle blogginnlegg har:
- Minimums ordantall på 500
- Minst ett fremhevet bilde
- Riktige SEO-metadata
- Ingen ødelagte interne lenker
Disse valideringene kjører automatisk når content lagres, og gir umiddelbar feedback til vårt content-team.
Integrasjonen med vår build-prosess er sømløs. Når content-endringer merges til main, kjører vår CI/CD-pipeline automatisk:
- Bygger nettstedet med nytt content
- Kjører tilgjengelighets- og ytelsestester
- Deployer til produksjon
- Invaliderer CDN-cache
- Sender varslinger til relevante teammedlemmer
Denne Git-baserte tilnærmingen har transformert hvordan vi håndterer content. Vårt markedsførings-team kan nå gjøre oppdateringer uten utvikler-intervensjon, mens vi beholder full kontroll over den tekniske implementasjonen.
3. Det “usynlige” arbeidet: Avansert SEO & schema
Ranking i 2026 krever mer enn bare nøkkelord. Du trenger struktur.
Vi gikk dypt i Schema.org-implementering. Vi bygget en tilpasset SchemaOrg.astro-komponent som dynamisk genererer JSON-LD strukturerte data for hver side.
Hva vi implementerte:
- Organisasjonsschema: Identifisering av Openweb S.C. som juridisk enhet.
- Hendelsesschema: Gi Google med presise datoer, lokasjon (PPNT Gdynia) og billettinformasjon.
- @id Linking: Avgjørende bruker vi @id-referanser for å “koble prikkene” mellom organisasjonen og hendelsen i Googles Knowledge Graph.
Pro Tips: Ikke stol på standard SEO-plugins for å gjøre alt. Tilpasse din Schema for å koble enhetene dine (f.eks. koble din Hendelse til din Organisasjon via IDer) er et kraftig signal til søkemotorer om hvem du er og hva du gjør.
4. Optimalisering for AI-alderen (llm)
Dette er min favorittdel. Søk endrer seg. Folk spør ChatGPT og Perplexity om hendelser like ofte som de bruker Google. For å sikre at disse AI-systemene gir nøyaktige svar om CMS Conf, optimaliserte vi nettstedet for dem.
Vi implementerte en llm.txt-fil i roten av nettstedet vårt.
Tenk på det som robots.txt, men for LLM-er. Det gir et strukturert, kontekst-rikt sammendrag av hele konferansen, foredragsholdere, datoer, tech-stack, eksplisitt formatert for AI-inntak. Vi skrev til og med et tilpasset Node.js-skript (scripts/update-llm-txt.js) som kjører ved build-tid for å skanne metadataene våre og holde denne filen perfekt oppdatert.
Resultatet? Når en AI crawler nettstedet vårt, trenger den ikke å gjette. Vi forteller den nøyaktig hva CMS Conf er.
5. Automatisert kvalitetskontroll
Til slutt automatiserte vi de kjedelige tingene. Vi satte opp pre-build-sjekker med astro-link-validator for å sikre at vi aldri sender en ødelagt lenke. Vi validerte omdirigeringene våre i astro.config.mjs for å håndtere legacy-URLer på en elegant måte.
Oppsummeringen
Å bygge CMS Conf-nettsiden handlet ikke bare om kode; det handlet om å skape et system som tjener brukerne våre (hastighet), teamet vårt (vedlikeholdbarhet) og maskinene som hjelper folk med å finne oss (SEO & AI).
Hvis du bygger en content-rik nettside i 2026, anbefaler jeg på det sterkeste å se på denne Astro + Tailwind + Git-baserte CMS-arkitekturen. Den er slank, den er rask, og den skalerer vakkert.
Se den på: https://cmsconf.com/
Vi er bare i startgropen. Se deg i Gdynia i november!
#WebDevelopment #AstroJS #TailwindCSS #SEO #AI #CMSConf2026 #TechStack
