ITV0110 1. töö: Html põhioskused

Esimese praktikumi ülesanne on teha väike veebisait iseenda kohta.

Kuidas teha

Lehti tehes pead tingimata kasutama kõiki alltoodud tehnoloogiaid ja tegema ära kõik nõutud osad: sisuline eesmärk praktikumil on harjutada neidsamu baastehnoloogiaid (reavahed, pealkirjad, lingid, värvid, tabelid, pildid jms) kasutama.

Kui oled varem teinud veebilehti, siis need varasemad selle praktikumi tulemuseks ei kvalifitseeru (küll aga oskad sel juhul ülesande väga ruttu valmis saada).

Igati sobiv ja soovitav on lehtedele lisada muid mõistlikke ja huvitavaid asju ka omal initsiatiivil.

Lehed tuleb luua hariliku teksti(programmeerimis)redaktoriga (soovitavad näiteks notepad++ või scite), mitte puhtalt visuaalse redaktoriga. Esitamisel peab oskama juhendajale seletada, mida konkreetsed htmli markupi osad sinu lehel teevad ja miks nad seal on. Sulle arusaamatuid htmli markupe elemente ei tohi kasutada (st enne kasutamist tuleb nendega mõne htmli õppematerjali abil tutvuda!). CSS ja javascript on lubatud (vaja neid siin praksis ei ole!), aga ainult juhul, kui oskad seletada, kuidas nad täpselt töötavad.

Loodud lehti võib selles ülesandes hoida lihtsalt arvuti failisüsteemis: nad ei pea olema laetud serverisse.

Soovitav on teha lehed järgmiste etappidena, kuid esitada tuleb töö tervikuna, st kui kõik etapid valmis.

Abiks on mõistlik kasutada Raggetti (html 4 standardi peatoimetaja) klassikalisi tutoriale (esimene ja teine) või w3schoolsi põhjalikumat html tutorialit. Kui soovid lehti kenamaks teha (ei ole selles ülesandes veel kohustuslik), siis on hea mõte järgida neid soovitusi.

Mis veel: kirjuta kõik tagid väikeste tähtedega, sest nii on kombeks. Kui kasutad HTML-s päist (ei ole selles praksis kohustuslik), siis kasuta juba HTML5 päist, st <!DOCTYPE HTML> ilma selle PUBLIC jne pika jututa lõpus.

Esimene etapp

Kirjuta teksti(programmeerimis)redaktoriga 5 html lehte, mis on omavahel lingitud ja sisaldavad infot sinu enda kohta (ei pea olema tõene info!). Pealehel olgu mh menüü, näiteks: Minust, Sõbrad, Lingid, Hobid jne.

Teine etapp

Joonista mõne graafikaprogrammiga 5 pilti (mõned neist võivad olla ka sinu enda tehtud fotod, osad peavad aga olema joonistatud), salvestage neist osad PNG või GIF ja osad JPEG formaati ning lisage nad koduleheküljele eelmisest ülesandest (5 html lehte, omavahel lingitud). Kõigil lehtedel olgu siis mõni ise joonistatud/pildistatud PNG või GIF või JPEG formaatides pilt.

Neile lehtedele tuleb järgmisena panna osadele taustavärv ning osadele taustapildid. Samuti tuleb ära muuta tavaliste ning külastatud linkide värvid (vaikimisi on need üldiselt sinised ning lillad) muutes nad endale meeldivaks.

Kolmas etapp

Tee alltoodud sorti tabel, kasuta tabeli päises taustavärve ja püüa tõepoolest süveneda tabeli tegemise põhimõtetesse (mitte lihtsalt copy-paste kuskilt näite järgi), sest sul on kindlasti vaja oskust tabeli html-teksti käsitsi parandada.

Tabeli sisu peab olema reaalne või väljamõeldud info sinu enda või mingite sinu lemmikasjade kohta.

Nr 	Nimi 	         Matemaatika 	Inglise keel
1 	Aleksei Matiisen 95 	        77
2 	Lea Kuusik 	 88 	        99
3 	Leo Roost 	 32 	        83
4 	Tarmo Eessaar 	 100 	        100

Praksi esitamine ja hindamine

Kirjuta mõnele lehele selgelt nähtavalt oma nimi ja matriklinumber, siis leiab praksijuhendaja need üles ja ei pea küsima.

Kui lehed valmis, kutsu praksijuhendaja kohale (või kui töö sinu oma laptopis, vii tema juurde) ja näita lehed ette.

Esimese praksi eest saad - kui kõik osad tehtud - alati täispunktid, v.a. juhul, kui esitamisega hiljaks jääd (siis saad ainult pooled punktid). Kui mõned nõutud osad on puudu, siis suunab juhendaja sind lihtsalt neid lisama ja ei võta enne praksi vastu.

Meeldetuletuseks, et mis peab lehtedel olema:

• Kokku vähemalt viis lingitud lehte.
• Esilehel menüü.
• Vähemalt viis pilti, mis on su enda tehtud (fotod või joonistatud).
• Vähemalt üks enda joonistatud pilt.
• Tabel mingi sisulise sinuga seotud infoga.
• Sama tabeli päis taustavärviga.
• Üks leht taustavärviga.
• Üks leht taustapildiga.
• Vähemalt ühel lehel muudetud värvidega (mitte vaikimisi sinine) lingid.