Element <aside> w HTML

Element <aside> w HTML

Element <aside> to semantyczny znacznik HTML5 służący do oznaczania treści pobocznej względem głównej zawartości strony. Jest używany przy budowie struktury strony, np. dla panelu bocznego, dodatkowych linków, reklam, informacji uzupełniających albo krótkiego biogramu autora.

Do czego służy <aside>?

<aside> informuje przeglądarkę, wyszukiwarki i technologie wspomagające, że dana część strony jest powiązana z treścią główną, ale nie jest jej najważniejszym fragmentem.

Typowe zastosowania:
- pasek boczny strony,
- lista powiązanych artykułów,
- reklamy,
- dodatkowa nawigacja,
- ciekawostki lub przypisy.

Przykład użycia

<main>
  <article>
    <h1>Poradnik HTML</h1>
    <p>Treść głównego artykułu...</p>
  </article>

  <aside>
    <h2>Powiązane tematy</h2>
    <ul>
      <li><a href="#">CSS</a></li>
      <li><a href="#">HTML5</a></li>
    </ul>
  </aside>
</main>

Dlaczego to znacznik strukturalny?

<aside> nie służy do formatowania tekstu ani do wprowadzania danych. Jego zadaniem jest opisanie roli fragmentu strony w układzie dokumentu. Dlatego należy do grupy semantycznych znaczników strukturalnych HTML5, podobnie jak <header>, <nav>, <main>, <section>, <article> i <footer>.

Ważne na egzaminie

Jeśli pytanie dotyczy znacznika budującego strukturę lub układ strony, poprawną odpowiedzią może być właśnie <aside>. Natomiast <em> i <mark> dotyczą wyróżniania tekstu, a <input> służy do tworzenia pól formularza.