Suunnittelutehtävä
- Valitse 8 matkakohdetta
- Piirrä sivuston ulkonäkösuunnitelma (layout)
- Kirjoita tekstit
- Valitse kuvat
- Liitä kaikki word-asiakirjaan ja palauta suunnitelma osoitteeseen heikkilaakso@yahoo.com
Harjoitustyö 1
Rakenna matkailusivusto. Sivuja on etusivun lisäksi 8, kaikissa on kuvia. Lisää etusivulle Flash-banneri, jossa kohteiden kuvat vaihtuvat. Yhden kohteen pitää näkyä yksin 3 sekunnin ajan ennen kuin vaihtuminen alkaa. Lisää myös pikkukuvat, joista on linkki joko kohdesivuille tai isoihin kuviin. Ota googlemapsin maailmankartasta kuvankaappaus (Prnt Scrn), liitä se Photoshopiin , rajaa kuva, merkitse matkakohteet karttaan ja tallenna se sivustosi kuvakansioon jpg-muodossa. Lisää kartta etusivulle ja piirrä siihen hotspotit linkkeineen. Pakkaa sivustokansio zip-muotoon ja palauta osoitteeseen heikkilaakso@yahoo.com.
Harjoitustyö 2
Tee kuvitteelliselle yritykselle sivusto, jossa on ainakin etusivu mainosbannereineen (index.html), yrityksen esittelysivu, tuotesivu (vähintään 10 tuotetta), historiikkisivu ja yhteystietosivu, jossa karttalinkki. Sivujen välillä tulee olla toimiva linkitys.
Käytä tuotteiden ulkonäön suunnitteluun Illustratoria ja Photoshopia, siis omaa materiaalia. Tallenna kuvat joko jpg- tai png-muodossa. Tuottteista voi tehdä flash-animaatioita joko tuomalla kuvat leikepöydän avulla tai File, Import, Import to stage.
Harjoitustyö 3
Suunnittele sivusto jollekin tapahtumalle, esimerkiksi rockfestivaalille. Voit käyttää valmista mallia. Tee malliin otsikon jälkeen valikko ( Insert, Spry, Spry Menu Bar ). Tee esimerkiksi aikataulusivulle haitari ( Insert, Spry, Spry Accordion ) ja eri lavoille välilehdet ( Insert, Spry, Spry Tabbed panels ). Esiintyjille voi tehdä linkit omille sivuille, esiintyjäsivulle voi myös upottaa Youtubevideoita. Tarvitaan myös karttoja, ajo-ohjeita, ravintolatarjontaa ym.
Harjoitustyö 4
Tee sivusto täysin omasta materiaalista. Käytä joko DreamWeaverin työkaluja tai Free CSS templates, CSS Menu Builder, CSS Menu Maker ja Lightbox.
Harjoitustyö 5 Joomla
Lataa koneellesi Xampp.zip. Pura paketti ja siirrä Xampp-kansio c:-aseman juureen. Siirry Xampp-kansioon ja käynnistä ohjelma xampp-control.exe. Käynnistä Apache ja MySql Start-painikkeilla. Avaa selain ja kirjoita osoitekenttään localhost. Paikallisen Joomlan käyttäjätunnus ja salasana ovat joppe ja joppe. Tutustu ohjelmistoon ja tee yksinkertainen sivusto.
Clover Shop Pro 3 verkkokauppaohjelmiston käyttöönotto
- Pura paketti apila.zip
- Siirrä paketista löytyvä kansio xampp c:-aseman juureen
- Siirry kansioon xampp ja käynnistä ohjelma xampp-control
- Käynnistä Apache ja MySql Start-painikkeilla
- Käynnistä selain ja kirjoita osoiteriville localhost
- Siirry kansioon apila
- Verkkokauppa on kansiossa cat, ylläpito kansiossa adm
- Ohjekirja on tiedostossa cspro370ohjekirja.pdf
- Ylläpitäjän käyttäjätunnus ja salasana ovat apila ja apila
- Tee demoverkkokauppa ohjekirjan ja demoesimerkin avulla
- Mallikuvat ovat kansiossa c:\xampp\htdocs\cat\images
Clover Shop
Työskentely DreamWeawerilla
Sähköisen kaupankäynnin aapinen
Näyttöohjeet
Tavoitteena on suunnitella sivusto, jossa on:
- Etusivu
- Yrityksen sijainti karttalinkkinä
- Ajankohtaissivu tms.
- Verkkokauppa
Työvaiheet
- Suunnitelma kynällä paperilla
- Ulkonäkö
- Sivukartta
- Tiedostojen nimet
- Materiaalin tuottaminen
- Tekstit
- Kuvat
- Verkkokaupan kategoriat ja tuotteet
- Sivumalli
- Sivuston toteutus
- Sivujen ja linkkien luominen
- Verkkokaupan toteutus
- Testaus