HTML Metin Biçimlendirme

Web siteleri HTML sayfalarından oluşur. HTML sayfaları da metin, resim, video gibi içeriklerden oluşur.

Yazıları bazen koyu, renkli, italik yazmak isteyebiliriz.

Bu durumda HTML metin biçimlendirme elementlerini kullanırız.

<p>
    <b>Bu vurgulu bir yazı</b>
</p>
<p>
    <i>Bu italik (sağa eğik) bir yazı</i>
</p>
<p>
    Bu<sub> alt simge</sub> ve <sup>üst simge</sup>
</p>

HTML Biçimlendirme Elementleri

Daha önceki derste style özniteliğini öğrenmiştik.

HTML aynı zamanda metin biçimlendirmek için bize bazı özel anlamları olan özel etiketler sunar.

Örneğin, HTML bize metinleri koyu, vurgulu yapmak için <b> etiketini sunar.

HTML Metinleri biçimlendirme işlemlerinde şu etiketlerden faydalanırız:

• <b> Koyu metin
• <strong> Önemli metin
• <i> İtalik, sağa yatık metin
• <em> Vurgulu metin (önemli, vurgu yapmak istediğinizde)
• <mark> İşaretlenmiş metin
• <small> Küçük metin
• <del> Silinmiş, geçerliliğini yitirmiş metin. Örneğin bir metin içinde bir paragraf zamanla geçerliliğini yitirdi. O zaman silmek yerine bu etiketi kullanın.
• <ins> Eklenmiş metin. Yazınızı yazdınız ve bir ay sonra ekleme yaptınız. O zaman bu etiket ile ekleme yaptığınız alanı işaretleyin.
• <sub> Alt simge
• <sup> Üst simge

HTML <b> ve <strong> Elementleri

Her iki etiket de görsel olarak aynı etkiyi yapmakla birlikte ikisi arasında çok büyük mantıksal bir fark vardır:

<b> sadece metni koyu yapar.

<strong> metni koyu yapar ve aynı zamanda arama motorları için "bu etiket ile işaretli alan önemlidir" anlamını verir.

<b>Bu sadece koyu bir metin</b>
<br/>
<strong> Bu koyu görünen fakat aynı zamanda önemli bir bilgi ifade eden metin</strong>

HTML <i> ve <em> Elementleri

<i> elementi metni italik yapar. Bu sadece görsel olarak yazıyı sağa eğik yapar.

<em> görünüm olarak aynı etkiyi yapar. Fakat anlamsal olarak arama motoru ve diğer programlara "bu etiket ile işaretlenmiş metni vurgulanmış ve önemli" mesajını verir.

<i>Bu alan sadece italik</i><br/>
<em>Bu yazı sayfa içerisinde önemli bir alanı işaret ediyor.</em>

HTML <small> Element

<small> etiketi metni sadece normal boyutundan daha küçük hale getirir.

<h1>HTML <small>small etiketi</small> kullanımı</h1>

HTML <mark> Elementi

<mark> HTML etiketi metinleri üstü işaretlenmiş, vurgulanmış hale getirir.

<h1>HTML <mark>mark etiketinin </mark> kullanımı</h1>

HTML <del> Elementi

<del> HTML elementi silinmiş, kaldırılmış metinleri göstermek için kullanılır.

Yayınlanan yazı içerisinde zamanla doğruluğunu, geçerliliğini kaybetmiş bilgi varsa bu etiket ile işaretlenmelidir.

<p><del>uzmanım.net'te</del> uzmanım akademi'de çalışıyorum.</p>

HTML <ins> Elementi

<ins> elementi HTML ifadelerinde eklenmiş yazılar için kullanılır.

<ins> etiketi daha önceden yayınlanmış bir HTML belgesine ilave yapıldığında kullanılır.

Örneğin bir ay önce yayınladığınız bir makaleye ek yaptığınızda bunu <ins> etiketi ile yapabilirsiniz.

<p>
<del>Bu virüsün şuan bir çaresi yok</del>. <ins>Virüse çare bulundu.</ins>
</p>

HTML <sub> Elementi

<sub> elementi HTML belgelerinde alt simge için kullanılır. Örneğin ¹/₂ ifadesinde ₂  sub etiketi ile yapılmıştır.

<p>
HTML kullanımında <sub>sub</sub> etiketi
</p>

HTML <sup> Elementi

<sup> elementi HTML belgelerinde üst simge için kullanılır. Örneğin ¹/₂ ifadesinde ¹ sup etiketi ile yapılmıştır.

<p>
HTML kullanımında <sup>sup</sup> etiketi
</p>