Om oppgaven

I denne oppgaven skal elevene bruke HTML-tags til å lage sin første hjemmeside.

Oppgaven passer til:

Fag: Programmering, Kunst og håndverk, IT1

Anbefalte trinn: 8. trinn - VG2

Tema: HTML, Web

Tidsbruk: Dobbeltime eller mer.

Kompetansemål

Kunst og håndverk, 7. trinn: bruke programmering til å skape interaktivitet og visuelle uttrykk
Programmering, 10. trinn: bruke flere programmeringsspråk, deriblant minst ett som er tekstbasert
IT1, VG2: designe og utvikle nettsider ved hjelp av markeringsspråk og programmering
IT1, VG2: lagre og hente fram data og presentere dem på nettsider
IT1, VG2: planlegge og implementere brukergrensesnitt
IT1, VG2: lese, strukturere, analysere og kommentere programkode

Forslag til læringsmål

Elevene klarer å bruke kjente HTML-tags til å lage et oppsett til egen hjemmeside.
Elevene klarer å inspisere en hjemmeside for å se hvordan den er oppbygd.
Elevene klarer å tolke en feil dersom elevene har skrevet feil HTML-tag.
Elevene klarer å lenke to sider sammen.
Elevene klarer å se at en nettside er bygget opp av HTML.
Elevene kan organisere enkel filstruktur til et nettsted.

Forslag til vurderingskriterier

Eleven oppnår middels måloppnåelse ved å fullføre oppgaven.
Eleven oppnår høy måloppnåelse ved å videreutvikle egen kode basert på oppgaven.

Forutsetninger og utstyr

Utstyr: Datamaskiner med tilgang internett og teksteditor (Atom, Visual Studio Code eller Brackets IO kan anbefales). JSBin.com kan evt. brukes. Elevene kan fint jobbe to og to.
Forutsetninger: Elevene burde kunne grunneleggende HTML-tags.

Fremgangsmåte

Her kommer tips, erfaring og utfordringer til hvert av stegene i den faktiske oppgaven. Klikk her for å se oppgaveteksten.

Steg 1: Åpne siden som heter om meg

Tekstprogram kan for eksempel være Atom, Visual Studio Code, Brackets IO eller NodePad++. Eventuelt bruke JSBin.com.
Noen elever vil kanskje ha problemer med å unzipe Internett.zip. Husk å be elevene huske hvor den er lastet ned slik at de finner den igjen.

Steg 2: Lag en hjemmeside om deg selv

Det er enkelt å skrive tegn og HTML-tags feil. Be elevene være obs på dette, spesielt når man skal lukke en HTML-tag.
Et tips kan være å be elevene strukturere HTML-dokumentet sitt ordentlig med innrykk og linjeskift slik at det er enklelt å hvilke HTML-tags som hører til hvor.

Steg 3: Lag en ny side og link til den

Når elevene skal lenke sammen sider er det viktig at HTML-sidene ligger i samme mappe og at de blir referert til på samme måte som en vanlig lenke.

Variasjoner

Elevene kan lage nye sider som kan lenkes sammen med Om meg-siden.
Eleven klarer å legge til mer innhold ved hjelp av HTML-tags.
Elevene kan prøve å finne nye HTML-tags til å bruke på hjemmesiden sin.

Forbedre denne siden

Funnet en feil? Kunne noe vært bedre?
Hvis ja, vennligst gi oss tilbakemelding ved å lage en sak på Github eller fiks feilen selv om du kan. Vi er takknemlige for enhver tilbakemelding!

Rapporter et problem

Gå til forumet

Vis koden og fiks selv