HTML HyperText Markup Language (Level 1)

HTML on dokumentin muodon määrittelykieli (DTD Document Type Definition). HTML kuvaa dokumentin esitysmuodon (ulkoasun). Tämä tarkoittaa esimerkiksi sitä, että dokumentin kirjoittaja voi määritellä, mikä osa dokumetista esitetään listana (muotoilu) tai korostaa sanoja (tyyli). Tämän lisäksi dokumentin kirjoittaja voi määritellä dokumenttiin siirtymiä (linkkejä) toisiin dokumentteihin tai toisiin kohtiin samassa dokumentissa (ankkureita).

Tekstiä muotoillaan pelkästään HTML-kielen komennoilla (tag), on aivan sama, miten tekstiä kirjoitetaan esim. tyhjät rivit ja enter-näppäimen painallukset ohitetaan tekstiä tulkittaessa. Komentojen yleinen muoto on

<KOMENTO> </KOMENTO>

eli <KOMENTO> ilmaisee komennon vaikutuksen aloituskohdan ja </KOMENTO> ilmaisee lopetuskohdan. Lisäksi on joukko komentoja, joilla ei ole lopetuskohtaa, esimerkiksi kappalejaon ilmaiseva <P> (ts. tämä näkyy tavallisesti tyhjänä rivinä).

HTML-dokumentti

HTML-dokumentin yleinen rakenne on

<HTML>
<HEAD>
<TITLE> Ikkunaan </TITLE>
</HEAD>
<BODY>
Esitettävä asia
</BODY>
</HTML>

<HTML> ja </HTML> ilmaisevat dokumentin alun ja lopun. Dokumentti koostuu kahdesta osasta alku- (<HEAD>) ja loppuosasta (<BODY>). Tämä jako on thety siitä syystä, että tulevaisuudessa HTML-näyttimet tunnistavat dokumentin alku- ja loppuosan, ja käyttäjä voi halutessaan lukea esimerkiksi pelkästään alkuosan.

Alkuosassa voidaan kertoa dokumentin tyyppi (esim. hakukelpoinen tietokanta), dokumentin tiedostonimi (jotta voidaan tehdä suhteellisia viittauksia ilman täydellisiä hakupolkuja) tai määritellä dokumentin suhde toisiin dokumentteihin (ylläpitotarkoituksissa).

Tavallisten dokumenttien kannalta tärkein alkuosan komento on <TITLE> -komento, jolla määritellään HTML-näyttimen ikkunassaan esittämä dokumentin nimi. Tämä nimi ei siis näy varsinaisessa tekstissä vaan näyttimen ikkunan otsikkona. Useat näyttimet käyttävät tätä nimeä oletusarvonimenä dokumettia tallennettaessa.

Loppuosassa esitetään varsinainen esitettävä asia. Se voi sisältää

Teksti

HTML-dokumentit ovat pelkistettyjä tekstidokumentteja (7-bittistä asciita), tästä syystä skandinaaviset ääkköset ja joukko erikoismerkkejä joudutaan koodaamaan. Ääkköset koodataan niin, että ensin tulee erikoismerkki & ja sitten koodattavaa kirjainta vastaava ylätäpätön kirjain ja sitten teksti uml. Siis
	ä	=	&auml;	Ä	=	&Auml;
	ö	=	&ouml;	Ö	=	&Ouml;
	å	=	&aring;	Å	=	&Aring;	
Tekstiä voidaan muotoilla useilla keinoilla. HTML-kieli sisältää

Kappalejako

Kappalevälin osoittava komento on <P>. Kappaleväli ilmenee tyhjänä rivinä kappaleiden välillä.

Otsikointi

Otsikoita voi olla kuutta eri tasoa.
<H1> Otsikko </H1>	Pääotsikko
<H2> Aliotsikko </H2>	Aliotsikko
... jne
<H6> Aliali...otsikko </H6>	Alimman tason otsikko

Tekstin korostuskeinot (tyylit)

Tekstin korostuskeinoja (tyylejä) on sekä loogisia että fyysisiä. Tämä juontaa juurensa SGML-lielen ideologiasta, jota voisi kuvata sanonnalla: &quot;Kauneus on katsojan silmässä&quot;. Tällä tarkoitetaan sitä, että eri HTML-lukijat (Mosaic, Netscape,...) esittävät loogiset tyylit omilla, välineelle mahdollisilla tavoilla.

SGML-kielen idea on siinä, että dokumenteissa tulee erottaa sisältö ja muoto. Esimerkiksi pääotsikot ilmoitetaan merkitsemällä ne ensimmäisen tason otsikoiksi, ei sanomalla, että ne ovat 18 pisteen lihavoitua Timesia keskitettynä riville alkaen aina uudelta sivulta. Tämän ajattelutavan etuna on se, että näin muotoiltua tekstiä voidaan esittää hyvinkin erilaisilla välineillä, kukin väline käyttää niitä muotoilukeinoja, jotka ovat mahdollisia. Toisaalta huono puoli on se, ettei kirjoittaja voi olla koskaan varma, miltä teksti näyttää kaikilla mahdollisilla välineillä.

Loogiset tyylit

Korostus
<EM> ... </EM> (emphasis), esitetään yleensä kursiivina
Voimakas korostus
<STRONG> ... </STRONG> (strong emphasis), esitetään yleensä lihavoituna
Näppäily
<KBD> ... </KBD> (keyboard), esitetään yleensä lihavoituna tasavälifonttina
Ohjelmakoodi
<CODE> ... </CODE> (code fragement), esitetään yleensä tasavälifonttina
Tulostusesimerkki
<SAMP> ... </SAMP> (sample message), esitetään yleensä tasavälifonttina
Lainaus
<CITE> ... </CITE> (citation), esitetään yleensä kursiivina
Määrittely
<DFN> ... </DFN> (definition), esitetään yleensä kursiivina
Muuttuja
<VAR> ... </VAR> (variable), esitetään yleensä kursiivina

Fyysiset tyylit

Lihavointi, kursiivi, alleviivaus, tasavälifontti
Ei esitetä tässä

Tekstin muotoilukeinot (formaatit)

Yleistä

Teksti voidaan esittää listoina, lainauksina, osoitteina, valikkoina ja hakemistolistoina.

Listoja on useampaa tyyppiä, tyypit vaihtelevat esim. sen mukaan numeroidaanko listan alkiot vai ei. Listojen yleinen muoto on seuraava:

<xL> Listan alku (x kertoo listan tyypin)
	<LI> listan ensimmäinen alkio
	...
	<LI> listan viimeinen alkio
</xL> Listan loppu
Määrittelylistan tapauksessa listan alkio sisältää kaksi osaa, määriteltävän asian ja varsinainen määrittelyn, tällöin muoto on:
<DL> Listan alku (x kertoo listan tyypin)
	<DT> listan ensimmäinen määriteltävä asia (T=term)
	<DD> listan ensimmäinen määrittely (D=definition)
	...
	<DT> listan viimeinen määriteltävä asia (T=term)
	<DD> listan viimeinen määrittely (D=definition)
</DL> Listan loppu

Muotoilut ovat siis:

Numeroitu lista
<OL> ... </OL> (ordered list)
Numeroimaton lista
<UL> ... </UL> (unordered list)
Määrittelylista
<DL> ... </DL> (definition list)
Muotoiltu teksti
<PRE> ... </PRE> (preformatted text)
Lainattu teksti
<BLOCKQUOTE> ... </BLOCKQUOTE> (extended quotations)
Osoiteteksti
<ADDRESS> ... </ADDRESS>
Valikko
<MENU> ... </MENU>
Hakemistolistaus
<DIR> ... </DIR>

Kuvat

Kuvat määritellään dokumenttiin seuraavasti: <IMG ALIGN=sijoittelu SRC="kuvatiedosto.GIF"> kuvateksti

sijoittelu voi olla top, middle tai bottom, se kertoo, kuinka kuva sijoitetaan suhteessa kuvatekstiin.

Linkit ja ankkurit

Linkit voivat olla ulkoisia (toisiin dokumentteihin) tai sisäisiä (dokumentin sisällä). Ulkoiset linkit toisiin tiedostoihin määritellään seuraavasti: <A HREF="tiedoston_nimi.HTML"> linkki</A>

linkki on teksti, joka näytetään korostetusti, jotta lukija huomaa mitkä sanat tekstissä ovat hypertekstilinkkeja toisiin dokumentteihin tai kohtiin tekstissä.

Sisäiset linkit määritellään seuraavasti: <A HREF="#ankkuri"> linkki </A> eli #-merkki kertoo että kyseessä on dokumentin sisäinen linkki.

Ankkurit osoittavat siirtymäkohdan dokumentissa: <A NAME="ankkuri"></A>

Kommentit

Kommentti määritellään <!-- Tama on kommentti --> näin.
Yhteystiedot
Markku Tukiainen
Tietojenkäsittelytieteen laitos
Joensuun yliopisto
PL 111
80101 Joensuu
Puh:
973-151 3119
E-mail:
Markku.Tukiainen@cs.joensuu.fi tai mtuki@cs.joensuu.fi
Luotu 13.03.1995 / Päivitetty 14.03.1995 / Status: kesken