WWW-sivun perustukset

Tutkimme WWW-sivun rakennetta ohessa olevan esimerkin avulla. Esimerkissä voi olla muutamia sinulle vieraita määrityksiä, mutta niistä ei kannata huolestua tässä vaiheessa.

Meidän ei tarvitse joka kerta kirjoittaa XML- ja dokumenttityyppimäärityksiä, vaan ne on kätevintä pitää mukana valmiissa sivupohjassa. Sivupohjalla tarkoitetaan uuden sivun tekemisessä käyttämäämme perusrakennetta, joka voi sisältää sivun perustietoja, kuten esimerkiksi tekijätiedot. Sivupohjaa tehdessämme voimme kopioida valmiit määritykset esimerkiksi tästä artikkelista, joten niitä ei tarvitse välttämättä kirjoittaa käsin.

Artikkelia (sivua) kirjoittaessamme meitä kiinnostavat edellisiä enemmän html-elementti sekä sen sisään tulevat osat. html-elementti toimii eräänlaisena WWW-sivun juurielementtinä, jonka sisään määritellään varsinainen sivun sisältö. Jokaisesta WWW-sivusta täytyy siis löytyä html-elementti. Esimerkin html-elementin sisään on määritelty WWW-sivun nimiavaruus ja sisällön kieli. Määrittelyt kannattaa liittää osaksi WWW-sivua, mutta niiden merkitystä emme tarkastele tässä yhteydessä tämän enempää. html-elementin sisään määritelemme WWW-sivun kaksi eri osaa, jotka on korostettu oheisessa esimerkissä. Esimerkin WWW-sivu näytetään WWW-selaimessa kuvan 1 mukaisesti.

<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fi">
  <head>
    <link rel="stylesheet" type="text/css"
             media="all" href="tyylilomake.css" />
    <title>Asiakirjan otsikko</title>
  </head>


  <body>
    <h1>Asiakirjan otsikko</h1>
    <p>Ensimmäinen tekstikappale.</p>
  </body>
</html>

head-osaan määritelemme WWW-sivun otsikkotiedot, jotka eivät varsinaisesti näy WWW-sivua lukevalle käyttäjälle. Esimerkkisivussa head-osaan on määritetty muutamia tietoja.

Selainikkunan otsikkopalkissa näkyy sivun title-elementin sisältö. body-elementin sisältö tulee näkyville varsinaiseen selainikkunaan.

Kuva 4. Sivun näkyminen selainikkunassa

body-osaan määritellään WWW-sivun varsinainen sisältö. Kaikki body-osaan tulevat sisällöt näytetään WWW-sivun lukijalle selainikkunassa. Esimerkkisivulla on ainoastaan ensimmäisen tason otsikko sekä yksi tekstikappale. Seuraavissa alaluvuissa käydään tarkemmin läpi erilaisia WWW-sivun sisällön rakenteeseen liittyviä elementtejä, kuten otsikoita ja listoja.

Käyttäjien kommentit

Kommentoi tätä sivua Lisää uusi kommentti
Kurssimateriaalien käyttäminen kaupallisiin tarkoituksiin tai opetusmateriaalina ilman lupaa on ehdottomasti kielletty!
http://appro.mit.jyu.fi/doc/tyovaline/wwwsivu/index5.html
© Antti Ekonoja (anjoekon@jyu.fi) <http://users.jyu.fi/~anjoekon/>
Tommi Lahtonen (tommi.j.lahtonen@jyu.fi) <http://hazor.iki.fi/>
Jukka Mäntylä (jmantyla@iki.fi) <http://www.iki.fi/jmantyla/>
2003-11-10 10:21:28
Informaatioteknologia - Jyväskylän yliopiston IT-tiedekunta ja avoin yliopisto