Introduksjon til Nettsideutvikling
Webutvikling handler om å skape opplevelser på internett. For å gjøre dette bruker vi spesifikke språk som nettleseren forstår.
🌐 Nettleserens rolle
En nettleser (som Chrome, Firefox, Safari eller Edge) er et program designet for å lese og tolke kode. Når du besøker en nettside, laster nettleseren ned tekstfiler med kode (HTML, CSS, JS) og oversetter disse instruksjonene til det grafiske resultatet du ser på skjermen.
Byggeklossene
For å lage en moderne nettside trenger vi hovedsakelig to språk som jobber sammen, men har helt ulike oppgaver:
HTML
HyperText Markup Language
HTML er innholdet og strukturen. Det forteller nettleseren hva som skal være på siden og i hvilken rekkefølge.
- Overskrifter
- Avsnitt (tekst)
- Bilder
- Knapper og lister
CSS
Cascading Style Sheets
CSS er utseendet og stilen. Det forteller nettleseren hvordan innholdet skal se ut.
- Farger og bakgrunner
- Skrifttyper (fonter)
- Plassering (layout)
- Avstander og størrelser
En Viktig Regel: Hold det adskilt 🚫
I profesjonell webutvikling er det et viktig prinsipp å holde struktur og utseende separat (Separation of Concerns).
- ❌ Ikke bruk HTML for utseende: Unngå gamle metoder som å bruke
<b>bare for å gjøre tekst fet (bruk CSSfont-weighti stedet), eller tabellelementer<table>for layout. - ❌ Ikke bruk CSS for innhold: Tekst og informasjon skal ligge i HTML-filen, ikke gjemmes bort i CSS-filer
(f.eks. via
content-egenskapen).
✅ Når du skiller disse, blir koden ryddigere, lettere å vedlikeholde, og nettsiden fungerer bedre på alle enheter (mobil, PC, skjermlesere).
🧪 Arbeidsmetoden: Prøve og Feile
Programmering og koding er en praktisk ferdighet. Det er umulig å huske alt i hodet til enhver tid. Den mest effektive måten å jobbe på er en syklus av eksperimentering:
Skriv kode
Lagre filen
Se resultatet i nettleseren
Juster og gjenta
"En ekspert er en person som har gjort alle de feilene som er mulige å gjøre innenfor et smalt felt." – Niels Bohr