Tentin tekstisisältö

MAT-80000 Johdatus hypermediaan - 26.01.2016

Tentin tekstisisältö

Teksti on luotu tekstintunnistuksella alkuperäisestä tenttitiedostosta, joten se voi sisältää virheellistä tai puutteellista tietoa. Esimerkiksi matemaattisia merkkejä ei voida esitää oikein. Tekstiä käytetään pääasiassa hakutulosten luomiseen.

Alkuperäinen tentti
 

MAT-80000 Johdatus hypermediaan Meri Kailanto 26.1.2016
Oheismateriaalin käyttö on kielletty tentin aikana. Vastaa kaikkiin kysymyksiin. Pidä tenttipaperi. Onnea!

1) Selitä lyhyesti, mitä seuraavat opintojakson aiheisiin liittyvät käsitteet tarkoittavat (1 piste / kohta)

a) URL d) JavaScript
b) Attribuutti (HTML:ssä) e) formatoiva merkkaus
c) JPG f) www

2) Vastaa seuraaviin kysymyksiin tiiviillä esseillä.
a) Määritä tämän opintojakson kontekstissa, mitä ovat hypermedia, hyperteksti, hyperlinkki,
assosiatiivisuus ja epälineaarisuus. Selitä myös, miten ne liittyvät toisiinsa. (3 pistettä)
b) Mitä tarkoitetaan HTML-dokumentin validoinnilla? Miten se tehdään? Mitä hyötyä siitä on? Entä
mitä rajoitteita sen ohjelmalliseen toteutukseen liittyy? (3 pistettä)

3) Toimi seuraavien ohjeiden mukaan ja vastaa kysymyksiin.
Alla on esimerkki HTML5-tyyppisestä, index.html-nimisestä dokumentista:

<!DOCTYPE html>
<html><head><meta charset="utf-
8"><title>Kauppalista</title> a) Laadiannetusta HTML-dokumentista

</head> , puumuotoinen jäsennys, josta käy ilmi
<body><hl1>Muista ostaa elementtien muodostama hierarkkinen
kaupasta</hl> rakenne. Merkitse kunkin elementin viereen

<p class="remember"><img
src="kauppaäkeskus.png"
alt="Hervannan kauppakeskuksen
logo"> Kaikki kaupat
l&ouml;ytyv&sauml;t Hervannan

sulkuihin myös sille määriteltyjen
attribuuttien nimet. (2 pistettä)

b) Mitä protokollaa selain käyttää tietojen

keskustasta.</p> noutamiseen palvelimelta? Mitä resursseja
<ul><li>Maitoa <a protokollalla haetaan, kun oheinen
href="http://www.shop.fi/maitotarj dokumentti avataan selaimella? (2 pistettä)
ous">tarjouksesta</a></li>

o a &auml;</li></ul> c) Dokumenttiin on liitetty kauppakeskuksen
</body>

logo png-muodossa. Miksi tämä on hyvä
tiedostomuoto? Olisiko muita vaihtoehtoja?
Perustele. (2 pistettä)

</html>

4) Tehtävän aiheena on CSS. Vastaa annettuihin tehtäviin:

a) Kuvaa kolme eri tapaa, jolla em. dokumenttiin voi liittää CSS-tyylejä. Mitä eroa näillä
tavoilla on? Mihin kohtaan HTML-dokumenttia kukin tapa lisätään? (3 pistettä)
b) CSS-tyyleihin liittyy suorakaidemalli (engl. box model). Suorakaidemalli määrittelee, että jokaisella
elementillä voi varsinaisen sisältöalueen lisäksi olla kolme valinnaista sisältöaluetta. (3 pistettä)
1) Mitkä nuo alueet ovat ja missä järjestyksessä niille varataan tilaa sisällön ympäriltä?
ii) Miten nämä alueet eroavat toisistaan ominaisuuksiltaan ja toiminnaltaan?
iii) Kirjoita CSS-tiedostoon liitettävä tyylisääntö, jolla tekstikappaleen (<p>) ympärille lisätään Spx
taustaväriltään tekstikappaleen kanssa yhteneväistä tilaa. Kohdista sääntö vain sellaisille
tekstikappaleille, joilla on class-attribuutti arvoltaan ”remember”.

 


Käytämme evästeitä

Tämä sivusto käyttää evästeitä, mukaanlukien kolmansien puolten evästeitä, vain sivuston toiminnan kannalta välttämättömiin tarkoituksiin, kuten asetusten tallentamiseen käyttäjän laitteelle, käyttäjäistuntojen ylläpitoon ja palvelujen toiminnan mahdollistamiseen. Sivusto kerää käyttäjästä myös muuta tietoa, kuten käyttäjän IP-osoitteen ja selaimen tyypin. Tätä tietoa käytetään sivuston toiminnan ja tietoturvallisuuden varmistamiseen. Kerättyä tietoa voi päätyä myös kolmansien osapuolten käsiteltäväksi sivuston palvelujen tavanomaisen toiminnan seurauksena.

FI / EN