HTML i etiketi nedir?

Mehmet · Dün 20:34 da

HTML i etiketi nedir?

HTML  etiketi, metnin çevresindeki normal akıştan farklı bir anlam veya ses taşıdığını belirtmek için kullanılır. Teknik terimler, başka dillerdeki ifadeler, taksonomik adlar, iç düşünceler, alternatif anlatım biçimleri ve gemi adları gibi içerikler için uygundur. Tarayıcılar çoğunlukla içeriği eğik gösterse de  etiketinin asıl amacı yalnızca eğik görünüm vermek değil, metne anlamsal bir ayrım kazandırmaktır.

i etiketi nasıl kullanılır?

Etiket, bir metin parçasının başına ve sonuna yazılır. İçerik başka bir dildeyse, yardımcı teknolojilerin dili doğru yorumlayabilmesi için lang özniteliği eklenebilir:

Kod:

<p>
  Bu ifade <i lang="la">Veni, vidi, vici</i> olarak bilinir.
</p>

<p>
  Bu örnekte <i lang="en">bandwidth</i> teknik bir terim olarak kullanılmıştır.
</p>

<p>
  Kurgusal karakter düşündü: <i>Bu değişikliği önce test etmeliyim.</i>
</p>

İçeriğin hangi nedenle ayrıldığını daha sonra CSS ile ayrı biçimlendirmek istiyorsanız sınıf adı ekleyebilirsiniz:

Kod:

<p><i class="technical-term" lang="en">semantic HTML</i> burada teknik terim olarak geçiyor.</p>

Burada technical-term sınıfı, etiketin neden kullanıldığını kodu okuyan kişiye açıklar. Ancak sınıf eklemek,  etiketinin anlamsal kullanımının yerine geçmez.

i, em ve CSS font-style farkı

Karar verirken metnin anlamına bakın; yalnızca ekranda nasıl göründüğüne göre etiket seçmeyin.

Seçenek	Ne anlatır?	Örnek kullanım
`<i>`	Normal metinden farklı bir ses, tür veya bağlam	Teknik terim, yabancı ifade, bilimsel ad
`<em>`	Vurgulu okuma veya vurgu	Cümlede özellikle sözcüğüne vurgu
`font-style`	Görsel yazı stilini belirler	Bir metni CSS ile eğik göstermek

Örneğin cümlede belirli bir kelimenin sesli okumada vurgulanmasını istiyorsanız  kullanın:

Kod:

<p>Bu dosyayı <em>hemen</em> yedekleyin.</p>

Metnin yalnızca tasarım gereği eğik görünmesini istiyorsanız HTML anlamı eklemeyin; CSS kullanın:

Kod:

<p class="italic-note">Bu metin görsel olarak eğik gösterilir.</p>

<style>
  .italic-note {
    font-style: italic;
  }
</style>

Bu kullanımda font-style görünümü yönetir, metnin özel bir anlam taşıdığını iddia etmez. Ayrıca  etiketi ile CSS birimindeki em aynı şey değildir: ilki HTML’de vurgu anlamı taşır, ikincisi CSS’te göreli ölçü birimidir.

Doğru etiketi seçmek için kısa kontrol

Metin, normal cümleden farklı bir terim, dil, anlatıcı sesi veya ad mı? Uygunsa  kullanın.
Okuyucunun kelimeyi vurgulu algılaması mı gerekiyor?  seçin.
Amaç yalnızca yazıyı eğik göstermek mi? CSS’te font-style kullanın.
Yabancı dildeki içerikte doğru dili lang özniteliğiyle belirtin; örneğin lang="fr".
Teknik terim, bilimsel ad veya başka bir kullanım türünü ayırmak istiyorsanız anlamı açıklayan bir class adı ekleyin.

Sık yapılan hatalar

 etiketini her eğik yazı ihtiyacında kullanmak: Bu, HTML anlamını gereksiz yere değiştirir. Görsel amaçta CSS tercih edilmelidir.
Vurguyu  ile belirtmek: Vurgu anlamı için  daha doğru seçimdir.
Bilimsel veya yabancı ifadelerde lang bilgisini atlamak: Dil bilgisi, ekran okuyucuların telaffuzunu etkileyebilir.
Kapanış etiketini unutmak:  için hem açılış hem kapanış etiketi yazılmalıdır.

Sık sorulan sorular

i etiketi metni her zaman eğik gösterir mi?

Hayır. Varsayılan tarayıcı stillerinde çoğunlukla eğik görünür; ancak CSS ile bu görünüm değiştirilebilir veya kaldırılabilir. Etiketin temel değeri görsel değil, anlamsal ayrımdır.

Teknik terim için i mi, dfn mi kullanılmalı?

Bir terimin sayfada ilk kez tanımlandığı yeri işaretliyorsanız <dfn> daha uygundur. Terim yalnızca normal metinden farklı bir teknik ifade olarak geçiyorsa  kullanılabilir.

HTML i etiketi nedir?

Mehmet