1.Üstbilgi ve Altbilgi
Div'lerin anlamsal bir yapısı yoktur. Üstbilgi veya altbilgi yapıları oluşturmak için div'leri kullanmak yerine "üstbilgi" ve "altbilgi" öğelerini kullanın.
bunu yapma
<div id="header"> ... </div> <div id="footer"> ... </div>Bunu yapabilirsiniz
<header> </header> <footer> </footer>2. Şekil Öğesini Kullanın
Resminize bir başlık eklemeniz gerekiyorsa, "figcaption" öğesiyle birlikte "figure" öğesini kullanın.
bunu yapma
<img src="image url" alt="image description" /> <p> Lorem Ipsum Description </p>Bunu yap
<figure> <img src="image url" alt="image description" /> <figcaption> <p> Lorem Ipsum Description </p> </figcaption> </figure>3. Kalın veya italik etiketler kullanmayın
"b" ve "i" etiketleri sunum etiketleridir ve anlamsal bir anlamı yoktur, bunun yerine CSS'deki yazı tipi ağırlığını/yazı tipi stilini değiştirin veya "strong" veya "em" öğesini kullanın.
bunu yapmayın
<b>Bold</b> <i>Italics</i>Bunu yap
<strong>Bold</strong> <em>Italics</em>4. Açıklayıcı bağlantılar kullanma
Bir bağlantının metni açık olmalı ve kullanıcıyı nereye yönlendirdiğini iletmelidir, hem kullanıcılar hem de arama motorları içeriğinizi ve diğer sayfalarla nasıl ilişkili olduğunu daha kolay anlayabilir.
bunu yapma
<a href="url"> Check our pricing... </a>Bunu yap
Check our <a href="url"> pricing </a>5. Satır içi stilleri kullanma
Satır içi stiller yazmak, yapının (HTML) sunumdan (CSS) ayrı olması ilkesini ihlal eder. Bunun yerine stilleri bir stil sayfasına yazın.
bunu yapma
<h1 style="font-size: 24"> Header </h1>Bunu yap
h1 { font-size: 24 }