# HTML Øvelsesopgave: Byg en blogmockup ## Læringsmål Anvend din HTML-viden ved at designe og kode en komplet blogforside. Denne praktiske opgave vil styrke dine begreber om semantisk HTML, bedste praksis for tilgængelighed og professionelle færdigheder inden for kodeorganisation, som du vil bruge gennem hele din webudviklingsrejse. **Ved at fuldføre denne opgave vil du:** - Øve dig i at planlægge webside-layouts før kodning - Anvende semantiske HTML-elementer korrekt - Skabe tilgængelig og velstruktureret markup - Udvikle professionelle kodningsvaner med kommentarer og organisering ## Projektkrav ### Del 1: Designplanlægning (Visuel mockup) **Lav en visuel mockup af din blogforside, der inkluderer:** - Header med sidetitel og navigation - Hovedindholdsområde med mindst 2-3 blogindlæg - Sidebar med yderligere information (om-sektion, seneste indlæg, kategorier) - Footer med kontaktinformation eller links **Muligheder for mockup-oprettelse:** - **Håndtegnet skitse**: Brug papir og blyant, og tag derefter et foto eller scan din design - **Digitale værktøjer**: Figma, Adobe XD, Canva, PowerPoint eller enhver tegneapplikation - **Wireframe-værktøjer**: Balsamiq, MockFlow eller lignende wireframe-software **Mærk dine mockup-sektioner** med de HTML-elementer, du planlægger at bruge (f.eks. "Header - `
`", "Blogindlæg - `
`"). ### Del 2: HTML-elementplanlægning **Lav en liste, der kortlægger hver sektion af din mockup til specifikke HTML-elementer:** ``` Example: - Site Header →
- Main Navigation →