TIEA361 Tietotekniikan opettajan työvälineitä -kurssin tehtävät

Oppimistehtävä 3 - WWW-sivujen tuottaminen, oppilasnäkökulma

Tehtävänanto

Jokainen oppilas luo kolmesta sivusta koostuvan www-sivuston. Kullakin sivulla on oma aiheensa: ääntäminen, dialogisanat ja -fraasit ja suomenruotsin murteet.

Alle on poimittu koko tehtävänannosta tietoteknisiin tavoitteisiin liittyvät osiot.

1 Suhteellinen viittaus

Suhteellista viittausta eli suhteellista linkkiä käytetään linkitettäessä omaan sivustoon kuuluvalle (kohde)sivulle.

• Kun kohdesivu sijaitsee samassa kansiossa kuin viittaava sivu, pelkkä tiedostonimi riittää: <a href="tiedostonimi.htm">kohdesivu</a>
• Kun kohdesivu sijaitsee hakemistorakenteessa yhtä ylemmällä tasolla kuin viittaava sivu, tiedostonimen alkuun lisätään kaksi pistettä ja kauttaviiva: <a href="../tiedostonimi.htm">kohdesivu</a>
• Vastaavasti kaksi tasoa ylöspäin: <a href="../../tiedostonimi.htm">kohdesivu</a>
• Kun kohdesivu sijaitsee hakemistorakenteessa yhtä alemmalla tasolla kuin viittaava sivu, tiedostonimen alkuun lisätään kansion nimi: <a href="alikansio/tiedostonimi.htm">kohdesivu</a>
• Kun kohdesivu on samalla tasolla olevassa rinnakkaisessa kansiossa, mennään ensin hakemistossa ylöspäin kahdella pisteellä, sitten alihakemistoon hakemistonimellä: <a href="../alikansio/tiedostonimi.htm">kohdesivu</a>

1. Luo Kuvat-niminen hakemisto (kansio) hakemistosi alle ja tallenna sinne valokuva.
2. Linkitä valokuva murresivulle. Käytä suhteellista viittaustapaa.

2 Multimedian upottaminen www-sivulle: Youtube-video

Tässä harjoituksessa voit käyttää oheista esimerkkivideota. Esimerkkivideon osoite: http://www.youtube.com/watch?v=vHe7f_L7S2Q

Videon upottaminen www-sivulle onnistuu alla olevan upotuskoodin avulla. Samaa koodia voi käyttää uudelleen Youtube-videoiden upottamiseen www-sivulle, kunhan vaihtaa videon tunnisteen. Koodissa videon tunniste on merkitty punaisella. Huomaa, että tunniste pitää laittaa kahteen eri paikkaan itse upotuskoodissa: ..."http://www.youtube.com/v/videon_tunniste"...

Esimerkkivideon tunniste: http://www.youtube.com/watch?v=vHe7f_L7S2Q

Upotuskoodi:

<object width="560" height="340">
<param name="movie" value="http://www.youtube.com/v/vHe7f_L7S2Q"></param>
<param name="wmode" value="transparent"></param>
<embed src="http://www.youtube.com/v/vHe7f_L7S2Q" type="application/x-shockwave-flash" wmode="transparent" width="560" height="340"></embed>
</object>

1. Valitse ensin kooditeksti hiirellä maalaamalla ja leikkaa se sitten näppäinkomennolla CTRL+C.
2. Liitä upotuskoodi www-sivullesi näppäinkomennolla CTRL+V [, vaihda videon tunniste] ja tallenna dokumentti. WWW-sivullasi pitäisi nyt näkyä Youtube-video Basic pronunciation in Swedish.