TKK | Tietoverkkolaboratorio | Opetus

Mallisivun runko

Työohje
[Aiheet]
[Rakenne]
[Kuvitus]
[HTML]
[Mallisivu]
[Palautus]
[Arvostelu]

Valmiit työt

Jo HTML-standardi edellyttää, että webbisivulla on tietyt osat. Tällä sivulla on esimerkki siitä, minkälaista perusrunkoa harjoitustyön kirjoittamisessa voi käyttää.

Sivu alkaa vakiomuotoisella kommentilla siitä, mitä HTML-versiota sivu noudattaa (doctype declaration). Esimerkkitapauksessamme on valittu W3C:n HTML 4.0 Transitional.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
      "http://www.w3.org/TR/REC-html40/loose.dtd">

Tämän jälkeen alkaa varsinainen HTML-kielinen osuus. Otsikkolohkossa (HEAD) tulee olla ainakin TITLE- ja LINK-osat. Avainsanat ja lyhyt kuvaus on tarkoitettu hakuohjelmia varten. Ne eivät ole pakollisia, mutta helpottavat satunnaisen webbailijan eksymistä juuri sinun sivullesi.

<HTML>

<HEAD>
   <TITLE>Hilavitkutin vieköön!</TITLE>
   <META name="keywords" content="hilavitkutin, vempain">
   <META name="description"
         content="Lyhyt kuvaus harjoitustyöstämme.">
   <LINK rev="made" href="mailto:tteekkar@cc.hut.fi">
</HEAD>

Tämän jälkeen tulee sivun varsinainen runko eli BODY-osa. Tästä eteenpäin koodi koskee selaimen ikkunassa näkyvää tekstiä. Include-rivi on niin sanottu SSI- eli Server-Side Includes -kommentti, jonka labran palvelin korvaa automaattisesti header-tiedostosta löytyvällä vakiomuotoisella otsikkopalkilla.

<BODY>
<!--#include virtual="/skel/header.shtml"-->

Kun nettisurffaaja käy noutamassa sivun omalle koneelleen, palvelin korvaa edellä olevan rivin n:llä rivillä koodia, joka näkyy selaimen ruudussa seuraavanlaisena linkkipalkkina:

TKK | Tietoverkkolaboratorio | Opetus

Otsikkopalkin jälkeen tulee sivun pääotsikko ja varsinainen leipäteksti.

<H1>Pääotsikko</H1>

<P>Leipätekstiä</P>
<P>Lisää leipätekstiä</P>

Sivu loppuu jälleen SSI-viittaukseen ja pakollisiin loppumerkkeihin. Kyseisen SSI-viittauksen löytäessään palvelin lisää jokaiselle sivulle virtuaalisen alatunnisteen (engl. footer).

<!--#include virtual="/skel/footer.shtml"-->
</BODY>
</HTML>

Lopputuloksen näette muun muassa tämän sivun alalaidassa. Yleensä alatunniste kannattaa selvyyden vuoksi erottaa muusta tekstistä esimerkiksi vaakasuoralla viivalla.

Huom! Hieno automagiikka toimii vain silloin, kun sivu on nimetty oikein .shtml-päätteellä. Muistakaa siis muuttaa sivujen nimet ja kaikki linkit, ennen kuin palautatte työn!


Tietoverkkolaboratorio on nyt osa Tietoliikenne- ja tietoverkkotekniikan laitosta. Tällä sivulla oleva tieto voi olla vanhentunutta.

Kurssien ajantasainen tieto on MyCourses-palvelussa.

Tämä sivu on tehty oppilaiden harjoitustyönä. Tietoverkkolaboratorio ei vastaa sivun oikeellisuudesta, ajantasaisuudesta tai ylläpidosta. Vakavissa tapauksissa yhteyshenkilöinä toimivat ja Webmaster.
Sivua on viimeksi päivitetty 20.11.1998 14:49.
URI: http://www.netlab.tkk.fi/opetus/s38118/s98/htyo/malli.shtml
[ TKK > Sähkö- ja tietoliikennetekniikan osasto > Tietoverkkolaboratorio > Opetus ]