HTML/Pealkirjad ja eraldusjooned
Pealkirjad
muudaPealkirja-elemente on HTML-is 6, kõik eri suuruse ja stiiliga. Üldkuju on selline:
<hx>Pealkiri</hx>
x tähistab siin numbrit ühest kuueni - h1
on suurim ja h6
väikseim pealkiri (või teisisõnu: h1
on esimese astme ja h6
madalaima astme pealkiri). Pealkirjad paigutatakse automaatselt omaette reale, reavahetussümboleid ei pea siin kasutama.
Tasub meelde jätta, et h1
elementi kasutatakse ainult suurte lehekülgede avapealkirjas - kaks h1
pealkirja mõjuvad ühel ja samal lehel liigse karjumisena. Teisalt aga tuleks arvesse võtta dokumendi loogilist struktuuri ja mitte hüpata alapealkirjade kasutamisel vahepealsetest üle, kasutades näiteks suure h1
pealkirja järel alapealkirjas h4
elementi (loogiline oleks h2
; muuhulgas teeb selle reegli ignoreerimine lehe halvemini loetavaks ka ekraanilugejat kasutavatele puuetega inimestele).
Näitlik pealkirjade kasutamine:
<h1>Aadu arvutiäri</h1> <h2>Tere tulemast!</h2> <p>...siin on avatekst, tervitus vms...</p> <h3>Arvutid</h3> <p>...tekst...</p> <p>...........</p> <p>...........</p> <h3>Tarkvara</h3> <p>...tekst...</p> <p>...........</p> <p>...........</p>
Ülalolev kood näeb brauseris vaadates välja selline:
Eraldusjooned
muudaTeinekord on tarvis tekitada tekstilõikude vahele pikem paus, milleks pealkiri ei sobi. Tuttav peaks olema ilukirjanduses kasutatav "kolme tärniga eraldamine":
Lorem ipsum dolor sit amet, consectetuer adi- piscing elit. Proun vel elit nec erat rutrum dictum. Etiam hendrerit purus convallis leo. Pellentesque nibh. Nam scelerisque rhoncus sem. Nulla tristique tincidunt wisi. Quisque pretium aliquam purus. Morbi cursus erat. * * * Pellentesque sed eros et eros adipiscing tempus. Etiam a metus vitae nunc tempor feugiat. Vestibulum ante ipsum primis in faucibus orci luctus et ultri- ces posuere cubilia Curae; Fusce interdum massa at sapien.
Sellisel juhul pole aga õige kasutada pealkirja, mille sisuks on kolm tärni: <h2>* * *</h2>
- tegu pole ju pealkirjaga. Samuti pole päris õige ka kolme tärni sisaldava lõigu tegemine, sest tegu pole ka tekstiga.
Selliste pauside tekitamiseks on HTML-is olemas element hr (horisontal rule - horisontaalne joon). Ning tõepoolest, nagu nimigi ütleb, annab hr
kasutamine enamikes brauserites tulemuseks horisontaalse eraldusjoone, mis ulatub ühest ekraaniservast teise. Ent sellest vaikimisi kasutatavast välimusest ei tasu ennast heidutada lasta - stiililehtede abil võib selle joone asendada täpselt sellise graafikaga nagu tarvis.
Ülaltoodud näite puhul oleks hr
kasutamine järgnev:
<p>Lorem ipsum dolor sit amet, consectetuer adi- piscing elit. Proun vel elit nec erat rutrum dictum. Etiam hendrerit purus convallis leo. Pellentesque nibh. Nam scelerisque rhoncus sem.</p> <p>Nulla tristique tincidunt wisi. Quisque pretium aliquam purus. Morbi cursus erat.</p> <hr /> <p>Pellentesque sed eros et eros adipiscing tempus. Etiam a metus vitae nunc tempor feugiat. Vestibulum ante ipsum primis in faucibus orci luctus et ultri- ces posuere cubilia Curae; Fusce interdum massa at sapien.</p>
Sagedased vead
muuda- Tihtipeale kasutatakse pealkirja-elemente, et teksti suurust muuta. Selline lähenemine on väär ja pealkirja-elemente tuleb kasutada loogiliselt, sisule vastavalt - tähtsamad pealkirjad kõrgeima astmega (
h1
), ning alampealkirjad järjest väiksema astmega (h2,h3,h4...
). Dokumendi välimust tuleb muuta siiski CSSi abil.