HTML ma dwa natywne znaczniki (tagi HTML), które pozwalają pochylić tekst i wyświetlić zawartość w przeglądarce kursywą. Jest to znacznik <i> oraz <em>.

Znacznik <i>

Znacznik <i> jest niesemantycznym znacznikiem, tzn. takim, który niesie informacje wizualne w przeglądarce, ale roboty internetowe nie zwracają (nie powinni zwracać) szczególnej uwagi na niego. Użycie tagi <i> ma charakter wyłącznie prezentacyjny.

Przykładowy kod użycia <i> znajdziesz poniżej.

<p>Lorem ipsum dolor sit <i>pochylony tekst</i> amet, consectetur adipiscing elit. Nunc a ex lacus.</p>

Lorem ipsum dolor sit pochylony tekst amet, consectetur adipiscing elit. Nunc a ex lacus.

Ma charakter wyłącznie prezentacyjny. Już teraz w miejsce pochylenia zaleca się stosowanie polecenia em, które ma charakter semantyczny.

Znacznik <em>

Znacznik <em>, czyli tak zwana emfaza, jest semantycznym znacznikiem umożliwiającym wyróżnienie treści za pomocą pochylenia (kursywa/italic). Emfaza ma mniejszą wartość semantyczną niż znacznik <strong>.

Przykładowy kod użycia <em> znajdziesz poniżej.

<p>Lorem ipsum dolor sit <em>pochylony tekst</em> amet, consectetur adipiscing elit. Nunc a ex lacus.</p>

Lorem ipsum dolor sit pochylony tekst amet, consectetur adipiscing elit. Nunc a ex lacus.

Czym różni się znacznik <i> od znacznika <em>?

Powtarzając i podsumowując, znacznik <i> ma wyłącznie charakter prezentacyjny, pokazując pochylony tekst. Znacznik <em> powinien być używany, gdy chcemy dodatkowo zwrócić uwagę botów wyszukiwarek, mówić im, że tekst ma faktycznie wyróżnione znaczenie wśród otaczającej go innej treści. 

Trzeba pamiętać, że możemy wykonać również pochylenie teksty w CSS, umożliwia nam to własność font-style: italic. Tak pochylony tekst nie otrzymuje znaczenia semantycznego, a prezentacyjne.