Organizácia stránky

Úvod

Každú stránku by ste si mali mať dobre zorganizovanú. Nielen aby ste sa v nej vedeli vyznať vy ale aj ten čo bude vás kód čítáť. Najlepšie je začať od začiatku. Najprv si to žiada nastaviť nadpisy.

Nadpisy sú dôležité nielen pre organizáciu ale aj pre vyhľadávače. Jedným z často používaných spôsobov organizácie alebo teda úpravy je tiež používanie logických a fyzických štýlov, ktoré ale preberieme v ďalšom lekcii.

Takisto sa používajú aj hypertextové odkazy, aby nemuseli byť všetky texty na jednej strane ale pekne zorganizované na viacerých na seba prepojených stránok. Zoznamy na prehľadnosť sa tiež veľa krát zídu. Sú tu aj odstavcové elementy, ktoré sa nie moc využívajú ale spomeniem ich všetky.

Nadpisy

Nadpisy (heading) sú to kontajnerové elementy. Rozdeľujeme ich na viac úrovní od najväčšieho nadpisu <h1> až po najmenší <h6>. Už ako som spomenul nadpisy sú veľmi dôležité a preto ich nezabudnite na svojej stránke používať.

Nadpisy by ste mali radšej používať postupne ako preskakovane. Nadpis vždy vytvorí jeden volný riadok pod textom v ňom naísaným.
Teraz si ukážeme všetky nadpisy:

<hl>Úroveň jedna je najväčší a najdôležitejší nadpis stránky</h1>
<h2>Úroveň dva je menší a vhodný pre dôležité podnadpísy</h2>
<h3>Úroveň tri je ešte menšia a vhodné pre podnadpisy</h3>
<h4>Úroveň štyri je ako normálny text ale je zvýraznený</h4>
<h5>Úroveň päť je menšia ako normálna a je tiež zvýraznená</h5>
<h6>Úroveň šesť je najmenšia oproti ostatným nadpisom</h6>

Úroveň jedna
Úroveň dva
Úroveň tri
Úroveň štyri
Úroveň päť
Úroveň šesť

Nadpis úrovne <h1> by sa mal na zobrazení stránky vyskytovať vždy len raz. Pre ďalšie nadpisy môžete používať <h2> <h3>..., ktorých môžete použiť neobmedzene.

Element <p>

Jeden z najdôležitejších odstavcových elementov je element <p> používaný pre odsadenie textu na stránke. Element <p> je kontajnerový element. Do tohto základného elementu by ste mali uzatvárať všetky texty na stránke.

Takisto pomocou kaskádových štýlov sa dá zmeniť štýl, farba a veľkosť písma. Tento element ignoruje všetky medzery a „od enterované“ riadky, toto neplatí pre vynechanie riadku v podobe elementu <br />, ktorý sme už prebrali.

Príklad:

<p>Normálny text</p>

Normálny text

Element <pre>

Element <pre> je kontajnerový element, ktorý na rozdiel od elementu <p> ponecháva medzery a riadky. To znamená, že ako si napíšete text či obrázok v zdrojov kóde taký sa vám zobrazí aj na stránke. Začiatočníci pomocou tohto elementu vytvárajú aj jednoduché tabuľky. Príklad:

<pre>

  yyyy    yyyy    ccccccccc       ooooooooo      nnn     nnn
   yyyy  yyyy    cccc    cccc    ooo     ooo     nnn    nnnn
    yyyyyyyy     cccc            ooo     ooo     nnn   nn nn
     yyyyyy      cccc            ooo     ooo     nnn  nn  nn
      yyyy       cccc            ooo     ooo     nnn  nn  nn
      yyyy       cccc            ooo     ooo     nnn nnn  nn
      yyyy       cccc    cccc    ooo     ooo     nnnnnn   nn
      yyyy        ccccccccc       ooooooooo      nnnnn    nn

</pre>

Element <blockquote>

Element <blockquote> je kontajnerový element. Text v elemente <blockquote> sa používa na väčšie odsadenie textu od okolia stránky. Tento element sa dobre upravuje v kaskádových štýloch.

Na mojej stránke sú všetky zdrojové kódy vložené do elementu <blockquote> sú viditeľne oddelené od odolného textu a ešte k tomu sú cez kaskádové štýly nadefinované.

Príklad:

<blockquote>
Použitie elementu <blockquote> po malých zmenách
</blockquote>

Element <address>

Element <address> je kontajnerový element. Tento element sa používa pre formátovanie adries, údajov o autorovi, a podobne. Väčšina prehliadačov zobrazuje text ako fyzický element <i> s určitým odsekom.

<address>
Posledná aktualizácia
</address>

Posledná aktualizácia

Element <del>

Element <del> je kontajnerový element. Text uzavretý do týchto tagov sa zobrazuje na stránke ako prečiarknutý. Takáto funkcia sa často používa ako dočasný text, čiže sa má za nedlho vymazať.

<del>
Posledná aktualizácia
</del>

Pozor zmazat

  Partneri:

Horoscope