Harjoitus 3 - Verkkokaupan tuotesivut sekä palautelomake

Tuotesivut

Luo jokaiselle tuotteelle oma sivunsa, jolle käyttäjä pääsee siirtymään painamalla “Osta”-nappia. Jokaisella sivulla on sama CSS-tiedosto, joten ne näyttävät täysin samanlaisilta lukuun ottamatta tuotekuvia ja tekstejä.

Sivulla pitää olla seuraavia asioita:

1. Sama header-osio kuin verkkokaupan pääsivulla, jotta käyttäjä pääsee takaisin etusivulle. Samoin sama footer.
2. Suurempi kuva tuotteesta. Kuvia saa myös olla useampia.
3. Lisätietoja tuotteesta (esimerkiksi materiaali, valmistusmaa, kokotietoja jne. riippuen tuotteesta).
4. Lomake, jolla voi lisätä useamman kappaleen ostoskoriin (input, jonka tyyppi on numero) sekä lomakkeen lähetysnappi eli ostonappi.
5. Vähintään kaksi kuviteltua arvostelua kyseisestä tuotteesta tuotteen alapuolella.

Palautelomake

Luo linkki verkkokaupan palautelomakkeelle ja tee palautelomake. Palautelomakkeessa pitää olla seuraavat asiat:

1. Palautteenantajan nimi (pakollinen).
2. Palautteenantajan sähköpostiosoite (pakollinen).
3. Palautteenantajan puhelinnumero (pakollinen).
4. Valintavalikko (select), josta käyttäjä valitsee, koskeeko asia sivustoa, tuotteita, reklamaatiota tai toimitusta.
5. Avoin tekstikenttä, johon voi kirjoittaa palautteensa (pakollinen).
6. Valintavaihtoehdot, haluaako yhteydenoton sähköpostilla vai puhelimella, oletuksena sähköposti.
7. Lähetysnappi ja tyhjennysnappi.
8. Jokaisella lomakekentällä on niihin kuuluvat labelit.