Lataa esitys
Esittely latautuu. Ole hyvä ja odota
1
CLT132 Tehtävät (viikko 3)
2
Formaatti Palauta tehtävät 1-2 ja 4 joko *.doc tai *.pdf tiedostossa.
Palauta tehtävä 3 joko *.htm tai *.html tiedostossa. Nimeä tiedostot muodossa: SukunimiEtunimiVko3.doc tai .pdf SukunimiEtunimiVko3Teht3.htm tai .html Laita oppilasnumerosi näkyville tiedostoon. Palauta kurssiassistentille viimeistään klo 23:59 CLT132 – kevät Sauli Nurmi
3
1) Väritehtävä Seuraavassa slaidissa on lista värimäärittelyjä. Sanalliset määritykset: etsi suomenkielisille sanallisille määrittelyille sanalliset englanninkieliset vastineet ja heksadesimaaliarvo. Numeeriset määritykset: muuta RGB-arvot heksadesimaaleiksi ja heksadesimaalit RGB-arvoiksi. Anna omaan intuitiiviseen havaintoon pohjautuva nimi näille väreille (esim. kirkkaankeltainen, vaaleansininen, jne.). CLT132 – kevät Sauli Nurmi
4
Teht. 1, jatkoa vihreä musta 175, 175, 175 #380896 #05C82D 4, 201, 45
#636363 #B6C6BB 128, 77, 69 hopea CLT132 – kevät Sauli Nurmi
5
Motivointi HTML:n värimääritelmiin tutustuminen.
Lukujärjestelmäkonversioihin tutustuminen. CLT132 – kevät Sauli Nurmi
6
2) Attribuutti/kommentti-tehtävä
Seuraavassa slaidissa on lista HTML- ja XHTML-kielisiä elementtejä, jotka ovat joko attribuutteja tai kommentteja. Kerro, onko kyseessä kommentti vai johonkin sivunkuvauselementtiin liittyvä attribuutti. Kerro, onko kyseinen attribuutti tai kommentti oikein, eli HTML- tai XHTML-määrityksen mukainen - näet suluista, millä kielellä tagi on yritetty kirjoittaa. Mikäli tagi on mielestäsi väärin kirjoitettu, esitä korjausehdotus. CLT132 – kevät Sauli Nurmi
7
Teht. 2, jatkoa <FONT FACE="Arial" WIDTH="200"></FONT> (HTML) <A HREF=" tästä</A> (HTML) <a></a> (XHTML) <!-- Jotain tekstiä tähän väliin --> (HTML) <!-- JOTAIN TEKSTIÄ TÄHÄN VÄLIIN --> (XHTML) <!-- <html> testi </hTml> --> (XHTML) <--> (HTML) <!COMMENT> Sinistä tekstiä </COMMENT--> (HTML) <!> (XHTML) <td rowspan=4></td> (XHTML) <BODY BGCOLOR=BLUE></BODY> (HTML) <body bgcolor="blue"></body> (XHTML) <!-- HTML-attribuutti kirjoitetaan näin attribuutti="arvo" --> (HTML) <td colspan="4"></td> (XHTML) <!--!----! ! > (XHTML) CLT132 – kevät Sauli Nurmi
8
Reunahuomautus HUOM!!! Tämä tehtävä on oikeasti inhottava ja vaikea. Käytännön kannalta tällainen pilkunnysväys ei välttämättä ole edes tarkoituksenmukaista. Kuitenkin periaatteellisella tasolla juuri tällaiset pienet erot ovat ratkaisevia tekijöitä esim. hyvinmuodostetun (X)HTML-tiedoston validoimisessa. Toivottavasti kaikki jaksavat edes yrittää näiden ratkaisemista. Kurssikokonaisuuden kannalta tehtävän painoarvo on kuitenkin pieni eikä esim. ratkaisun täydellinen epäonnistuminenkaan ole merkittävää kokonaisarvosanan kannalta. CLT132 – kevät Sauli Nurmi
9
Motivointi Attribuuttien ja kommenttien formaalisti oikean kirjoittamistyylin opettelu. CLT132 – kevät Sauli Nurmi
10
3) (X)HTML:n tuottamistehtävä
Tee joko ohjelmointia tai kirjallisuutta käsittelevä sivu, vapaavalintaisesti HTML- tai XHTML-kielellä. Noudata seuraavia ohjeita: Laita sivun otsikoksi (title) joko HTML tai XHTML sen mukaan, kumpaa kieltä käytät. Käytä sivulla normaaleja vakioelementtejä (html, head, body). Ohjelmointisivulla esitä koodiesimerkkejä code-elementillä, kirjallisuussivulla esitä kirjasta otettuja lainauksia blockquote-elementillä. Tee sivulle otsikoita ja väliotsikoita h1, h2, jne. elementeillä. Laita teksti palstoihin, eli p-elementteihin. CLT132 – kevät Sauli Nurmi
11
Teht. 3, jatkoa Laita sivulle ainakin kaksi kuvaa, laita img-elementtiin myös tekstikuvaus alt-attribuuttiin. Kuvat vapaavalintaisesti joko absoluuttisen tai suhteellisen osoitteen takana (mutta palauta myös kuvat, jos valintasi sitä edellyttää näkyäkseen!!!) Asemoi teksti ja kuvat align-attribuutilla mielivaltaisesti, mutta eri kohtiin (esim. kuvat vasemmalla, teksti oikealla). Käytä jotakin color-attribuuttia sivulla (esim. tausta, teksti...), värimääritys vapaavalintaisesti joko värin nimi tai RGB-heksadesimaaliarvo. Muiden muotoilujen ja etenkin attribuuttien käytöstä plussaa. Kommentoi lopuksi tekemäsi muotoilut, esim. oikealle asemoitua punaista tekstipalstaa voi edeltää kommenttitagi, jossa kerrotaan mitä allaoleva sivunkuvaus tekee. CLT132 – kevät Sauli Nurmi
12
Reunahuomautus Tehtävä saattaa vaikuttaa todella laajalta tässä vaiheessa, etenkin, jos sivunkuvauskielet on entuudestaan tuntematon asia. Kuitenkin tehtävän osat ovat periaatteessa melko selviä, esim. yksittäiset tagit voi lähes joka elementin suhteen kopioida luentokalvoista tai muusta kurssimateriaalista. Periaatteessa suurin haaste tehtävässä onkin soveltaa niiden yhtäaikaista käyttöä mielekkäällä tavalla. Tehtävässä ei ole oleellista tekstin tuottaminen tai sen sisältö, sen voi kopioida esim. Wikipediasta. CLT132 – kevät Sauli Nurmi
13
Motivointi Uusien elementtien käytön opettelu ja vanhojen tuttujen kertaus. Attribuuttien käytön harjoittelu. Koodin kommentointi kuuluu yleisesti ohjelmointiin ja koodin tuottamiseen, vaikka tässä tehtävässä kommentoidaankin periaatteessa ilmiselviä asioita, harjoittaa tehtävä SGML-pohjaisen kommentointinotaation käyttöön. CLT132 – kevät Sauli Nurmi
14
4) Tehtävien analysointi
Kerro, olivatko tämän viikon tehtävät ja yleisesti tällä viikolla käsitellyt asiat mielestäsi: Liian helppoja Sopivan tasoisia Liian vaikeita Kerro myös näiden ja edelliskertojen tehtävien perusteella mistä tehtävätyypistä pidät eniten ja mistä opit eniten: määrittelyjen etsimisestä, "tenttimäisistä" tehtävistä (tämän viikon tehtävät 1 ja 2) vai vapaasta sivunkuvauskielen itsenäisestä kirjoittamisesta. CLT132 – kevät Sauli Nurmi
Samankaltaiset esitykset
