Kehykset
- Nykyään voi näköjään pistää kehyksiin mitä roskaa vaan.
- Anteeksi, katsotte peiliin.
HUOM! Kehysten käyttö on vanhentunuttta tekniikkaa. Kehykset haittaavat sivujen mobiilikäyttöä ja sulkevat ulos käyttäjäryhmiä (esim. näkövammaiset). Tämä luku on mukana historiallisista syistä, koska joillakin sivustoilla kehyksiä vielä näkee. Käytä mieluummin lohkoja ja tyylimäärityksiä. Tehtävän voi tehdä ylimääräisenä harrastustehtävänä. Tavoitteena on ymmärtää, miten kehykset toimivat ja miksi niitä ei kannata käyttää.
Selaimen ikkuna voidaan jakaa kehyksiin, joihin jokaiseen ladataan jokin HTML-sivu. Kehysten määrittelyjä varten tehdään oma HTML-tiedosto. <frameset>-rakennemäärittelee kehyssarjan asetukset. Useita <frameset>-rakenteita voi laittaa sisäkkäin. Komento <frame> määrittelee yksittäisen kehyksen asetukset.
Tutki esimerkkikoodia ja selvitä
- miksi
<frameset>-määrityksessä on sekäborder- ettäframeborder-tarkenne - mihin
src-,name-,target- jascrolling-tarkenteita tarvitaan - mihin
<noframes>-rakennetta tarvitaan
<html>
<head>
<title>Kaikkea kaikille</title>
</head>
<frameset framespacing="0" border="0" frameborder="0"cols="200,*">
<frame src="sisus.php" name="sisus"target="teksti" scrolling="auto">
<frame src="johdanto.php" name="teksti"scrolling="auto">
<noframes>
<body>
<h1>Kaikkea kaikille</h1>
<p><a href="sisus.php">Siirry sisällysluetteloon.</a></p>
</body>
</noframes>
</frameset>
</html>
Kehyksillä tavallisesti erotetaan sisällysluettelo tai valikko varsinaisesta asiasta. Sivuston ylläpito on helppoa, kun valikkoa ja muita pysyviä elementtejä ei tarvitse lisätä ja muuttaa erikseen jokaisella sivulla. Tämän voi toteuttaa ilman kehyksiäkin esimerkiksi PHP-ohjelmointikielellä..
Sivuston lukijalle tulee ongelmia, jos hän ei tulekaan sivustolle pääsivun kautta vaan esimerkiksi hakupalvelun linkistä. Silloin hän ei välttämättä näe kehysten kokonaisuutta vaan vain yksittäisen kehyksen sisällön. Siksi pitäisi huolehtia siitä, että jokaiselta sivulta on linkki ainakin sivuston aloitussivulle tai sisällysluetteloon. Parempi vaihtoehto kehysten käytölle ovat loogiset lohkot.
Kehykset vaikuttavat myös selaimen toimintaan; esimerkiksi Takaisin-painike ei toimi samalla tavalla kuin kehyksettömillä sivuilla. Selain ei myöskään näytä osoiterivillä sen sivun osoitetta, jossa lukijan etsimä tieto on, vaan kehystiedoston osoitteen.
Tehtävä
Laadi kehysten määrittelyyn HTML-tiedosto, joka jakaa selainikkunan kolmeen kehykseen:
| 20 % valikko |
tehtävät |
| Nimesi, korkeus 80 px | |
Tarvitset kaksi <frameset>-määritystä sisäkkäin, ensimmäisen jakaaksesi ikkunan kahteen riviin ja toisen jakaaksesi ylemmän rivin sarakkeisiin.
Laadi valikkotiedosto, josta voi valita, mikä tekemistäsi tehtävien ratkaisuista latautuu viereiseen kehykseen.