HTML <em> <strong> <dfn> <code> <samp> <kbd> <var> Etiketleri

[guclusat]

<em>Vurgulanmış metin</em>
<strong>Güçlü metin</em>
<dfn>Terim tanımı</dfn>
<code>Bir parça bilgisayar kodu</code>
<samp>Örnek bilgisayar program çıktısı</samp>
<kbd>Klavye Girişi</kbd>
<var>Değişken</var>

Tanım ve Kullanımı
<em> <strong> <dfn> <code> <samp> <kbd> ve <var> etiketleri metin etiketleridir. Bu etiketler kullanım dışı değildir ve CSS ile daha zengin hale getirilebilirler.



HTML 4.01 ve HTML5 Farkları
HTML5'de <strong> etiketi önemli metin tanımlar.

HTML 4.01'de <strong> etiketi güçlü metin tanımlar.

 

[guclusat]

HTML Semantik Metin Etiketleri: em, strong, dfn, code, samp, kbd, var​

HTML5 ile birlikte etiketlerin sadece görsel değil, anlamsal (semantic) görevleri önem kazanmıştır. Bu rehberde, metinlerinizi hem kullanıcılar hem de arama motorları için daha anlamlı kılan etiketleri inceliyoruz.

1. Vurgu ve Önem Belirten Etiketler​

• <em>

  (Emphasis): Metni eğik (italic) yapar ancak asıl amacı metne vurgu katmaktır.[]

  <strong>

  (Strong): Metni kalın yapar. Google botlarına bu kısmın önemli olduğunu söyler. SEO açısından kritik kelimelerde tercih edilir.

2. Tanım ve Terim Etiketleri​

• <dfn>

  (Definition): Bir terimin metin içindeki ilk geçtiği yeri veya tanımını belirtir.[]

  <var>

  (Variable): Matematiksel veya yazılımsal bir "değişkeni" temsil eder (Örn: [var]x[/var] + [var]y[/var]).

3. Yazılım ve Kod Görüntüleme Etiketleri​

Teknik forumlarda en çok kullanılan etiket grubudur:

• <code>

  : Satır içi kısa kod parçalarını belirtmek için kullanılır.[]

  <kbd>

  (Keyboard Input): Kullanıcının klavyeden girmesi gereken tuşları belirtir (Örn: [kbd]CTRL[/kbd] + [kbd]C[/kbd]).

• <samp>

  (Sample Output): Bir programın veya sistemin verdiği çıktı örneğini gösterir.

Uygulama Örneği​

<p>Sistem ayarlarını kaydetmek için <strong><kbd>CTRL</kbd> + <kbd>S</kbd></strong> kombinasyonunu kullanın.Eğer işlem başarılı olursa ekranda <code><samp>Kayıt Tamamlandı</samp></code> iletisini göreceksiniz.
</p>

---

SEO ve Kullanıcı Deneyimi İçin İpuçları​

• Google Uyumu: Anahtar kelimelerinizi sadece kalın yapmak için değil, gerçekten önemli oldukları için

  <strong>

  içine alın.
• Okunabilirlik: Yazılım dersleri hazırlarken kod bloklarını mutlaka

  <code>

  veya

  [CODE]

  etiketleri arasına alın; bu, Google'ın içeriğinizi "Eğitici/Teknik Rehber" olarak işaretlemesini sağlar.
• CSS Desteği: Bu etiketlerin varsayılan görünümlerini extra.less üzerinden özelleştirerek forum tasarımınıza tam uyumlu hale getirebilirsiniz.