XHTML Giriş - Intro
Bilinmesi gereken ilk şey kodların küçük harfle yazılması gerektiğidir. Bunu hatırlattığımıza göre artık eğitime başlayabiliriz. Minik bir not: XHTML , " -iks -eyç -ti -em -el " olarak okunur.
XHTML etiketleri (tag'ları) açılırken " < " ile " > " işaretleri arasına yazılır, Örneğin, " <html> " , bu bir " html " açılış etiketidir (tag'ıdır). XHTML etiketleri (tag'ları) kapanırken ise " </ " ile " > " işaretleri arasına yazılır, Örneğin, " </html> " , bu bir " html " kapanış etiketidir (tag'ıdır). Unutulmamalıdır ki açılan her etiket (tag) kapanmalıdır. Etiket kapatmayı unutmamak için etiket açtığınız anda etiketi kapatmanızı öneririm.
İlk örneğimizi görelim...
Yukarıda bulunan etiketler, XHTML yazmak için olmazsa olmazlardandır, bu etiketler mutlaka olmalıdır. Kodun daha rahat okunması için kod aralarında 1 satır boşluk bırakıyoruz ve iç içe yazılan etiketleri de klavyede bulunan "Tab" tuşu ile ayırıyoruz.
Bu kodu tarayıcıda görmek için tıklayınız.
- "<DOCTYPE>" etiketi ne işe yarar: Bu etiketi daha sonra ele alacağız ama şimdi bilgi almak isterseniz buradan bilgi alabilirsiniz.(Kafanızın karışmaması açısından daha sonra bakmanızı öneririm.)
- "<html>" etiketi ne işe yarar: Bu etiket tarayıcıya / browser'a (Internet Explorer , Firefox , Opera vb. ) bu kodun hangi dil ile yazıldığını bildirir.
- "<head>" etiketi ne işe yarar: Bu etiketi de daha sonra ele alacağız ama şimdi bilgi almak isterseniz buradan bilgi alabilirsiniz.(Kafanızın karışmaması açısından daha sonra bakmanızı öneririm.)
- "<title>" etiketi ne işe yarar: Bu etiket içine yazılan her metin tarayıcının en üstünde ( durum çubuğunda ) bilgi olarak yer alır. Bir nevi sayfanın adı diyebiliriz.
- "<body>" etiketi ne işe yarar: Sayfa içerisinde görünmesini istediğimiz herşeyi / her kodu burada belirteceğiz.
- "<p>" etiketi ne işe yarar: Sayfa içerisine paragraf eklemimizi sağlar, içine yazılan yazılar paragraf stilinde gözükür.
Yukarıda ki kodu kopyalayıp (Kod'un üst tarafında bulunan "view plain" i tıklayarak kodu kopyalabilirsiniz.) masaüstünüzde sağ tıklayarak "Yeni" deyip yeni bir " Not Defteri " dosyası oluşturalım ve oluşturduğumuz dosyanın adını " deneme.html " şeklinde değiştirip kaydedelim. Daha sonra kaydettiğimiz dosyayı sağ tıklayarak "Birlikte Aç > Not Defteri " diyelim. Siteden kopyaladığımız kodu buraya yapıştırıp "Dosya > Kaydet" diyelim. Şimdi HTML dosyamız oluştu ve kullanıma hazır. Masaüstünde oluşturduğumuz dosyayı çift tıklayalım ve kodun sayfada nasıl gözüktüğünü inceleyelim. "title" ve "p" etiketi içinde ki metinleri değiştirerek denemeler yapabilirsiniz.
XHTML İpucu - XHTML kodu neyle yazılır?
XHTML kodu, her bilgisayarda kurulu olan metin editörleri ile birlikte ( Örneğin, Not Defteri , Vim , TextMate vs ) yazılabilir. Eğer işletim sistemi olarak Windows' u kullanıyorsanız " Notepad++ " adlı editörü kullanmanızı öneririm. Bu program bir çok yazılım dilini desteklemektedir, ayrıca Türkçe versiyonuda bulunuyor. Programı buradan ücretsiz olarak indirebilirsiniz.
XHTML İpucu - Tarayıcıda Türkçe karakterler görünmüyor!
Eğer tarayıcıda Türkçe karakterleriniz görünmüyorsa yazdığınız kodun dilini " UTF-8 without BOM " a çevirmeniz gerekmektedir. Eğer hala sorun devam ediyorsa tarayıcınızın dilini " Unicode ( UTF-8 ) " yapmanız gerekmektedir. NotePad++'ta kodumuz açıkken yukarıdan " Biçim " i tıklayarak, " Kodla (UTF-8 without BOM)" u tıklayıp ardından dosyayı kaydederek sayfamıza karakter desteği ekleyebiliriz.