Projekt: Företagssida

Uppdraget

Du har skapat ett fiktivt företag, skrivit en persona med användarberättelser, kartlagt informationsarkitekturen med sitemap och wireframes, och kodat hero, positionering och hamburgermeny. Nu sätter du ihop allt till en komplett, publicerad och testad webbplats.

Det här är en inlämningsuppgift och den bedöms. Men vi arbetar som på riktigt: en verklig process, meningsfulla git-commits och dokumenterade beslut hela vägen.

Processen

Arbeta i den här ordningen:

1. Varumärkesanalys Bekräfta ditt fiktiva företags identitet: namn, bransch, ton (formell/informell), primärfärg, typsnittsstil.

2. Persona Gå tillbaka till ditt persona-indexkort och dina användarberättelser. Varje designbeslut du fattar ska kunna motiveras med “det hjälper [persona] att [mål]“.

3. Sitemap Tre till fyra sidor maximum. Bekräfta att varje sida har minst en användarberättelse som motiverar att den finns.

4. Wireframes Skissa hem-sidan (mobil + desktop) på papper innan du skriver en rad kod. Fotografera och spara i repot.

5. Repo och commits Skapa GitHub-repot om du inte redan gjort det. Första commit: docs: add readme with company description. Använd semantiska commit-meddelanden genom hela projektet.

6. Bygg Koda HTML och CSS med utgångspunkt i wireframes. Bygg mobile-first.

7. Komponenter efter behov I delarna byggde du hero, badge-kort och hamburgermeny. Nu avgör du vad den färdiga sidan faktiskt behöver. Heron ska vara kvar, den är startsidans ansikte. Resten väljer du: gå igenom Receptsamlingen med dina wireframes bredvid, välj de recept sidan behöver (Hamburgaren om menyn ska fällas ihop på mobil, Kortet och Badgen om du visar produkter) och dokumentera i README vilka du valde och varför. Använd det sidan behöver, inte allt du kan.

8. Grundtester Kör Validator.nu och WAVE löpande medan du bygger. Åtgärda fel direkt, det är lättare att fixa ett fel i taget än tio på en gång.

9. Publicera Publicera på GitHub Pages, precis som du gjort sedan Tema 2. Kontrollera att den publicerade URL:en faktiskt fungerar.

När webbplatsen är byggd, publicerad och grundtesterna är gröna är det dags för den fullständiga kvalitetsgranskningen. Ta med dig länken till nästa område, Kvalitetssäkring och utvärdering, och kör Lighthouse, ett komplett testprotokoll och manuell verifiering på den live-publicerade versionen.

Checklista för godkänt

Kopiera checklistan till din README och bocka av medan du bygger. Vid inlämning ska varje ruta vara ikryssad.

## Checklista

### Projekt och process

- [ ] Fiktivt företag med tydlig identitet (namn, bransch, ton, färg, typsnitt)
- [ ] Persona med minst tre användarberättelser
- [ ] Sitemap (minst 3 sidor, max 4)
- [ ] Wireframes (mobil + desktop) sparade i repot
- [ ] Semantiska commit-meddelanden (feat, fix, style, docs) genom hela projektet

### HTML och tillgänglighet

- [ ] Semantisk HTML: header, nav, main, footer och rätt rubrikhierarki
- [ ] Alla bilder har meningsfull alt-text (dekorativa bilder: alt="")
- [ ] Validator.nu: inga fel

### CSS och layout

- [ ] Responsiv design: fungerar på mobil och desktop
- [ ] Hero med centrerat innehåll och läsbar, kontrastgodkänd text
- [ ] Recept valda efter behov och dokumenterade i README (vilka och varför)
- [ ] Typsnitt enligt varumärkesanalysen, text med WCAG AA-kontrast

### Om sidan använder JavaScript (till exempel Hamburgaren)

- [ ] Sidan fungerar utan JavaScript: nav-länkarna är synliga om skriptet inte laddas
- [ ] aria-expanded uppdateras vid toggle
- [ ] Menyn fungerar med enbart tangentbord (Tab + Enter)

### Kvalitetssäkring

- [ ] WAVE: inga röda ikoner

### Dokumentation

- [ ] README med projektbeskrivning (vad är företaget, vad gör webbplatsen)
- [ ] Minst två motiverade designval dokumenterade (varför du valde det du valde)