
Web tasarımında önemli bir ilke, tarayıcıda varsayılan olarak nasıl görünebileceklerinden ziyade, gerçekte ne olduklarını belirtmek için HTML öğelerinin kullanılması fikridir. Bu, anlamsal HTML kullanımı olarak bilinir.
Anlamsal HTML Nedir?
Anlamsal HTML veya anlamsal biçimlendirme, yalnızca sunumdan ziyade web sayfasına anlam katan HTML’dir. Örneğin,
etiketi, eklenen metnin bir paragraf olduğunu belirtir. Bu hem anlamsal hem de sunumsaldır çünkü insanlar paragrafların ne olduğunu bilir ve tarayıcılar bunları nasıl göstereceklerini bilir. Bu denklemin diğer tarafında, ve gibi etiketler anlamsal değildir. Yalnızca metnin nasıl görünmesi gerektiğini (kalın veya italik) tanımlarlar ve işaretlemeye herhangi bir ek anlam sağlamazlar. Anlamsal HTML etiketlerinin örnekleri şunları içerir:
-
ile
arasındaki üstbilgi etiketleri
Standartlarla uyumlu bir web sitesi oluştururken kullanabileceğiniz daha birçok anlamsal HTML etiketi vardır.
Anlambilimle Neden Önem Vermelisiniz?
Anlamsal HTML yazmanın yararı, herhangi bir web sayfasının itici amacı olması gereken şeyden kaynaklanır: iletişim kurma arzusu. Belgenize anlamsal etiketler ekleyerek, o belge hakkında iletişime yardımcı olan ek bilgiler sağlarsınız. Özellikle, anlamsal etiketler tarayıcıya bir sayfanın anlamının ve içeriğinin ne olduğunu açıklar. Bu netlik, arama motorları ile de iletilir ve doğru sorgular için doğru sayfaların teslim edilmesini sağlar. Anlamsal HTML etiketleri, bir sayfada nasıl göründüklerinin ötesine geçen bu etiketlerin içeriği hakkında bilgi sağlar. etiketi içine alınan metin, tarayıcı tarafından hemen bir tür kodlama dili olarak tanınır. Tarayıcı, bu kodu oluşturmaya çalışmak yerine, bu metni bir makale veya çevrimiçi eğitim amacıyla kodun bir örneği olarak kullandığınızı anlar. Anlamsal etiketleri kullanmak, içeriğinizi şekillendirmek için size çok daha fazla kanca sağlar. Belki bugün kod örneklerinizin varsayılan tarayıcı stilinde görüntülenmesini tercih edersiniz, ancak yarın onları gri bir arka plan rengiyle çağırmak isteyebilirsiniz; daha sonra, örnekleriniz için kullanmak üzere tek aralıklı kesin yazı tipi ailesini veya yazı tipi yığınını tanımlamak isteyebilirsiniz. Tüm bunları semantik işaretleme ve akıllıca uygulanmış CSS kullanarak kolayca yapabilirsiniz.
Anlamsal Etiketleri Doğru Kullanmak
Anlamsal etiketleri sunum amaçlı kullanmak yerine anlam ifade etmek için kullanırken, bunları yalnızca genel görüntü özellikleri için yanlış kullanmamaya dikkat edin. En yaygın olarak yanlış kullanılan semantik etiketlerden bazıları şunları içerir:
- blok alıntı - Bazı kişiler, alıntı olmayan metni girintilemek için
etiketini kullanır. Bunun nedeni, blok alıntıların varsayılan olarak girintili olmasıdır. Blok alıntı olmayan bir metni girintilemek istiyorsanız, bunun yerine CSS kenar boşluklarını kullanın.
- p - Bazı web editörleri, o sayfanın metni için gerçek paragrafları tanımlamak yerine, sayfa öğeleri arasına fazladan boşluk eklemek için
& nbsp;
(bir paragrafta bulunan bölünemez boşluk) kullanır. Önceki örnekte olduğu gibi, boşluk eklemek yerine kenar boşluğu veya dolgu stili özelliğini kullanmalısınız.
- ul -
ile olduğu gibi, bir
etiketi içine metin eklemek, çoğu tarayıcıda bu metni girintiler. Bu hem anlamsal olarak yanlış hem de geçersiz HTML'dir, çünkü bir
etiketi içinde yalnızca
- etiketleri geçerlidir. Yine, metni girintilemek için kenar boşluğunu veya dolgu stilini kullanın.
- h1, h2, h3, h4, h5 ve h6 - Yazı tiplerini daha büyük ve daha kalın yapmak için başlık etiketlerini kullanabilirsiniz, ancak metin bir başlık değilse, bunun yerine yazı tipi ağırlığı ve yazı tipi boyutu CSS özelliklerini kullanın.
Anlamı olan HTML etiketlerini kullanarak, her şeyi
etiketleriyle çevreleyen sayfalardan daha fazla bilgi veren sayfalar oluşturursunuz.
Hangi HTML Etiketleri Anlamsaldır?
Hemen hemen her HTML4 etiketinin ve tüm HTML5 etiketlerinin semantik anlamları olmasına rağmen, bazı etiketler öncelikle anlamsal. Örneğin, HTML5, ve etiketlerinin anlamını anlamsal olacak şekilde yeniden tanımlamıştır. etiketi fazladan bir önem taşımaz; bunun yerine, etiketli metin tipik olarak kalın gösterilir. Benzer şekilde, etiketi de fazladan bir önem veya vurgu ifade etmez; daha ziyade, tipik olarak italik olarak gösterilen metni tanımlar.
Anlamsal HTML Etiketleri
<abbr>
Kısaltma
<acronym>
Kısaltma
<blockquote>
Uzun teklif
<dfn>
Tanım
<address>
Belgenin yazar (lar) ı için adres
<cite>
Alıntı
<code>
Kod referansı
<tt>
Teletype metni
<div>
Mantıksal bölüm
<span>
Genel satır içi stil kapsayıcı
<del>
Metin silindi
<ins>
Eklenen metin
<em>
Vurgu
<strong>
Güçlü vurgu
<h1>
Birinci düzey başlık
<h2>
İkinci düzey başlık
<h3>
Üçüncü düzey başlık
<h4>
Dördüncü düzey başlık
<h5>
Beşinci düzey başlık
<h6>
Altıncı seviye başlık
<hr>
Tematik mola
<kbd>
Kullanıcı tarafından girilecek metin
<pre>
Önceden biçimlendirilmiş metin
<q>
Kısa satır içi teklif
<samp>
Örnek çıktı
<sub>
Alt simge
<sup>
Üst simge
<var>
Değişken veya kullanıcı tanımlı metin
Lifewire'dan daha fazlası
-
Biçimlendirme Dilleri Nelerdir?
-
Blok Alıntı Nedir?
-
HTML Öğesine Karşı HTML Etiketi Nedir?
-
HTML Etiketi Tanımı
-
İK Etiketi ile HTML'ye Satır Ekleme
-
HTML'de Metin Rengi Nasıl Değiştirilir
-
HTML nedir?
-
HTML Kullanarak Web Sayfalarına Görsel Ekleme
-
Görüntüleri ve Diğer HTML Nesnelerini Ortalamak için CSS Nasıl Kullanılır
-
Sekmeler ve Aralık Oluşturmak için HTML ve CSS Nasıl Kullanılır?
-
Bir Web Sayfasındaki Metnin Solunda Bir Görüntü Nasıl Kaydırılır
-
Gmail'in Yazı Tipi Ayarları Nasıl Değiştirilir
-
Word'de Asılı Girinti Nasıl Oluşturulur
-
HTML Vurgu Etiketleri
-
Google Dokümanlar Nasıl Asılı Girinti Yapılır
-
Google Slaytlarda Asılı Girinti Nasıl Yapılır?
Gizlilik Haklarınız
Lifewire ve üçüncü taraf ortaklarımız tanımlama bilgileri kullanır ve bir cihazda bilgi depolama ve / veya bu bilgilere erişme, kişiselleştirilmiş reklamlar görüntüleme ve içerik ölçümü, hedef kitle anlayışı ve ürün geliştirme izninize bağlı olarak benzersiz tanımlayıcılar gibi kişisel verileri işler. Meşru menfaatin kullanıldığı durumlarda itiraz etme hakkınız da dahil olmak üzere hayateli.com için onay seçeneklerinizi değiştirmek veya geri çekmek için aşağıya tıklayın. İstediğiniz zaman, herhangi bir sayfanın altındaki "AB Gizliliği" bağlantısını kullanarak ayarlarınızı güncelleyebilirsiniz. Bu seçimler, küresel olarak ortaklarımıza bildirilecek ve tarama verilerini etkilemeyecektir. İş Ortakları Listesi (satıcılar)
Biz ve ortaklarımız verileri şu amaçlarla işleriz:
Tanımlama için cihaz özelliklerini aktif olarak tarayın. Kesin coğrafi konum verilerini kullanın. Bir cihazda bilgi depolayın ve / veya bunlara erişin. Kişiselleştirilmiş içeriği seçin. Kişiselleştirilmiş bir içerik profili oluşturun. Reklam performansını ölçün. Temel reklamları seçin. Kişiselleştirilmiş bir reklam profili oluşturun. Kişiselleştirilmiş reklamları seçin. Kitle içgörüleri oluşturmak için pazar araştırması uygulayın. İçerik performansını ölçün. Ürünleri geliştirin ve iyileştirin. İş Ortakları Listesi (satıcılar)