Element <cite> w HTML służy do oznaczania tytułu dzieła – np. książki, filmu, obrazu, utworu muzycznego czy strony internetowej. Jest to element semantyczny, który jasno wskazuje przeglądarce, czytelnikom i robotom indeksującym, że dana fraza to tytuł cytowanego lub przywoływanego dzieła.
Kiedy używać <cite>
Elementu <cite> należy używać wyłącznie do oznaczania tytułu dzieła. Przez „dzieło” rozumie się m.in.:
- książkę,
- artykuł,
- film,
- piosenkę,
- obraz lub rzeźbę,
- utwór sceniczny (np. sztuka, opera),
- program komputerowy,
- stronę internetową lub bloga,
- post na forum lub mediach społecznościowych.
Nie powinno się używać <cite> do oznaczania autora, wydawcy czy daty publikacji – wyłącznie tytułów.
Przykłady zastosowania
<p>Kultowa powieść <cite>Lalka</cite> napisana została przez Bolesława Prusa.</p>
<blockquote>
"Jestem tylko marionetką na sznurku życia."
<cite>Lalka</cite>
</blockquote>
<p>Więcej informacji o obrazie <cite>Krzyk</cite> znajdziesz w artykule na naszym blogu.</p>
W powyższych przykładach:
<cite>wyróżnia tytuł powieści „Lalka” oraz tytuł obrazu „Krzyk”,- w bloku cytatu
<blockquote>,<cite>podaje źródło cytatu, czyli tytuł dzieła.
Wyświetlanie i styl domyślny
Przeglądarki zazwyczaj wyświetlają treść w <cite> kursywą, jednak ten wygląd można nadpisać za pomocą CSS, np.:
cite {
font-style: normal;
color: #2d3a4a;
}
Semantyka pozostanie zachowana nawet przy innym stylu.
Najlepsze praktyki
- Używaj wyłącznie do tytułów dzieł – nie do nazwisk autorów ani lokalizacji;
- Stosuj w cytatach – przy cytowaniu fragmentu tekstu dobrze dodać
<cite>z tytułem dzieła; - Możesz zagnieżdżać
<a>w<cite>– dla linkowania do oryginalnego dzieła:
<p>Recenzja filmu <cite><a href="/recenzje/incepcja">Incepcja</a></cite>.</p>
- jeśli cytujesz dłuższy fragment tekstu, umieść
<cite>w stopce cytatu po<blockquote>.
Przykład rozbudowanej struktury cytowania
<figure>
<blockquote>
<p>„Widzimy tylko to, co chcemy zobaczyć.”</p>
</blockquote>
<figcaption> – z powieści <cite>Cień wiatru</cite> </figcaption>
</figure>
Czego nie robić z <cite>
- nie używać do nazw własnych niezwiązanych z dziełem (np. nazwy firmy, nazwiska twórcy),
- nie wstawiać fragmentów cytatów, tylko tytuły,
- nie używać w miejsce zwykłego wyróżnienia treści kursywą.
Podsumowanie
Element <cite> jest kluczowy dla poprawnej, dostępnej i semantycznej struktury HTML. Pomaga zarówno osobom czytającym treść, jak i technologii (np. robotom wyszukiwarek) jednoznacznie rozpoznać, które fragmenty tekstu są tytułami dzieł. Poprawne zastosowanie tego znacznika to fundament nowoczesnych, dobrze zorganizowanych stron internetowych.
