Nettbutikk – webutvikling

Eksamensprosjekt i webutvikling ved Høgskolen i Østfold, laget alene.

Mål

Bygge en responsiv og tilgjengelig nettbutikk fra bunnen av med HTML og CSS, uten rammeverk, med fokus på semantisk struktur og god brukeropplevelse på både mobil og desktop.

Løsningen

En nettbutikk-mal med tre sider:

• Forside med toppbilde, produktkort, populære kategorier og anmeldelser
• Produktside med størrelsesvelger og lignende produkter
• Kasseside med handlekurv og skjema for leveringsadresse og kontaktinfo
• Tilgjengelighetserklæring lenket fra bunnteksten

Teknologi

HTML, CSS (Flexbox, Grid og media queries for flere skjermstørrelser) og Font Awesome for ikoner.

Arbeidsmåte

Semantiske elementer som header, main, nav, article og footer, alt-tekster på alle bilder, og skjemaer med labels og validering (required og riktige input-typer for e-post og telefon). Bildene er hentet fra Pixabay og kreditert i koden.

Veien videre

• JavaScript for bildeslider, handlekurv og søk
• Ekte produktdata i stedet for plassholdertekst
• Backend og betaling