HTML/Tehnilised detailid

Allikas: Vikiõpikud
Jump to navigation Jump to search

Täpitähed ja muud sümbolid[muuda]

Uuemad brauserid saavad küll aru näiteks Windowsis kirjutatud ja täpitähti sisaldavast leheküljest, kuid mõnes muus süsteemis (näiteks Unixi terminalilt) kirjutamisel võib tekkida probleeme - töökoha klaviatuuril võivad täpitähed lihtsalt puududa. Sel juhul tuleb asendada erisümbolid (paraku on anglofiilist arvutile meie jaoks omased täpitähed ikkagi vaid erimärgid!) neid esindavate koodidega. Seda tehakse kahel võimalikul moel:

  • Sümbol "&", numbritähis "#", vastava tähemärgi kood (näit. 64 - @), semikoolon
  • Sümbol "&", "alusmärk" (näiteks "a"), "efektikood" (näiteks "uml"), semikoolon

Teise meetodi korral saadakse märk mingist standardsest tähest, millele lisatakse mingi täiendav osa (täpid, kriips vms). Eesti tähtede puhul vajatakse lisaefektina täppe (uml - tuleneb saksa Umlaut-ist, kuna saksa keel on ilmselt maailma tuntuim täpitähti kasutav keel), ja lainelist joont ehk tildet (tilde), seega kirjutatakse neid nii:

  • õ - õ või õ
  • ä - ä või ä
  • ö - ö või ö
  • ü - ü või ü
  • š - š
  • ž - ž

Suurtähed kirjutatakse analoogiliselt:

  • Õ - Õ või Õ
  • Ä - Ä või Ä
  • Ö - Ö või Ö
  • Ü - Ü või Ü
  • Š - Š
  • Ž - Ž

Päris kindlasti tuleb erisümboleid kasutada aga siis kui soovime kirjutada märke, mis on HTML-is erisümboli staatuses:

  • & - & (ampersand)
  • < - &lt; (less then)
  • > - &gt; (grater then)

Märgendite põimimine[muuda]

NB! Siinkohal oleks ilmselt sobiv mainida veel üht asjaolu, mis XHTMLi tulekuga rangemaks läks. Nimelt ei ole seal lubatud põimitud märgendipaare, nagu näiteks

<em>Niimoodi <strong>küll</em></strong> ei tohi seda kirjutada.

Seega erinevate märgendipaaride kasutamisel peab üks paar asuma tervikuna teise sees, mitte aga vaheliti. Sama lause sellisel kujul

<em>Niimoodi <strong>küll</strong></em> on korrektne seda kirjutada.

on aga korrektne.

Ja veel üheks soovituseks on jätta tühikud väljapoole vormindamismärgendeid, mitte nende sisse - vastasel juhul võib mõni veebilehitseja neid ignoreerida. Seega mitte

Niimoodi<strong> küll </strong>ei tohi seda kirjutada.

vaid hoopis nii:

Niimoodi <strong>küll</strong> on korrektne seda kirjutada.

Kommentaarid[muuda]

Kommentaari all mõeldakse teksti, mille eesmärgiks on selgituste andmine veebilehe eri osade kohta. Kommentaar on nähtav ainuüksi veebilehe koodis, brauseriga lehe vaatamisel teda näha ei ole. HTML-is ja ka XML-is on kommentaari üldkuju selline:

<!-- see on kommentaar -->

CDATA[muuda]

Eksiarvamus[muuda]

Levinud on arvamus, et XML-is on kommentaaride kuju järgmine:

<![CDATA[seda teksti pole näha]]>

Tegelik kasutusvaldkond[muuda]

Tegelikult tähendab CDATA (Character Data) hoopis teksti, mida XML-i parser ei töötle. Tekst alates märgendist "<![CDATA[" ja lõpetades märgendiga "]]>" võib sisalda kõiksuguseid XML-i erisümboleid, mis tavalisel kujul koodi paigutatuna võiksid vigu tekitada. Näiteks kui soovime oma veebilehel esitada ühte HTML-i koodinäidet, siis oleks loogiline ümbritseda see lihtsalt 'pre'-dega:

<pre>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>Pealkiri</title>
 </head>
 <body>
 
 </body>
 </html>
</pre>

Kuid see oleks ääretult vigane, sest brauserid leiaksid 'pre'-de vahelt hulga elemente, mis asuvad kardinaalselt vales kohas ja suure tõenäosusega poleks lehekülje vaatamisel näha mitte kui midagi. Just selliste probleemide vältimiseks on XML-is CDATA. Korraliku XML-dokumendi puhul pole meil tarvis teha muud kui lisada sellise kahtlase teksti algusesse ja lõppu CDATA märgendid:

<pre><![CDATA
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>Pealkiri</title>
 </head>
 <body>
 
 </body>
 </html>
]]></pre>

Nüüd ei proovi brauser enam tõlgendada ühtki html-i elementi, mis 'pre'-de vahele jääb ja me saame oma kena koodinäite ilma olulisi muudatusi sisse viiata oma veebilehele lisada.

See ei tööta![muuda]

Kahjuks on aga hetkel olukord brauserite vallas selline, et antud meetod ei tööta. Vaid paar brauserit (Mozilla ja Opera) oskavad sellist koodi õigesti tõlgendada ja sedagi vaid siis, kui meie veebilehekülg serveeritakse serveri poolt kui application/xhtml+xml. Kõigil teistel juhtudel aga CDATA sisse jäävat teksti ei näidata üldse (sellest ka ekslik arvamus samaväärsusest kommentaariga) või siis näidatakse hoopis vigaselt (mõnede vanade brauserite puhul, mis üldse CDATA-st teadlikud pole).

Seega ei jää meil ikkagi muud võimalust kui kasutada edasi vana-head '<' ja '>' asemdamist '&lt;' ja '&gt;'-ga:

<pre>
 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
 &lt;html&gt;
 &lt;head&gt;
 &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
 &lt;title&gt;Pealkiri&lt;/title&gt;
 &lt;/head&gt;
 &lt;body&gt;
 
 &lt;/body&gt;
 &lt;/html&gt;
</pre>

HTML-Dokument tänapäeval[muuda]

Seoses XMLi nõuetega XHTMLis on siin asi mõnevõrra keerulisem - XML vajab lisaks veel infot lehekülje kodeeringu ja muu sarnase kohta. Nii on sama pilt XHTMLis selline:

<?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="et" lang="et">
<head>
  <title>pealkiri</title>
</head>
<body>

  dokumendi sisu

</body>
</html>

Kahtlemata näib see algajale keeruline, kuid üldiselt võib selle algosa lahtiseletamise jätta hiljemaks ja kasutada sellist dokumendipäist mõnda aega lihtsalt pimesi. Kommentaariks siiski niipalju, et:

  • rida (?xml ...) näitab, et tegu on XMLiga ühilduva dokumendiga, mis kasutab iso-8859-1 kodeeringut. Et maailmas on väga palju eri keeli ja kirjaviise, siis on eri keelte tähestike jaoks kasutusel erinevad kodeeringud - näiteks vajab eesti keel õ-tähte, tšehhi keel č-tähte, vene ja vietnami keel hoopis erinevaid jne. ISO-8859-1 on ladina tähestiku kodeering, millesse võimaldavad salvestada paljud programmid, teiste hulgas Notepad.
  • rida (!DOCTYPE ...) näitab kasutatavat dokumenditüüpi (XHTML 1.0 Strict) ning selle kohta käiva info asukohta võrgus.
  • rida (html...) on endise lihtsa HTML-märgendi edasiarendus, sisaldades keelemääranguid nii XMLi kui HTMLi vormis (et - eesti keel) ning jällegi võrguviidet vastavale standardile.

Nagu näeme, on ka märgendite kirjaviis erinev - vanas versioonis kasutati suurtähti, uues väiketähti. Välja arvatud DOCTYPE, mis kirjutatakse alati suurte tähtedega.

HTML-Dokument praktikas[muuda]

Tegelikkuses on aga nii, et kõik ei toimi sugugi nõnda nagu standardid ette näevad, ja nii tekib mõnel brauseril probleeme, kui nad kohtavad dokumendi alguses XML-i deklaratsiooni. Kahjuks on selline probleem hetkel kõige levinumal veebilehitsejal - Microsoft Internet Explorer-il (IE). Õnneks pole XML-i deklaratsiooni lisamine kohustuslik ning me võime ta rahumeeli ära jätta. Sellega ühes läheb küll kaduma ka informatsioon selle kohta, millist kodeeringut dokument kasutab. Kuid vastav informatsioon on võimalik edasi anda ka sobivat 'meta'-elementi kasutades.

Seega oleks soovituslik baasdokument järgmine:

<!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="et" lang="et">
<head>
  <title>Minu esimene veebileht</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>

   dokumendi sisu

</body>
</html>