Eri kuvauskielet – XHTML ja HTML

XHTML on XML-kieltä

Verkkosivujen merkkauskielistä on olemassa eri versioita. Merkkauskielistä käytetään tätä nykyä erityisesti XHTML-merkkauskieltä (X tulee sanasta eXtensible, laajennettava), joka on HTML-kielen uudelleenmäärittely yleisemmän, ns. XML-merkkauskielen (eXtensible Markup Language) kieliopin mukaisesti. Aiempiin versioihin nähden tämä tarkoittaa XHTML:n osalta lähinnä kolmea asiaa:

  1. Elementtien tunnisteet kirjoitetaan pienillä kirjaimilla.
  2. Kaikki elementit tulee sulkea: alkutunnistetta on aina jossain vaiheessa seurattava vastaava lopputunniste.
  3. Merkkauksen on oltava oikein muodostettua ja virheetöntä: elementit eivät saa olla esimerkiksi lomittain. Merkkauksen oikeellisuuden tarkistamisesta kerrotaan validoinnista kertovalla sivulla.

Semanttinen merkkaus

Periaatteellisempi muutos XHTML:ssa on verkkosivun rakennetta kuvaavan merkkauksen erottaminen ulkoasun kuvailusta. Oikeaoppinen XHTML-koodi on semanttista: koodi sisältää vain tekstin rakennetta kuvaavia tunnisteita. Käytännössä esimerkiksi tekstin otsikot tulee siis XHTML:ssa merkata otsikkotunnisteilla, ei lihavoimalla tai kirjasinkokoa suurentamalla. Samoin tekstikappaleet tulee määritellä p-elementin sisään sen sijaan, että ne erotettaisiin toisistaan kahdella pakollisella rivinvaihdolla (rivinvaihtomerkki on <br/>).

XHTML ei myöskään sisällä esimerkiksi värien määrittelytapoja tai kirjasinten tyypin muuttamista, sillä XHTML:ää käytettäessä sivujen ulkoasu tulee määritellä kokonaan erillisellä CSS-tyylikielellä (Cascading Syle Sheets). Tyylien avulla määritellään eri elementeille ominaisuuksia (esimerkiksi tekstin koko ja väri) sen sijaan että ne koodattaisiin suoraan verkkosivulle. Käytetyt tyylit tallennetaan puolestaan omaan tyylitiedostoonsa.

Semanttisesta merkkauksesta on useita etuja:

  • Semanttinen koodi on siistimpää, ymmärrettävämpää ja helpommin päivitettävää kuin ulkoasuun keskittyvä merkkaus. Koodia on myös helpompi käyttää uudelleen.
  • Ulkoasun ja rakenteen erottamisen ansiosta sivujen ulkoasua voidaan CSS-tyyleillä muuttaa tai päivittää itse sivujen sisältöön ja rakenteeseen puuttumatta. Sivuista voidaan myös tuottaa erilaiset ulkoasut eri medioille (tietokoneen näyttö, paperituloste, kännykän näyttö) ilman sisällön monistamista ja siihen liittyvää lisätyötä.
  • Verkkoselain löytyy tulevaisuudessa yhä useammasta laitteesta. Rakenteellisesti koodattu verkkosivu toimii hyvin myös näissä laitteissa, jotka eivät ehkä osaa tai joissa ei teknisesti voida esittää monimutkaisia ulkoasumuotoiluja tai kehyksiä.
  • Semanttisesti merkattua tekstiä voidaan lukea ja käsitellä helpommin ohjelmallisesti ja esimerkiksi käännökset muihin tiedon esittämismuotoihin voidaan automatisoida.