Gå til kurv

Lav en hjemmeside med AI og læg den online

Senest opdateret

ChatGPT, Claude og lignende AI-værktøjer kan hjælpe dig med at lave en enkel hjemmeside, også selvom du ikke har prøvet at skrive kode før. Du beskriver siden med almindelige ord, ser resultatet på din egen computer og beder AI'en om ændringer, indtil du er tilfreds.

Når hjemmesiden er klar, kan du lægge filerne på et webhotel og vise siden på dit eget domæne.

Få din AI-lavede hjemmeside online for kun 25,-/mdr. (med e-mail)

Vores XSmallsite-webhotel koster 25,-/mdr. inkl. moms (20,- ekskl. moms) og faktureres årligt. Det er nok til en statisk hjemmeside som den i denne guide, og du får e-mail oveni. Domænet betales separat.

Hvornår er en AI-lavet hjemmeside et godt valg?

En lille hjemmeside behøver ikke altid et administrationssystem. Skal du lave en firmaside, en præsentation, en portefølje eller en side til et enkelt arrangement, kan almindelige HTML-, CSS- og JavaScript-filer være nok. Det kaldes en statisk hjemmeside.

En statisk hjemmeside har ingen database og skal ikke bygge siden på ny, hver gang nogen besøger den. Derfor vil den normalt være hurtig uden et caching-plugin. WordPress er ikke nødvendigvis langsomt, men temaer, plugins og sidebyggere kan hurtigt gøre siden tungere og øge behovet for optimering.

WordPress, temaer og plugins skal holdes opdateret. Nogle plugins kræver også en betalt licens for fortsat at modtage opdateringer. WordPress er samtidig så udbredt, at sårbarheder ofte bliver udnyttet af automatiske angreb. En statisk hjemmeside har færre bevægelige dele og kræver derfor typisk mindre løbende vedligeholdelse. Det betyder ikke, at kode lavet af AI automatisk er sikker. Du skal stadig gennemgå og teste den.

For mange er det også lettere at beskrive en ændring med almindelige ord end at lære WordPress-menuer, blokke, temaer og indstillinger. Du kan f.eks. bede AI'en om at flytte kontaktoplysningerne, ændre farverne eller tilføje en ny underside. Til gengæld findes der ikke et administrationspanel på den færdige statiske hjemmeside. Senere ændringer sker i filerne, eventuelt med hjælp fra AI.

Hvornår er f.eks. WordPress bedre?

WordPress kan være et bedre valg, hvis flere personer skal kunne logge ind og redigere indhold, eller hvis du ofte udgiver artikler. Det samme gælder, hvis hjemmesiden skal have avancerede funktioner som medlemslogin, kommentarer eller en webshop.

AI kan godt hjælpe med sådanne løsninger, men de er ikke længere en enkel statisk hjemmeside. De kræver normalt en database, kode på serveren eller forbindelse til eksterne tjenester.


Før du går i gang

Du skal bruge:

  • adgang til ChatGPT, Claude eller et tilsvarende AI-værktøj

  • en mappe på din computer til hjemmesidens filer

  • et domæne og et webhotel hos Netsite

  • de tekster, billeder og kontaktoplysninger, du vil vise

Brug kun billeder og tekster, som du selv har rettighederne til. Upload heller ikke fortrolige dokumenter til AI-værktøjet.

Del aldrig adgangskoder eller personlige oplysninger

Skriv ikke adgangskoder, API-nøgler, personoplysninger eller indholdet af .env-filer i en AI-chat. Den slags oplysninger må heller ikke ligge i hjemmesidens offentlige mappe.


Trin 1: Beskriv hjemmesiden for AI'en

Opret en ny samtale i ChatGPT eller Claude. Beskriv, hvem hjemmesiden er til, hvilke sider eller afsnit den skal have, og hvordan den gerne må se ud. Jo mere konkret du er, desto mindre skal du rette bagefter.

Du kan tage udgangspunkt i denne prompt og erstatte teksten i kantede parenteser:

TEXT
Lav en enkel, færdig hjemmeside til [virksomhed eller formål].

Målgruppen er [beskriv målgruppen].
Hjemmesidens vigtigste formål er [beskriv, hvad de besøgende skal kunne finde eller gøre].
Hjemmesiden skal indeholde [beskriv sider eller afsnit].
Stilen skal være [beskriv farver, udtryk og stemning].

Jeg har ikke erfaring med at skrive kode. Jeg vil først se hjemmesiden på min egen computer og senere uploade filerne til mit XSmallsite-webhotel hos Netsite.

Tekniske krav:
- Brug index.html, styles.css og kun script.js, hvis JavaScript er nødvendigt. Eventuelle ekstra sider skal også være HTML-filer.
- Hjemmesiden skal fungere ved at åbne index.html direkte i en browser, uden installation eller særlige programmer.
- De samme filer skal kunne uploades til webhotellet uden yderligere behandling.
- Brug relative stier til hjemmesidens egne filer, billeder og sider.
- Brug ikke PHP, WordPress, React, Node.js, npm, en database, serverkode eller en build-proces.
- Brug ikke eksterne scripts, skrifttyper, statistikværktøjer eller andre tjenester, medmindre jeg udtrykkeligt beder om det.
- Medtag alle nødvendige billeder og andre ressourcer som lokale filer.
- Brug ingen API-nøgler, adgangskoder eller andre hemmelige værdier.

Design og indhold:
- Brug semantisk HTML og et responsivt layout, der fungerer på mobil og computer.
- Sørg for læsbar kontrast, tydelig tastaturfokus og meningsfulde alt-tekster til informative billeder. Dekorative billeder skal have tom alt-tekst.
- Skriv på dansk i et klart og naturligt sprog.
- Opfind ikke kontaktoplysninger, kundeudtalelser eller andre faktuelle oplysninger. Markér tydeligt, hvor jeg skal indsætte mine egne oplysninger.
- Brug telefon- og e-maillinks til kontakt. Tilføj ikke en kontaktformular, booking, betaling eller login, der kræver en server eller ekstern tjeneste.

Levering:
- Opret de færdige filer, så jeg kan hente dem. Saml dem helst i én ZIP-fil med index.html øverst og alle nødvendige filer inkluderet.
- Hvis du kan gemme direkte på min computer, skal du samle filerne i én mappe og fortælle mig, hvor den ligger.
- Hvis du ikke kan oprette filer til download eller gemme dem på min computer, skal du sige det tydeligt og i stedet vise det fulde indhold af hver fil i separate kodeblokke med filnavnet over.
- Giv mig en kort trinvis vejledning til at hente filerne, pakke en eventuel ZIP-fil ud og åbne index.html i min browser.
- Forklar, at jeg bagefter skal uploade de udpakkede filer og eventuelle undermapper til webhotellets mappe til hjemmesiden, med mappestrukturen bevaret.
- Læg en eventuel vejledning uden for selve hjemmesidens filer.
- Når jeg beder om ændringer, skal du levere en opdateret samlet version af filerne, så jeg ikke selv skal rette i koden.

Spørg kun om oplysninger, der er nødvendige for at komme i gang. Lav ellers et første udkast, som jeg kan se og bede dig ændre.

Hvis AI'en stiller spørgsmål om indhold eller design, så besvar dem, før den skriver filerne. Faktuelle oplysninger som priser, åbningstider og kontaktoplysninger skal du selv kontrollere.


Trin 2: Gem filerne på din computer

Opret en ny mappe, f.eks. min-hjemmeside. Nogle AI-værktøjer lader dig hente filerne direkte. Hvis du får koden vist i kodefelter, skal du kopiere hvert felt til en teksteditor og gemme det med det filnavn, AI'en har angivet. Forsiden skal hedde index.html med små bogstaver. Kontrollér også, at filerne ikke ved en fejl er blevet gemt som index.html.txt eller styles.css.txt. Brug en almindelig teksteditor, ikke Word eller et andet tekstbehandlingsprogram.

En enkel mappe kan f.eks. se sådan ud:

TEXT
min-hjemmeside/
├── index.html
├── styles.css
├── script.js
└── billeder/
    └── forside.jpg

Hvis AI'en har lavet flere HTML-sider, skal de ligge i den struktur, som links og menuer forventer. Flytter eller omdøber du en fil, kan links og billeder holde op med at virke.


Trin 3: Test og ret hjemmesiden

Dobbeltklik på index.html for at åbne hjemmesiden i din browser. Gå alle sider og links igennem, og gør browservinduet både smalt og bredt for at se siden som mobil og computer.

Når du vil ændre noget, kan du indsætte de nuværende filer i AI-samtalen og beskrive rettelsen. Bed AI'en om at sende den fulde, opdaterede fil. Så er der mindre risiko for, at du placerer en enkelt kodeændring det forkerte sted.

Kontrollér især:

  • at tekster, priser, adresser, telefonnumre og e-mailadresser er korrekte

  • at menu, links, knapper og eventuelle formularer virker som forventet

  • at billeder må bruges, har passende filstørrelse og har beskrivende alt-tekster

  • at siden kan bruges med tastatur og er let at læse på en mobil

En kontaktformular virker ikke alene, fordi den vises på siden. Den skal sende oplysningerne til en tjeneste eller kode på serveren. Brug ikke en formular, før du ved, hvor oplysningerne bliver sendt hen, og hvordan personoplysningerne bliver behandlet.


Trin 4: Læg hjemmesiden på dit webhotel med WebFTP

WebFTP er Netsites webbaserede filhåndtering. Du bruger den direkte i browseren og behøver derfor ikke installere et FTP-program.

  1. Har du ikke allerede en FTP-adgangskode, skal du først oprette den i kontrolpanelet. FTP-adgang er slået fra, indtil du selv vælger en adgangskode.

  2. Åbn webftp.netsite.dk.

  3. Log ind med dit domæne uden www (f.eks. eksempel.dk) og din FTP-adgangskode.

  4. Åbn mappen web. Det er den offentlige mappe, som dit domæne viser indholdet fra.

  5. Klik på uploadikonet (pilen op) nederst til venstre. Vælg Upload Fil... for at vælge en eller flere filer eller Upload Mappe... for at overføre en mappe.

  6. Sørg for, at index.html, styles.css og de øvrige hjemmesidefiler ender direkte i web med den samme indbyrdes mappestruktur, som de havde på din computer.

  7. Åbn dit domæne i en ny browserfane, og kontrollér hjemmesiden igen.

Tag en kopi, før du erstatter en hjemmeside

Ligger der allerede en hjemmeside i mappen web, bør du hente en kopi af filerne, før du erstatter eller fjerner dem. En eksisterende index.php kan tilhøre WordPress eller et andet system og bliver vist før din nye index.html.

Hvis hele mappen min-hjemmeside bliver placeret som en undermappe i web, vil forsiden ligge på en adresse som eksempel.dk/min-hjemmeside/. Flyt i så fald indholdet ud af mappen, så index.html ligger direkte i web.

Har hjemmesiden mange eller store filer, kan et program som FileZilla være lettere at bruge. Forbind via SFTP med oplysningerne i guiden til FTP-serveroplysninger.


Hvis hjemmesiden ikke vises korrekt

Ser du siden "Her flytter en ny Netsite kunde ind", ligger index.html sandsynligvis ikke direkte i web, eller filnavnet er skrevet med stort begyndelsesbogstav. Webserveren skelner mellem store og små bogstaver, så Index.html og index.html er ikke det samme. Ser du den gamle hjemmeside, selvom index.html er uploadet, kan der ligge en index.php i samme mappe. Webserveren vælger index.php før index.html. Tag en kopi, og fjern eller omdøb kun filen, hvis du er sikker på, at den nye hjemmeside ikke bruger den. Hvis tekst og billeder vises uden design, mangler styles.css muligvis, eller stien til filen er forkert. Manglende billeder skyldes ofte det samme. Kontrollér, at filnavnet på serveren svarer præcist til navnet i HTML-koden, også når det gælder store og små bogstaver.

Brug helst små bogstaver, tal, bindestreg og understreg i filnavne. Undgå mellemrum samt æ, ø, å og andre specialtegn. Hvis en ændring ikke kan ses med det samme, kan du prøve at åbne siden i et privat browservindue.


Astro til en større statisk hjemmeside

Astro er et framework til indholdsrige hjemmesider og kan være et naturligt næste skridt, hvis siden vokser til mange undersider. Det giver bl.a. en fast struktur til sider og genbrugelige elementer som menu og sidefod. Astro har også værktøjer, som gør det lettere for AI-assistenter at arbejde med projektet.

Astro kræver, at Node.js er installeret på din computer, og at projektet bygges, før det kan lægges online. Vælg en statisk opsætning, kør byggekommandoen, og upload derefter indholdet af mappen dist til web. Filer med endelsen .astro er kildekode og kan ikke vises direkte af webhotellet.

Netsite arbejder på direkte udgivelse via MCP

Netsite arbejder på en MCP-løsning (Model Context Protocol), der skal gøre det muligt for kompatible AI-værktøjer at bygge og udgive enkle hjemmesider direkte på vores webhoteller. Målet er at lancere løsningen i 2027, men tidsplanen er endnu ikke endelig.

MCP-løsningen er ikke tilgængelig i dag. Indtil den er klar, er WebFTP den enkle vej fra filerne på din computer til hjemmesiden på dit domæne.