DocType (Document Type - Belge Tipi) Nedir ?
DocType; sayfada kullanılan standartı browsera (tarayıcı) bildirmek için kullanılan bir yöntemdir.
Neden DocType Kullanılmalı ?
HTML`in ilk zamanlarında her tarayıcı sayfayı farklı yorumlamaktaydı. (
Eskisi kadar olmasa da hâlen durum değişmiş değil)
Bu sorundan dolayı standartlara uyum için
DocType yöntemi geliştirildi.
Artık tarayıcılar kullandığınız belge tipine göre sayfayı
standart kipde (standards mode) kurallara uygun şekilde farklı yorumlanmaktadır.
Hiçbir belge tipi kullanmadığında ise sayfa eski usul
garip kipde (Quirks mode) yorumlanmaktadır.
Tarayıcı tarafından garip kipde yorumlanan sayfalar her tarayıcının yorumuna göre farklı çıkmaktadır. Bu da tasarımcıların her tarayıcıda aynı görünen sayfalar hazırlamasını son derece zorlaştırmaktadır.
Tarayıcıların DocType Tepkileri ?
Standartlara uyum için geliştirilmiş olan DocType bile kesin bir çözüm getirememiştir. Her tarayıcının her sürümünün kullanılan belge tipine göre gösterdiği tepki farklı olabilmektedir.
Örneğin kullandığınız belge tipinde bir tarayıcı standart kipde çalışırken, diğeri kısmi standart kipde, bir diğeri de garip kipde çalışabilir. Bu konuya aşağıda belge tiplerini tanıtırken tekrar değineceğim.
DTD (Document Type Definition - Belge Türü Tanımı) Nedir ?
DTD; belgede kullanılan etiketlerin ve bu etiketlerin özelliklerinin doğru yazılması için hangi kurallara uyulması gerektiğini bildiren, SGML (
Standard Generalized Markup Language) dilinde hazırlanmış bir dosyadır.
XHTML Nedir ?
XHTML; E
Xtensible
Hypertext
Markup
Language kelimelerinden türetilmiştir.
HTML`nin yetersizliğinden dolayı, W3C (
World Wide Web Consortium) tarafından 2000 yılında kabul edilmiş bir dildir.
HTML 4.01 sürümü ile benzerlik gösteren, kesin kurallara bağlı, HTML`nin XML olarak düzenlenmiş halidir.
_____________________________________________
Örnek DocType: XHTML 1.0 Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Yukarıda bir örneğini gördüğünüz DocType kodu, genel olarak 2 kısımdan oluşmaktadır.
XHTML 1.0 Strict kısmında sırasıyla; kullanılan dil (html veya xhtml), dilin sürümü ve belge tanımlama tipi belirtilmektedir.
İkinci kısımda ise DTD (Document Type Definition) adresi gösteriliyor. (
URI)
3 adet belge tanımlama tipi bulunmaktadır; Bunlar Transitional (geçişken), Strict (kesin), Frameset (çerçeve)
Transitional tanımında sayfa kısmen standartlara uygun yorumlanır, bu sayede eski html etiketleri de kullanabilirsiniz.
Strict tanımında sayfa kesin kurallara uygun şekilde yorumlanır.
Frameset tanımı ise frame (çerçeve) kullanılan sayfalar içindir.
Kullanılabilir DocType`lar:
HTML 4.01 Strict<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional (Bu şekil DTD belirtmeyince tarayıcılar garip kipde çalışır)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
HTML 4.01 Transitional URI <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
XHTML 1.0 Strict<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
DocType bilgisi <html> etiketinden de önce, sayfanın en üstünde bulunmalıdır.
Sayfanızı hazırlamaya başlamadan önce yukarıdaki belge tiplerinden size uygun olanını seçip tasarımınızı ona göre yapmalısınız. Hazırladığınız sayfaya sonradan DocType eklemek veya değiştirmek tasarımınızı etkileyecektir.
Her tarayıcıda aynı görünen sayfalar hazırlamak için
strict (kesin) tanımlama tipi kullanmak, hatta xhtml kullanmak en doğru seçim olacaktır. Fakat hem strict hem de xhtml`in çok katı kuralları olduğundan dikkatli olmak gerekiyor.
HTML - XHTML Farklılıkları:
Öncelikle DocType bilgisi farklıdır.
Aslında tek farklılık xhtml`nin daha katı kuralları olmasındandır. Şöyle ki, normalde html`de kapatılmak zorunda olmayan img, br, input, meta, link, hr vesaire gibi etiketler xhtml`de kapatılmak zorundadır.
Fakat bunların kapatılması diğer etiketlerden farklıdır. Örneğin satır atlamak için kullanılan br etiketi html`de <br> şekildedir, xhtml`de ise <br /> şeklinde. (nasıl kapatıldığına dikkat edin)
Ayrıca xhtml`de, büyük küçük harf ayrımı vardır. name ve id isimleri atarken buna dikkat etmek gerekiyor. Tüm ekiket ve özelliklerinin de tamamen küçük harflerle yazılması gerekiyor.
HTML örnekleri:<img src="resim.gif" border="0" height="100" width="100" alt="resim">
<input type="text" name="giris" size="20" value="">
<br>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9">
<link href="sablons.css" rel="stylesheet" type="text/css">
XHTML karşılıkları:<img src="resim.gif" border="0" height="100" width="100" alt="resim" />
<input type="text" name="giris" size="20" value="" />
<br />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-9" />
<link href="sablons.css" rel="stylesheet" type="text/css" />
HTML (ve XHTML) diğer script dillerinde olduğu gibi, hata mesajı verip çalışmasını durduran bir dil olmadığından ve tarayıcılar (browser) hataları görmezden gelip farklı şekillerde sonuçlar çıkardığından, hatasız kod yazmak son derece zordur.
Bu nedenle hataları gösteren bir araca ihtiyacımız var. Herkesin bildiği gibi W3C`nin resmi sitesi olan
www.w3.org adresinde bunun için çevrimiçi bir hizmet var. Tam adresi:
http://validator.w3.org
Buraya sitenizin adresini girerek veya doğrudan kodları yapıştırarak kontrol ettirebilirsiniz, hataları ayrıntılı olarak yazmaktadır.
Her defasında buradan bakmak istemeyenler için farklı araçlar mevcut. Bu konuda biraz araştırma yapabilirsiniz. Ayrıca yakında kullanımını anlatacağım
şu Firefox eklentisini de deneyebilirsiniz.