A HTML oldalak készítésénél meg kell szoknunk azt, hogy a HTML-kód tördelése (mennyi üres helyet teszünk, hol nyomunk entert) a legtöbb esetben nem befolyásolja az oldal megjelenését. Ez alól kivételt jelent, ha például a <pre> taget használjuk, vagy a stíluslapban megadjuk, hogy előre formázott szövegként akarunk valamit megjeleníteni.
A <pre> tag tartalmaként megadott szöveget a böngésző azonos szélességű betűkkel jeleníti meg. Hagyományos szöveg írásához ne használjuk, de például programkód megjelenítésére jó lehet.
Amennyiben a programkódban megjegyzést szeretnénk elhelyezni (ahogy tettük ezt a 12. sorban), akkor azt a <!-- karakterlánccal vezessük be, és a --> karakterlánccal zárjuk le. Az így elhelyezett szöveg nem jelenik meg a képernyőn, csak a forráskódban lesz olvasható.
Attól, hogy a programkód tördelése – a fenti kivételtől eltekintve – nincs hatással a megjelenésre, érdemes a HTML tageket a térközökkel elválasztani és beljebb húzni aszerint, hogy milyen szinten vannak egymásba ágyazva. Ez elősegíti a kód jobb átláthatóságát, így a módosítás is gyorsabbá válhat.
A kódszintű szerkesztőprogramok (egy része) képes arra, hogy automatikusan átformázza a forráskódot a tagek egymásba ágyazása alapján, így a kód átláthatóbbá válik.
Problémafelvetés: tegyük fel, hogy egy HTML-tag szerepét akarjuk elmagyarázni egy weblapon. Mondjuk így:
A <p> tag-et akkor használhatjuk, ha bekezdést akarunk létrehozni.
Az alábbi kódban ezt látjuk.
Ha megtekintjük az eredményt, tapasztaljuk, hogy a <p> tag-et nem írta ki a böngésző, hanem végrehajtotta, vagyis az "A" betű utáni szöveg egy új bekezdésbe került. Ahhoz hogy a <p> karakterláncot a böngésző kiírja, egy trükkhöz kell folyamodnunk. A < és > jelet speciális kódokkal kell helyettesítenünk. A < jel helyett a < az > helyett a > kódot kell használnunk. Vagyis a következő kódot kell a forráskódban elhelyeznünk:
<p>A <p> taget akkor használhatjuk, ha bekezdést akarunk létrehozni.</p>
A leggyakrabban használt speciális karakterek (pl. paragrafus jel, ezrelék jel, gondolatjel, stb.) mindegyikének van ilyen kódja, amelyek közül néhányat az alábbi táblázatban is feltüntettünk.
| Karakter | HTML kód | unicode | Karakter | HTML kód | unicode |
|---|---|---|---|---|---|
| ´ | ´ | ´ | < | < | < |
| & | & | & | ? | ¯ | ¯ |
| | | ¦ | ¦ | ? | µ | µ |
| . | • | • | |   | |
| c | ¢ | ¢ | ? | ¬ | ¬ |
| © | © | © | ? | ¶ | ¶ |
| ° | ° | ° | ? | ‰ | ‰ |
| ? | € | € | ? | ± | ± |
| ÷ | ÷ | ÷ | " | " | " |
| ? | ½ | ½ | ® | ® | ® |
| ? | ¼ | ¼ | > | » | » |
| ? | ¾ | ¾ | § | § | § |
| > | > | > | ¨ | ¨ | ¨ |
| ! | ¡ | ¡ | × | × | × |
| ? | ¿ | ¿ | ™ | ™ | ™ |
| < | « | « | o | ø | ø |
A speciális karaktereket az úgynevezett Unicode-kód segítségével is megjeleníthetjük. Amennyiben az oldalainkon az írásjeleket is precízen szeretnénk használni, szükségünk lesz ezen kódokra, gondoljunk csak a speciális idézőjelek, a különböző hosszúságú gondolatjelek használatára!
Egy bővebb listát találunk a következő webcímen: http://en.wikipedia.org/wiki/List_of_XML_and_HTML_character_entity_references
A fenti táblázat alapján írjuk le HTML nyelven az alábbi példákat:
© ELTE Informatikai Kar
A forrásban lévő víz hőmérséklete 100 °C.
103. § (1) A határidőket napok, hónapok vagy évek szerint kell számítani.
A szállás díja: 120 €
  |
 |
 |
A tananyag az ELTE - PPKE informatika tananyagfejlesztési projekt (TÁMOP-4.1.2.A/1-11/1-2011-0052) keretében valósult meg.
A tananyag elkészítéséhez az ELTESCORM keretrendszert használtuk.