SEO’yu artırmak için W3C Doğrulayıcı Nasıl Kullanılır
Bir web geliştiricisi olarak, kodunuzun temiz, geçerli ve erişilebilir olduğundan kesinlikle emin olmak istersiniz. Bu ayrıca arama motoru optimizasyonunu (SEO) artırmanıza yardımcı olabilir. Neyse ki, çalışmanızın standartları karşıladığından emin olmak için W3C validatörü kullanabilirsiniz. Bu yazıda, W3C ve farklı doğrulayıcılara daha yakından bakacağız. Daha sonra, bu araçla kodu nasıl doğrulayacağınızı ve sonuçları yorumlayacağınızı göstereceğiz. Son olarak, bazı yaygın W3C doğrulama hataları ve bunların nasıl düzeltileceğini göreceğiz. Başlayalım! W3C doğrulaması nedir? W3C, World Wide Web Konsorsiyumu anlamına gelir ve Web genelinde kodlama standartlarını denetleyen uluslararası bir organizasyondur. HTML ve CSS kodunuzun geçerli ve hatasız olduğunu doğrulamanıza yardımcı olacak doğrulayıcı hizmetleri sunar.
Doğrulayıcı CSS’ye Jigsaw denir ve içeriğinizi W3C Web Standartlarına göre kontrol eder.
HTML Kodunun Doğrulanması HTML Doğrulayıcı ile başlayalım. Kontrol etmek istediğiniz URI belgesini girebilir, kodunuzu içeren bir dosya yükleyebilir veya sağlanan alana doğrulamak istediğiniz işaretlemeyi girebilirsiniz: Sayfanızı veya belgeni işaretledikten sonra, doğrulayıcı bir liste hazırlar. HTML kodu ile ilgili tüm hatalar ve uyarılar: İdeal olarak, hatalar ve uyarılara sahip olmak istemezsiniz. Ancak, bu her zaman mümkün değildir, çünkü doğrulayıcı kullanıcının görebileceği her şeyi dikkate almaz. Örneğin, gradyanlı bir görüntünüz varsa, doğrulama cihazı, görüntü ve arka plan arasındaki kontrastın belirsiz olduğunu belirten bir hata getirecektir. Bununla birlikte, onu insan kontrollerinden açıkça ayırt edebilirsiniz. Sayfanızda JavaScript veya CSS içeriyorsa, HTML Doğrulayıcısının kontrol etmeyeceğini unutmayın. Bunun için, CSS için (yakında tartışacağız) Jigsaw W3C araçlarını veya JavaScript için JShint kullanmanız gerekir. CSS Doğrulama Doğrulama CSS aynı şekilde çalışır. URI, belge veya doğrulama için işaretleme gönderdikten sonra, hatalar ve uyarılar içeren bir sayfa alacaksınız:
Gördüğünüz gibi, CSS ve HTML sonuçları oldukça ayrıntılı. Nasıl yorumlanacağını keşfedelim. Doğrulayıcı sonuçlarının nasıl yorumlanması Gördüğümüz gibi, doğrulayıcı iki farklı çıkış üretir: hatalar ve uyarılar. Şiddetli sorunları vurgulamadığınız için genellikle uyarıları göz ardı edebilirsiniz. Ancak, bu hatasız içerik yayınlamak için iyi bir uygulamadır. Hem hatalar hem de uyarılar, sorununuzla bir satır numarası gösterir. Ayrıca sorunun nasıl çözüleceğine dair tavsiyelerde bulunurlar: Hatalar veya uyarılarla verilen bağlantıya tıklarsanız (örneğin, satır 1, sütun 16; satır 2, sütun 16), doğrulayıcının uygun satırı vurgulayacaktır. Kod:
HTML doğrulayıcısı tarafından bulunan hatanın, çevrimiçi içeriğe erişmek için sakatlık yardımlarına (ekran okuyucuları gibi) güvenen kullanıcıları etkileyeceğini unutmayın. Bu erişilebilirlik sorunu bir kod üreticisi olarak kolayca göz ardı edilebilir. Ancak, kitleniz üzerinde kötü bir etkisi olabilir. Bir sonraki bölümdeki bu yaygın hataya daha yakından bakacağız.
W3C Doğrulama Hataları Genel Doğrulayıcı CSS ve HTML, kodunuzdaki hataları vurgulayacaktır. En yaygın sorunlardan bazıları şunlardır: Eleman kapalı değil. Sayfaya yeni öğeler eklemek, açık ve kapalı etiketler gerektirir. Bu hatayı aldığınızda, bir etiket eklemediniz. Bu, ızgara ile çalışırken oldukça yaygın bir sorundur.Yok etiketler. Her görüntü, grafik yüklenemezse görüntülenecek alt etiketi gerektirir. Bu resmi açıklar ve ekran okuyucusu okuyacaktır. Alt etiketleri eklemek önemli bir erişilebilirlik gereksinimidir.
Yanlış başlık etiketini kullanın. Bu CSS sorunu, geliştirici etiketini belirli bir subpos için bir yazı tipi kuvveti olarak kullandığında ortaya çıkar. Etiket, kuvvetin amacından ziyade navigasyon için tasarlanmıştır, bu nedenle navigasyon olmayan altyazılar yazı tipi özellikleri kullanılarak boyutlandırılmalıdır: boyut =#.
Bazı ayrışma hataları da görebilirsiniz. Bu, koddaki bir hata gösterir, ancak doğrulayıcı her zaman sorunun nerede olduğunu göstermez. Sorunu bulmak için işinizi gözden geçirmelisiniz. İşte bir tutku hatasına bir örnek:
Bu hata, CSS stil sayfası HTML öğeleri içerdiğinde oluşur. CSS doğrulayıcısı hatalar için bir satır numarası sağlamasa da, verilen kod bloğunu kopyalayıp kod düzenleyicinizde veya fikrinizde aramanız yeterlidir. Fortune’da ortak bir hata nasıl düzeltilir, Doğrulayıcı W3C size nerede hata bulduğunuzu ve nasıl düzeltileceğinizi söyler. Örneğin, eksik bir ALT etiketiniz varsa, doğrulayıcı size nereye girmeniz gerektiğini söyleyecektir. Açık bir etiketiniz varsa, doğrulayıcı kapanış etiketinin nerede olduğunu söylemez. Ancak, bu size açık bir etiket konumu verecektir, böylece kod bloğuna gidersiniz ve eksik etiketi eklersiniz.
Ardından, giriş seçeneğini doğrudan doğrulayıcıya kullanırsanız, tam kod vurgulanan bir hata ile görüntülenir. Bu nedenle, hataları daha hızlı bulmak ve düzeltmek için fikrinizdeki orijinal kodla karşılaştırabilirsiniz. Sonuç W3C Doğrulayıcı kullanımı sitenizin genel performansını artırabilir. Bu, şişmiş kodlardan kaçınmanızı, erişilebilirlik sorunlarını çözmenizi ve yaygın hataları düzeltmenizi sağlar. Tüm bu öğeler daha hızlı yükleme süresi ve daha iyi UX üretebilir, bu da sitenizin SEO’sunu geliştirebilir.