Lai dokumenta struktūra būtu labi saprotama un pārskatāma gan Tavas lapas apmeklētājiem, gan meklētājiem, nepieciešams pareizi lietot virsrakstus, rindkopas un teksta formatēšanas elementus.

Virsraksti, cik dažādu līmeņu virsrakstus var izveidot html kodā?

HTML pieļauj sešus virsrakstu līmeņus — <h1>, <h2>, <h3>, <h4>, <h5>, <h6>. Ir būtiski tos lapā lietot atbilstoši satura nozīmei. Nav jāuztraucas par burtu noformējumu vai izmēru — to visu pēc tam varēs norādīt ar CSS palīdzību. Rakstot HTML kodu, virsrakstus ir jāizvēlas pēc nozīmes, nevis burtu izmēra.

Tie sakārtoti secīgi pēc nozīmīguma. <h1> ir pats svarīgākais virsraksts. Katrā lapā vajadzētu būt tikai vienam <h1>, un tam vajadzētu saturēt lapas galveno nosaukumu. Tālāk katrai satura sadaļai un apakšsadaļai var lietot zemāka līmeņa virsrakstus.

Piemērs:

<h1>Pirmā līmeņa virsraksts</h1>
<h2>Otrā līmeņa virsraksts</h2>
<h3>Trešā līmeņa virsraksts</h3>

Rezultāts:

HTML virsraksti

Rindkopas

Tekstu vēlams dalīt rindkopās, ko HTML valodā apzīmē ar <p> tagu. Tas atvieglo teksta lasīšanu lapas apmeklētājiem. Rindkopas pēc noklusējuma tiek atdalītas ar nelielu atstarpi, ko var pielāgot ar CSS.

Piemērs:

<p>Šī ir ļoti svarīgā teksta pirmā rindkopa.</p>
<p>Šī ir otra rindkopa<br>
ar pārnesi jaunā rindā, taču joprojām šīs rindkopas ietvaros.</p>

Rezultāts:

HTML rindkopas

Teksta formatēšanas tagi

HTML piedāvā vairākus tagus teksta semantiskai formatēšanai. Katram no tiem ir konkrēta nozīme:

  • <strong> — svarīgs teksts (treknraksts). Lietojams, lai uzsvērtu saturiski nozīmīgu informāciju
  • <em> — uzsvērts teksts (slīpraksts). Lietojams, lai piešķirtu tekstam intonācijas uzsvaru
  • <mark> — iezīmēts teksts. Lietojams, lai izceltu tekstu, piemēram, meklēšanas rezultātos
  • <small> — mazāks teksts. Lietojams sīkajam drukātajam tekstam, piemēram, autortiesību informācijai
  • <del> — dzēsts teksts. Norāda, ka teksts ir svītrots vai vairs nav aktuāls
  • <ins> — ievietots teksts. Norāda tekstu, kas ir pievienots dokumentam
  • <sub> — apakšraksts. Piemēram, ķīmiskajās formulās: H2O
  • <sup> — augšraksts. Piemēram, matemātikā: x2

Piemērs

<p>Šis ir <strong>ļoti svarīgs</strong> teksts ar <em>uzsvaru</em>.</p>
<p>Ūdens formula: H<sub>2</sub>O</p>
<p>Cena bija <del>20€</del> <ins>15€</ins></p>

Citāti

<blockquote> tiek lietots garāku citātu noformēšanai, kas parasti tiek attēlots atkāpē no pamatteksta:

<blockquote>
<p>Iztēle ir svarīgāka par zināšanām.</p>
<footer>— Alberts Einšteins</footer>
</blockquote>

Savukārt īsiem citātiem teksta plūsmā lieto <q> tagu.

Koda fragmenti

<code> tagu lieto, lai iezīmētu koda fragmentus tekstā. Lielākiem koda blokiem to kombinē ar <pre> (preformatēts teksts), kas saglabā atstarpju un rindu pārnešu formatējumu:

<pre><code>
function sveiki() {
alert("Sveika, pasaule!");
}
</code></pre>

Par tālāku teksta noformēšanu izmantojot CSS, lasi CSS pamācībā: Teksta noformēšana ar CSS

Laboja mad, labots 2x