Egzamin zawodowyPortal części pisemnej

INF.03 · pytanie 387

Przeglądarka internetowa wyświetliła stronę w następujący sposób. Wskaż kod HTML, który poprawnie definiuje przedstawioną hierarchiczną strukturę tekstu:

Ilustracja do pytania 387: Przeglądarka internetowa wyświetliła stronę w następujący sposób. Wskaż kod HTM…
  1. A<h1>Rozdział 1<p>tekst <h2>Podrozdział 1.1<p>tekst <h2>Podrozdział 1.2
  2. B<ul><li>Rozdział 1<li>tekst<li>Podrozdział 1.1<li>tekst<li>Podrozdział 1.2</ul>
  3. C<big>Rozdział 1</big>tekst<big>Podrozdział 1.1</big>tekst<big>Podrozdział 1.2</big>
  4. D<h1>Rozdział 1</h1> <p>tekst</p> <h2>Podrozdział 1.1</h2> <p>tekst</p> <h2>Podrozdział 1.2</h2>Poprawna

Wyjaśnienie

Odpowiedź jest w porządku! Użycie znaczników <h1> i <h2> wraz z <p> to dobry krok, bo to właśnie tak powinno wyglądać semantyczne formatowanie w HTML. Znacznik <h1> to taki główny nagłówek, który mówi, o czym jest cała strona lub sekcja, a to naprawdę kluczowe dla porządku w treści i SEO. Dzięki nagłówkom w HTML łatwiej jest zrozumieć, co jest na stronie, zarówno dla ludzi, jak i programów, które przeszukują internet. Jak już masz <h2>, to świetnie, bo to pokazuje podrozdziały, a więc hierarchię informacji. Użycie <p> dla tekstu to też dobry pomysł, bo sprawia, że tekst jest bardziej czytelny. Warto pamiętać, że semantyczne znaczniki HTML pomagają osobom z niepełnosprawnościami korzystać z internetu. Według wytycznych WCAG powinno się je stosować, żeby poprawić dostępność. A jak to robić z głową, to łatwiej potem stylować stronę przy użyciu CSS, bo możesz zmieniać wygląd bez bawienia się w treść HTML. Generalnie, dobrze jest, gdy dokumenty są jasne zarówno dla ludzi, jak i dla maszyn – to standard w nowoczesnym webdesignie.