TKK | Tietoverkkolaboratorio | Opetus

HTML-ohjeet

Sivut tulee koodata mahdollisimman standardilla ja selainriippumattomalla HTML-kielellä. Kurssin virallinen HTML-suositus on World Wide Web Consortiumin HTML 4.0 Transitional. Uudempia versioita saa käyttää sillä edellytyksellä, että koodin yhteensopivuus labran automagiikkaan testataan ennen työn palauttamista. Testaaminen onnistuu helpoimmin harjoitustyöassareitten vastaanottoaikana.

Lisätietoa ja hyödyllisiä HTML-linkkejä löytyy seuraavassa:

Sivut kannattaa yleensä kirjoittaa omin käsin, sillä toimisto-ohjelmien HTML-generaattorien tekemää jälkeä joutuu joka tapauksessa siivoamaan. Tärkeätä on esimerkiksi otsikoinnissa käyttää loogisia tyylejä (h1, h2 jne.) eikä pelkkää lihavointia tai suurempaa kirjasinkokoa. Ohjelmoinnista tuttua koodin sisentämistä ja kommentointia kannattaa harrastaa myös HTML:ää kirjoittaessa. Koodia voi siistiä myös W3C:n HTML Tidy -ohjelman avulla.

Harjoitustyön pääpaino on sisällössä, mutta siinä sivussa on tarkoitus oppia webbijulkaisemisen alkeet. Käytä tilaisuutta hyväksesi, jos et ole vielä ehtinyt tutustua aiheeseen!

[Aloitus] [Aiheet] [Päiväkirja] [Anominen] [Teksti] [Kuvitus] [HTML] [Palautus] [Arvostelu]


(S)HTML - lyhyt oppimäärä

HTML-standardi edellyttää, että webbisivulla on tietyt osat. Alla 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="/opetus/s38118/s00/tyot/118footer.shtml"-->
</BODY>
</HTML>

Lopputuloksen näette alla:

Tämä sivu on tehty Teletekniikan perusteet -kurssin harjoitustyönä.
Sivua on viimeksi päivitetty 01.09.2000 13:50
URL: http://www.netlab.tkk.fi/opetus/s38118/s00/ohje/html-ohje.shtml

Yleensä alatunniste kannattaa selvyyden vuoksi erottaa muusta tekstistä esimerkiksi vaakasuoralla viivalla (engl. horizontal ruler). Alatunniste täytyy löytyä harjoitustyön jokaiselta sivulta!

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än sivun sisällöstä vastaavat ja Webmaster.
Sivua on viimeksi päivitetty 01.09.2000 13:50.
URI: http://www.netlab.tkk.fi/opetus/s38118/s00/ohje/html-ohje.shtml
[ TKK > Sähkö- ja tietoliikennetekniikan osasto > Tietoverkkolaboratorio > Opetus ]
?Kysy =>Anna palautetta!