W3 hataları ve çözümleri
Daha önceki konularımda da belirttiğim üzere düzgün ve hatasız bir kodlamanın arama motorlarındaki sıralamada önemi vardır. Ne kadar temiz kod yazarsanız Google gibi arama motorları da sitenizi o kadar rahat okuyacaktır. Burada kendi başıma gelen hatalardan bahsedeceğim, bende sizin gibi çözümü siteleri araştırarak bulmuştum ve burada elimden geldiği kadar yardımcı olmaya çalışacağım. Dökümanın en başından başlayarak kademe kademe çıkabilecek hataları incelemeye başlayalım.
DOCTYPE kullanımı
Sitenizin hangi kodlamaya uygun yazıldığınızı belirmeniz lazım ki hem içeriğini yazarken kullandığınız program hatalarınızı düzeltebilsin hemde yayınladığınızda ortaya çıkabilecek hataları test ederek düzeltebilin. Kodlama kısmını bir kenara bırakırsak Doctype kullanmamak farklı tarayıcıların sitenizi farklı şekilllerde göstermesine sebep olabilir. Şu anda gördüğüm kadarıyla en sık kullanılan döküman tipi XHTML 1.0 Transitional, bende bu yüzden bu türü kullanıyorum ve yazının kalanında buna yönelik hataları inceleyeceğiz.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
HTML elemanlarının kapatılması
html elemanlarını kapatırken /> atılması gerekmektedir, script, div, style gibi bazı elemanlar bunun haricindedir. w3 sitesinin vereceği hata şu şekilde olacaktır: Line 4, Column 73: end tag for “meta” omitted, but OMITTAG NO was specified
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-9″ />
<link rel=”stylesheet” href=”style.css” />
<img src=”logo.png” alt=”Logo” width=”416″ height=”240″ />
<br />
Style ve JavaScript kodlarında Type kullanımı
Stillerde ve JS’ lerde type kısmını mutlaka doldurmalısınız
<style type=”text/css”>body { font-size: 12px; background: #000;}</style>
<script type=”text/javascript”>$(document).ready(function() ….</script>
Tagları kapatmak
Kullandığınız ve kapatılması gereken tagları kapattığınızdan veya fazladan tag kullanmadığınızdan emin olun.
<table><tr><td>Test</td>
</tr></table><div><table><tr><td>Test</td></tr></table></div></div>
Kodları yazarken içine verileri girmeden önce sistemin doğru olduğunu kontrol etmek en güzel çözümdür, böylece geri dönüp aradaki satırları gizleyerek bakmak zorunda kalmazsınız.
& işaretinin kullanımı
& (Ampersand) yani “ve” işareti de W3 hatalarının arasında yer almaktadır, bu işaretin olduğu yerlere “& ” koymanız gerekmekte.
<a href=”mail.asp?page=mesaj&degis=gel”>Mesajlarım</a>
Resimlerde ALT kullanımı
Resimlerinizde mutlaka alt özelliğini kullanınız, bu hem kodlamadaki hatayı düzeltmenize hemde arama motorlarına resmin ne olduğunu anlatmanıza yardımcı olacaktır.
<img src=”test.gif” width=”20″ height=”20″ alt=”Test butonudur” />
Form ile DIV’ in karışmasını engellemek
<form method=”post” name=”deneme” action=”default.asp”><div>form öğeleri</div></form
Bu şekilde kullanırsanız hata alırsınız, bu yüzden aşağıdaki örnekte olduğu gibi formun içinde div olmaması gerekmektedir.
<div><form method=”post” name=”deneme” action=”default.asp”>form öğeleri</form</div>
Target ve XTML Strict’ te kullanımı
XHTML 1.0 Transitional’ da kabul etse de Strict’ te target komutunu kabul etmeyecektir, onun yerine yeni bir öğe olan external komutunu kullanmanız gerekir.
<a href=”http://www.test.com” target=”_blank”>Test Bağlantısı</a>
üstteki örnekte kullanım yerine alttaki gibi kullanmanız gerekiyor.
<a href=”http://www.test.com” rel=”external”>Test Bağlantısı</a>
Çok güzel bir yazı olmuş, eline sağlık..
gerçekten çok faydası dokundu çok teşekkür ederim.