Ukážeme si základní techniky, pomocí kterých docílíme lepšího sémantického obsahu.
Zcela bezpochyby je užívání elementu DIV, velmi pohodlné, jelikož pomocí něho můžeme vystylovat jakýkoliv prostor, který si zamaneme.
Tohle by řekl grafik. Ovšem komplexní tvůrce stránek, který se zajímá o SEO, jistě navrhne, že element DIV je bezvýznamný. Nemá žádný význam, prohlížeč neví jestli tato část je nadpis, odstavec, prostě je bezvýznamná. Omezte tedy používání tohoto elementu v souboru (X)HTML na minimum.
Jednoduše pomocí tříd (class), uvedeme si to na příkladu:
Dejme tomu, že chceme definovat jiný vzhled poslednímu odstavci na stránce
Špatný zápis
<div id="posledníodstavec">
Lorem ipsum dolor sit amet consectetuer ..........
</div>
Správný zápis
<p class="posledniodstavec">
Lorem ipsum dolor sit amet consectetuer ..........
</p>
Takhle jsme elegantně ušetřili jeden div a řekli jsme prohlížeči, že tohle je odstavec.
Mnohokrát jsem viděl, kdy autor stránek použije místo klasického odstavce <p> 2x <br /> <br />
V CSS spousta lidí píše:
margin-top:5px;
margin-right:25px;
margin-bottom:10px;
margin-left:15px;
Když můžeme napsat to samé takhle:
margin:5px 25px 10px 15px; (jde to podle hodinových ručiček, první hodnota je top, druhá right, třetí bottom, čtvrtá left)
méně kódu = rychlejší načítání stránek = lepší hodnocení stránek = více zákazníků