Kurssin tavoitteet
Opiskelija
- ymmärtää verkkoteknologioiden peruskäsitteet
- ymmärtää html- ja css -dokumenttien rakenteet ja toimintaperiaatteet
- osaa rakentaa oikeaoppisia verkkosivustoja
- oppii itsenäisesti seuraamaan verkkoteknologioiden kehitystä ja etsimään lisätietoa erilaisista lähteistä
Opettaja: Eeva Meltio, eeva.meltio a metropolia.fi
- Läsnäolo opetuksessa 80%
- Harjoitustyönä toteutettava sivusto (vähintään 1-2 sivua) sekä dokumentaatio sivun suunnittelusta ja toteutuksesta
Ohjeita harjoitustyöhön
- Tee validit html-sivut ja ulkoinen css-tiedosto (html 4.01 & css 2)
- Erota rakenne ja ulkoasu toisistaan
- Julkaise sivusto kotihakemistossasi tai muualla verkossa
Ohjeita dokumentaatioon
Lähetä opettajalle sähköpostitse kuvaus (1-2 sivua)
- Sivuston tavoite
- Kohderyhmä
- Suunnitteluperiaatteet
- Miten toteutettu ja miksi? (onko käytetty taulukoita, tyylitiedostoja)
- Mitä opin kurssista / harjoitustyön tekemisestä?
Harkkatyön arviointikriteerit
- Oikeaoppinen ja validi HTML ja CSS
- Layout: käytettävyys, visuaalisuus
- Dokumentaatiossa kuvaillut perustelut tehdyille valinnoille: miten toteutettu sivusto vastaa tavoitteisiin?
Aikataulu ja sisällöt
Perusopiskelijat |
Aihe |
|---|---|
Ma 14.3. |
Peruskäsitteet. Yksinkertaisen verkkosivun luominen. Validointi. |
Ma 21.3. |
Tyylitiedostojen luominen ja linkittäminen. Värien käyttö ja typografian muotoilu tyylitiedostoilla. |
Ma 28.3. |
Kuvan ja taustakuvan lisääminen ja asemointi. Linkit ja hakemistorakenne. Värit ja yksiköt. Etäyhteydet: ssh, ftp. |
Ma 4.4. |
CSS-taitto: Elementtien asemointitavat. |
Ma 11.4. |
CSS-taitto: Elementtien asemointitavat. |
Ma 18.4. |
Taulukon luominen ja muotoilu tyylitiedostolla |
Ma 2.5. |
Listat ja navigaation muotoilu. |
Ma 9.5. |
Harjoitustyön teko |
Ma 16.5. |
Harjoitustyön teko |
Ma 23.5. |
Harjoitustöiden esittely |
Kurssimateriaali
HTML- ja CSS -dokumenttien oikeellisuus kannattaa tarkistaa ns. validaattoreilla. Validaattorit vertaavat sille annettua dokumenttia niitä koskeviin määrittelyihin ja tarkastavat dokumenttien muodollisen oikeellisuuden.
Kurssilla käytetään tekstieditoreita html- ja tyylitiedostojen tekemiseen.
>> Lataa Notepad++ (vain windows-käyttöjärjestelmälle)
Mac-editoreita, esim:
http://www.w3.org/, World Wide Web Consortium
Ohjeet sivujen julkaisemiseen (Metropolian tietohallinto)
Merkkauskielten idea (Jukka K. Korpelan verkko-opas)
W3Schools HTML Tutorial
Layout Gala (40 validia html/css-layoutia)
http://browsershots.org/ Ottaa kuvan sivustosta kaikilla selaimilla -> hyvä tarkistukseen