Øvelse: Design et nyhedsbrev til “Poteliv” 🐾

Du skal bygge et nyhedsbrev til en webshop, der sælger produkter til kæledyr. Øvelsen træner arbejde med tekstfelter, billeder og figurer/layout (cards, badges, bokse og grid).

Tid: 45–90 min
Fokus: Tekstfelter, billeder, figurer
Format: HTML + CSS
Output: Et færdigt nyhedsbrev (1 side)

Opgavebeskrivelse

Du bygger et nyhedsbrev til Poteliv. Du får forslag til indhold (artikler, nye produkter og månedens fotovinder), men du skal selv indsætte/tilpasse tekst og billeder samt style layoutet.

Mål: Arbejde med tekstfelter (overskrifter/afsnit/CTA), billeder (hero + produkt + vinder), og figurer/layout (cards, grid, badges, bokse, afstand og linjer).
📌 Det du skal lave (trin for trin)
  1. Branding: Tilpas logo/brandtekst (Poteliv + tagline).
  2. Hero: Indsæt et bannerbillede og skriv en fængende overskrift.
  3. Korte artikler: Tilpas 2 artikler (titel + 3–5 linjer hver).
  4. Nye produkter: Lav 3 produktkort med billede, beskrivelse og pris.
  5. Månedens vinder: Indsæt vinderfoto og tekst (navn + begrundelse).
  6. Call-to-action: Lav en tydelig knap (fx “Se nyhederne” / “Shop nu”).
  7. Finish: Tilføj footer (kontakt, afmelding, SoMe-links som tekst).
🧠 Regler (så du ikke ender i HTML-sumpen)
  • Brug h2/h3/h4 til overskrifter og p til brødtekst.
  • Udskift billed-URL’erne med egne billeder (eller brug midlertidige online billeder).
  • Hold teksten kort — et nyhedsbrev er ikke en roman (selvom du gerne vil).

✅ Afkrydsning (selvtjek)

Tip: Hvis du vil gøre øvelsen ekstra “rigtig”, så gør din CTA til et link: <a class="cta" href="https://poteliv.dk">Shop nu</a> (men du behøver ikke have en rigtig webshop).

Skabelon (kursisten skal udfylde felterne)

Nedenfor er “previewet”. Du skal redigere tekst og billedlinks direkte i HTML’en.

Poteliv

Nyheder, tips og lækre godbidder til dit kæledyr

Poteliv banner

🐶 Marts-nyt: Forårsrengøring, snacks og en stjerne på fire ben

I denne måned har vi nye produkter, små tips til hverdagen – og en fotovinder, der næsten får os til at sige “vov” på kontoret.

Se månedens nyheder

📰 Korte artikler

Artikel 1: “3 nemme hacks til mindre fældning”

Foråret betyder… pels overalt. Prøv en fast børsterutine, en god fodersammensætning og en “pels-venlig” støvsugerstrategi. (Ja, det er en ting. Nej, vi dømmer dig ikke.)

Artikel 2: “Aktivitetslegetøj der trætter hjernen”

Snusemåtter og foderlabyrinter giver mental stimulering. 10 minutter kan føles som en lang gåtur for mange kæledyr. Bonus: Du får en kop kaffe i fred.

💡 Opgave: Tilpas artiklerne
Skift titler og tekst så de passer til din målgruppe (hund/kat/kanin). Hold hver artikel på 3–5 linjer.

🏆 Månedens fotovinder

Månedens vinder
Vinder: “Bella” (Golden Retriever)

Bella vandt med billedet “Jeg hjælper med at pakke varer (næsten)”. Dommerpanelet var enige: 10/10 pote-charme.

Præmie: 1x Snackbox + 1x legetøj efter eget valg

💡 Opgave: Tilpas vinderen
Udskift navn, race/dyr og begrundelse. Brug 2–4 linjer + én præmie-linje.

🛍️ Nye produkter i shoppen

Opgave: Lav 3 produktkort med billede, kort tekst, pris og evt. “badge”.

Produkt 1
NYHED
Snusemåtte “Næse-Ninja”
Perfekt til mental stimulering – gem godbidder og lad næsen arbejde.
199 kr.
Produkt 2
POPULÆR
Kattehule “Mørkets Herre”
Blød, varm og totalt uigennemtrængelig for støvsugeren (næsten).
249 kr.
Produkt 3
LIMITED
Godbidder “Kylling & Gulerod”
Kornfri snack – ideel til træning og “kom-her-nu-please” øjeblikke.
59 kr.
💡 Opgave: Gør produkterne “dine”
Skift produktnavne, priser og billeder. Tilføj evt. et 4. produktkort hvis du er hurtig.

🚀 Call-to-action

Opgave: Tilpas teksten på knappen og tilføj et link (kan være #).

Shop forårets nyheder