Turkekip
Turkekip
Php mysql konusunda öğretici makale ve dersleri bulunan bir site bunu yanında güncel programlar ve photoshop vb. programlarında görsel anlatım videolarını bula bilrsinzi….
|
|
|
|
|
|
Turkekip
Php mysql konusunda öğretici makale ve dersleri bulunan bir site bunu yanında güncel programlar ve photoshop vb. programlarında görsel anlatım videolarını bula bilrsinzi….
|
|
|
|
|
|
hakkımda
adım Ertuğrul. Şanlıurfa doğumluyum.
2004′de Harran Üniversitesi İklimlendirme ve Soğutma bölümünde okumaya başladım, 2006′nın başlarında mezun olmadan okuldan ayrıldım. şuan ise silbaştan, yurtdışında istediğim bir bölümü, istediğim gibi okuma planlarım var.
web tasarımın dışında, pazarlama, iletişim ve e-ticaret konularında kendimi geliştirmeye çalışıyorum. bir amatör edası ile mizah ve postmodern edebiyat temalı denemeler yazıyorum. müziksiz nefes alamayanlardanım.
yaklaşık 8 yıldır internet ile içiçe yaşıyorum. web tasarıma ve bilimum internet teknolojilerine müthiş bir tutku ile bağlıyım. hâlâ ilk günkü hevesimi ve heyecanımı koruyorum, çünkü sürekli bir öğrenme aşamasındayım. aslında sadece ben değil, web tasarım ile uğraşan herkes sürekli bir değişimin içinde olmalı, aksi durumda yok olup giderler. internet teknolojisi çok hızlı değişiyor. internet değiştikçe bizde değişmeye mecburuz. çünkü internet biz, biz ise internetiz.
tasarım, bana göre, mevcut bir olguyu baz alarak, ihtiyaçlarınız ile belirlediğiniz kriterler çerçevesinde, karakteristik özellikleri olan bir ürün yaratma işidir. ve tüm bu süreç esnasında estetiğe verilen değer ise ürünün kalitesini ortaya koyar. bu da ancak, kişinin yaptığı işe olan inancı ile alakalıdır. çünkü kişi, tasarım sürecinde, asla ürünün beğenilmemesi gibi kaygı gütmemelidir. bir başka deyişle, kişi tasarımı önce kendisi için yapmalıdır. hâl böyle olunca, yer yer tasarımın amacı da değişebilmektedir. bazen bir başkaldırıdır tasarım. bazen rahatsız edici varlıkları değiştirmeye kalkmaktır, bazen aşk, bazen sadece ego tatmini, bazen ise dünyadan razı olmamaktır.
ben bu işi seviyorum.
Mavi ejder a.k.a Sesiz türk

1990 yılında Sakarya/Alifuatpaşada dünyaya geldim, çocukluğum ufak bir kasabada geçti, okula başlamadan önce okuma yazmayı öğrendim küçük yaşta elektronik merakım dikkat çekmeye başladı, ilk okul 1. sınıf bittikten sonra Sakarya/Geyve bölgesinde yaşamaya başladım, ilk okul 4. sınıfta bilgisayar ile tanıştım, ancak bilgisayara lisede sahip oldum, orta okul döneminde programlama ile tanıştım ve geliştirmeye başladım, fark ettim ki yeteneğim elektronik/teknoloji/bilim üzerine, programlamayı ilerletmeye başladım ozamanlar bilgisayarım yoktu, internet cafede harçlıklarım ile programlama öğreniyor, araştırıyordum, Lise dönemi geldi, yeteneğime uygun olarak meslek lisesini tercih ettim, lise döneminde bilgisayar sektörü çok hızlı ilerlemeye başladı, bu arada da bilgisayar sahibi oldum ve proje geliştirmeye başladım, güvenlik üzerine çalışmalar yapıyordum, bu sayede kıvrak zekamda gelişti, programlama ile birleşti, daha sonra gerçek hayata uyarladım, bu sayede herşeyı daha kolay kavrıyor, çok dikkatli oluyor, pek fazla ayrıntı kaçırmıyordum.
Ayrıca kişilik özelliklerimden bahsecedek olursak, lise döneminde geçirdigim gençlik probLemlerinden dolayı içine kapanık oldum, kimse ile konusmuyor, somurtkan, huysuz, sıcak kanlı, dostlarıma çok değer veririm, çok fazla arkadaş edinmem, ancak çok çevrem olur, yalan söylemeyi sevmem, dürüstlüğün getirilerini keşfettim, ön yargılı olmaktan kaçarım, yardım severim, iletişimim son derece gelişmiş, aklımdaki düşünceyi çok iyi şekilde karşımdakine iletirim, ikna kabiliyetim çok yüksek, insanları eğitmeyi severim
Ayrıca hobilerim Rock, RAP, Pop, Metal vb.. kısaca her türlü müziği dinLerim. arabesk hariç oda sevmediğimden değil, hep karamsar müzik oldugundan tercih olduğundan. E-Kitap, Biyografi, Yaşanmış öyküler okumayı severim. Ayrıca dostlarımın tüm problemleri ile ilgilenmeyi onların problemleri ile ilgilenmeyi severim.
Ayrıca yalnız kalmayı, tek başıma müzik dinlemeyi, tek başıma program yazmayı ve karanlığı severim. Türk olduğum için kesinLikle kendimden gurur duyarım, müslüman doğduğum içinde Allaha bin şükür ..
Üzerinde çalıştığım diller : Asp, Php, Css, Ajax, Html, XML, WML, JavaScript, Visual Basic, Visual Basic.NET, Delphi, QBasic, Assembly.
Üzerinde çalıştığım Veritabanları : Mysql, MDB
Üzerinde çalıştığım windows sistemler/ sunucular : Windows 95, 98, ME, NT, 2000, 2003 Server
Üzerinde çalıştığım linux sistemler/sunucular : Pardus, RedHat, CentOS
Üzerinde çalıştığım ofis uygulamaları : Tüm Microsoft yazılımları, / Tüm OpenOffice yazılımları.
Üzerinde çalıştığım grafik uygulamaları : Photo Shop 7, 8, CS2, CS3
Üzerinde çalıştığım Half-Life modulleri : Counter-Strike 1.5, 1.6, Standart Half-Life, Tüm Mod, Tüm Eklentiler kurulumları ve teknik desteği.
ismail yk bas gaza yeni albüm - yeni albümü
İsmail- YK’ nin yeni albümünün ilk klibi tamamlandı -İSMAİL-YK, pazar günü Popstar Alaturka´da ve pazartesi günü ise Esra Ceyhan´nın programında “Bas Gaza” adlı yeni albümünün şarkılarını siz sevenleriyle paylaşacak..


Resim defteri uygulamasını, mouse’un hareket ettiği her yeri Shape sınıfının graphics özelliğini kullanıp boyayarak elde edeceğiz. Sahne üzerinde istediğiniz herhangi bir bölgeyi çizim yapılabilecek bir hale getirebilirsiniz.
cizimAlani.graphics.lineStyle(5, renkPaleti.selectedColor);
cizimAlani.graphics.moveTo(cizimAlani.mouseX, cizimAlani.mouseY);
cizimAlani.graphics.lineTo(fareX,fareY);
Örnek uygulamayı indirmek için tıklayın.
Evet Xhtml Derslerimize kaldığımız yerden devam ediyoruz. Bu bölümde biraz daha detay ve açıklama ile Geçerli Xhtml yazımına dair bilgiler edineceğiz. Hemen başlayalım isterseniz.
BÖLÜM 4
XHTML ve Syntax (Sözdizimi, Sentaks)
Her dilde olduğu gibi Xhtml dilinde de bu dile has olan bir yazım stili vardır. Aşağıya bunları madde olarak yazmaya çalışalım.
- etiket ve parametreler küçük harfle yazılmalı
- parametre değerleri kesinlikle alıntılanmalı yani tırnak işareti içinde yazılmalı
- parametre değerlerinde kısaltılma yapılmamalı
- name parametresi yerine “id” parametresi kullanılmalı
- Xhtml dokümanlara zorunlu olarak DTD (Doküman Tipi) tanımlanmalı Etiket ve Parametreler küçük harfle yazılmalı!
Daha önceki konularımızda gördüğünüz gibi Xhtml üzerinde etiket ve parametre isimleri sürekli küçük harflerle yazılmalıdır. Bunun dışında kalan bir yazım uygulaması Xhtml’ye aykırıdır. Yine örneklem yoluyla devam edelim:
HTML Format: <table WIDTH=”100%”>
XHTML Format: <table width=”100%”>
Parametre değerleri kesinlikle alıntılanmalı yani tırnak işareti içinde yazılmalı!
Xhtml üzerinde yukarıdaki maddelerde belirttiğimiz gibi parametrelerin karşılığı olan değerler kesinlikle tırnak işaretleri içine yazılmalıdır.
HTML Format: <table width=100%>
XHTML Format: <table width=”100%”>
Parametre kısaltılma yapılamaz!
Html dokümanlar üzerinde bazı zamanlar (örneğin formlar) üzerinde tanımlanan bazı seçili değerler vardır. input etiketinde checkbox değeri kullanırken seçili öğeyi “checked” yazarak seçeriz. Xhtml de bu tarz bir yazım veya kısaltma yapılamaz. Bununla birlikte değerler tam ve doğru bir şekilde yazılıp tanımlanmalıdır. Örneklerimizi incelerseniz konuyu daha iyi kavrayabileceksiniz.
HTML Format: <frame noresize>, <input checked>
XHTML Format: <frame noresize=”noresize” />, <input checked=”checked” />
(yine boş etiketlerin yani kapatılması Html üzerinde gerekli olmayan etiketlerin Xhtml’de nasıl kapatıldığını görüyorsunuz, lütfen bu ayrıntıyı atlamayınız)
Aşağıdaki tabloda Html üzerinde tanımlanmayan ve kısa parametre değeri olarak yazılan bazı değerlerin Xhtml’deki yazım biçimini göreceksiniz. Lütfen tabloyu inceleyin.
|
HTML |
XHTML |
|
compact |
compact=”compact” |
|
checked |
checked=”checked” |
|
declare |
declare=”declare” |
|
readonly |
readonly=”readonly” |
|
disabled |
disabled=”disabled” |
|
selected |
selected=”selected” |
|
defer |
defer=”defer” |
|
ismap |
ismap=”ismap” |
|
nohref |
nohref=”nohref” |
|
noshade |
noshade=”noshade” |
|
nowrap |
nowrap=”nowrap” |
|
multiple |
multiple=”multiple” |
|
noresize |
noresize=”noresize” |
“name” parametresi yerine “id” parametresi kullanılmalı!
Html üzerinde a, applet, frame, iframe, img, map gibi etiketlerin tanımı olarak kullanılan “name” parametresi Xhtml üzerinde geçerliliğini yitirmiştir. “name” yerine “id” parametresi kullanılmalıdır.
HTML Format: <map name=”map_1” />
XHTML Format: <map id=”map_1″ />
(Not: bazı eski browserlar üzerinde id parametresi çalışmayabilir, bu gibi durumlarda hem name hem de id parametresini aynı etiket üzerinde tanımlayabilirsiniz. )
Xhtml dokümanlara zorunlu olarak DTD (Doküman Tipi) tanımlanmalı!
Xhtml dili ile kodlanan sayfalarda mutlaka DTD yani Doküman tipi tanımlanmalıdır. Doküman tipi tanımlama kodu kodlama itibariyle sayfanın en üstüne yapılır ve yapısal XML dosyalarının çağırılması ile geçerli olur. Doküman tanımlarına yazımızın ilerleyen bölümlerinde değineceğiz.
Dil Özelliği!
Xhtml üzerinde hemen hemen her sayfanın dil tanımlaması yapılmaktadır. Dil tanımlamasını aşağıdaki XML atıf kodu ile yapabilirsiniz.
<div lang=”tr” xml:lang=”tr”>Merhaba Dünya, Merhaba Xhtml!</div>
BÖLÜM 5
XHTML DTD (Doküman Tipi Tanımı)
Xhtml belgeler içinde doküman tipi tanımlamanın zorunlu olduğunu daha önceki bölümlerde dile getirmiştik. Bu bölümde ise kısaca Xhtml üzerinde kullanılan doküman tip tanımlarına değineceğiz.
Xhtml üzerinde doküman tipi tanımları sürekli olarak kodlamanın birinci satırında yer alır. Bu satırda yer alan doküman tipi tanımı ile sayfanın geri kalan kodları o tipe göre icra edilir. Bununla birlikte bir Xhtml dokümanı 3 öğeden oluşmaktadır. DOCTYPE, Body ve Head. Yaptığımız bu açıklamaya göre bir basit Xhtml kabuğu sunalım.
<!DOCTYPE …>
<html>
<head>
<title>… </title>
</head>
<body> … </body>
</html>
Yukarıda görmüş olduğunuz örnek Xhtml için geçerli bir doküman tipi tanımı ile başlamış, kodlar küçük harfle yazılmış, icra edilen kodlar sırasıyla kapatılmıştır. Bu tarz bir yazım Xhtml yazımına uygun ve geçerli bir yazım şeklidir.
DTD 3 Ana Türden Oluşur!
Xhtml üzerinde 3 tür doküman tanımlama tipi vardır. Bunlar STRICT, TRANSITIONAL ve FRAMESET olarak adlandırılmaktadır. Şimdi bu doküman tiplerinin nasıl kullanılacağından ziyade neler olduğuna bir göz atalım.
Strict, doküman tipi Türkçe’ye “Tam” manasında çevrilebilir. Bu doküman tipinin tanımlandığı dosyalarda hem Xhtml hem de Css bileşenleri rahatlıkla kullanılabilir.
Transitional, doküman tipi ise “Geçişli” olarak dilimize çevrilebilir. Bu tip dokümanlar Html etiketlerini tam kullanabilmek için tanımlanabilirler, modern tarayıcılar bu tarz doküman tipi tanımlanmış olan sayfalarda Css eklentilerini ve kodlarını icra etmezler. Adından da anlaşılacağı gibi bu tip Html geçiş tipidir.
Frameset, tip ise sayfalarında “Çerçeve” kullanan tasarımcılar için oluşturulmuştur. Bu doküman tipi iki yada daha fazla frame yani çerçeveye sahip sayfalar için kullanılabilir.
DTD Tanımlarını Kullanalım!
DTD kullanımının sitemizin birinci kod satırında yer aldığını söylemiştik. Şimdi aşağıdaki kodları inceleyerek her bölüm için tanımlanan doküman tipinin sitelerimizde nasıl uygulanacağını görebilirsiniz.
STRICT
<!DOCTYPE html
PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
TRANSITIONAL
<!DOCTYPE html
PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
FRAMESET
<!DOCTYPE html
PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
BÖLÜM 6
XHTML’de Parametre ve Olaylar
Xhtml dili üzerinde tasarımcıların kullanabilmesi ve işlerini kolaylaştırabilmesi için özel parametreler ve olaylar tanımlanmıştır. Herhangi bir etikete özel parametreler yardımı ile bir sınıf veya id tanımlayarak çok daha iyi bir kodlama ve tasarım yapılabilir. Bu parametreler bir etiketin değerlerini ve niteliklerini düzenlemek ve tanımlamak için de kullanılırlar. Aşağıdaki listede bu tür parametrelerin neler olduğu, değerleri ve geçerli olduğu temel etiketler verilmiştir.
Temel Parametreler
Bu parametreler head, html, meta, param, script, style, ve title etiketlerinde geçerli değildir.
|
Parametre |
Değer |
Tanım |
|
class |
Sınıf durumu |
Etiketin ait olduğu sınıfı belirtir |
|
id |
id ismi |
element için tanımlanan unique id |
|
style |
stil tanımı |
dahili stil tanımları için kullanılır |
|
title |
ipucu textler |
elementlerin ipucu yazıları için kullanılır |
Dil Parametreleri
Bu parametreler base, br, frame, frameset, hr, iframe, param, ve script etiketlerinde geçerli değildir.
|
Parametre |
Değer |
Tanım |
|
dir |
ltr | rtl |
metin yönünü ayarlar |
|
lang |
dil kodu |
dil kodunu ayarlar |
Klavye Parametreleri
|
Parametre |
Değer |
Tanım |
|
accesskey |
karakter |
elementin klavye kısayolunu ayarlar |
|
tabindex |
numara |
elementin tab sekme sayısını ayarlar |
Olaylar
Xhtml üzerinde tıpkı html sayfalarda kullandığımız gibi bazı olay süreçleri (event action) kullanırız. Örneğin Mouse ile tıklama, mouse ile elementin üzerine gelme, klavyede bir tuşa basma gibi. Bu tarz olaylar temelde Javascript ve Dhtml fonksiyonları ile sağlanmaktadır. Bizler sadece bu işi yapan fonksiyonu Xhtml belgemizde kullanarak çalışmasını sağlarız. Aşağıda yer alan listede bu tarz olayların neler olduğu, kullanım şekilleri ve verilen değerleri görebilirsiniz.
Pencere Olayları
Sadece body ve frameset etiketleri içinde geçerlidir.
|
Parametre |
Değer |
Tanım |
|
onload |
script |
Doküman yüklendiğinde çalışacak |
|
onunload |
script |
Doküman yüklenmediğinde çalışacak |
Form Element Olayları
Sadece form elemanları içinde geçerli olan olaylardır.
|
Parametre |
Değer |
Tanım |
|
onchange |
script |
Elementlerin değişimi sırasında çalışacak |
|
onsubmit |
script |
Form gönderimi sırasında çalışacak |
|
onreset |
script |
Form temizlenmesi sırasında çalışacak |
|
onselect |
script |
Element seçimlerinde çalışacak |
|
onblur |
script |
Form aktivasyonunda çalışacak |
|
onfocus |
script |
Formlarda yer alan focus özelliğinde çalışacak |
Klavye Olayları
Bu parametreler base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, ve title etiketlerinde geçerli değildir.
|
Parametre |
Değer |
Tanım |
|
onkeydown |
script |
Karakter değerine tıklandığında çalışacak |
|
onkeypress |
script |
Klavye tuşuna basıldığında çalışacak |
|
onkeyup |
script |
What to do when key is released |
Fare Olayları
Bu parametreler base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, ve title etiketlerinde geçerli değildir.
|
Parametre |
Değer |
Tanım |
|
onclick |
script |
Mouse tıklamasında çalışacak |
|
ondblclick |
script |
Mouse çift tıklamasında çalışacak |
|
onmousedown |
script |
Mouse aktive tıklamasında çalışacak |
|
onmousemove |
script |
Mouse hareketinde çalışacak |
|
onmouseover |
Script |
Mouse ile element üzerine gelindiğinde çalışacak |
|
onmouseout |
script |
Mouse ile element üzerinden uzaklaşılınca çalışacak |
|
onmouseup |
script |
Mouse aktivesi yenilendiğinde çalışacak |
BÖLÜM 7
Xhtml’ye Hazırsınız!
Artık sayfalarınızda Xhtml kodlar kullanabilmek için neredeyse hazırsınız. Yukarıda anlattığımız konuları ve bölümleri biraz özetleyelim ve neler olduğuna bakalım.
Öncelikle Xhtml üzerinde nelerin geçerli olduğun ve nelerin (hangi tür yazım şeklinin ve kod, parametre kullanımının) geçerli olmadığını öğrendik. Xhtml belgelerimizde küçük harflerle kodlarımızı yazacak ve etiketlerimizi açtığımız sıraya göre kapatacaktık.
Bununla birlikte Html üzerinde kapatılmayan etiketlerin (<br>, <img>, <hr> gibi) de kapatılması gerektiğini öğrendik. Çünkü artık biliyoruz ki “Xhtml üzerinde her etiket sonlandırılmalıdır!” Bu sonlandırmayı da Xhtml’ye uygun biçim olan <br />, <img />, <hr /> şeklinde yaptık.
Xhtml dokümanlarımızın başında DTD tanımlayarak hangi biçim tarafından değerlendirileceğini ayarladık. Tam, Geçişli ve Çerçeveli doküman tipi tanımları ile sayfamıza uygun olan tipi seçtik.
Daha sonra kodlamamızı Xhtml’ye uygun biçimde “Tam ve Standart” kod yazımı ile devam ettirdik. Yine Xhtml’de tanımlanan olay ve parametreler ile sayfamıza daha iyi özellikler kattık.
Standartları unutmayın!
Xhtml dokümanları hazırlamayı ve yazım kurallarını öğrenmiş bulunuyoruz. Ancak bu saatten sonra unutmamanız gereken bir şey daha var. O da standartlar!
W3C (World Wide Web Consortium) bize sıklıkta tavsiye ve öğüt ettiği standartları ve standart yazım biçemini lütfen sayfalarınızda uygulayın. Ancak bu şekilde hem hızlı erişilebilir hem de sadece pc değil tüm platformlar üzerinde doğru görüntülenir sayfalar yapabiliriz.
Yapmış olduğunuz sayfaların http://validator.w3.org sitesinden Xhtml standartlarına uygun olup olmadığını kontrol edin.
Artık Xhtml’ye aşina bir kişi olarak bundan sonra yapmanız gereken temel CSS dersleri alarak kendinizi daha da geliştirmek.
Kararlı ve standartlara uygun bir sayfa hazırlamak ihtiyacınız olan bileşim Xhtml ve Css yolundan geçiyor. Bunu kesinlikle unutmayınız.
Xhtml, günümüzde W3C tarafından standart kabul edilen ve tavsiye edilen web biçimleme dilidir. 2 bölüm halinde yayınlamayı düşündüğüm bu xhtml derslerini hazırlamamdaki amaç, vakti zamanında bu tarz Türkçe içerikli Xhtml derslerini nette aramam ve çok az kaynağa ulaşabilmem. Bununla birlikte elimden geldiğince size bol örnekli ve anlatımlı bir xhtml dersi hazırlamayı düşünüyorum.
(aşağıda yer alan konular ve anlatımlar (yazar eklentileri ile birlikte) w3.org ve w3schools.com sitelerinden alınmıştır. lütfen doğru referans için bu siteleri sıklıkla ziyaret ediniz.)
BÖLÜM 1
Xhtml’ye Giriş
Maddeler halinde sıralayacak olursak Xhtml;
Xhtml öğrenirken neleri bilmemiz gerekiyor?
Herşeyden önce temel Html bilgisine sahip olmalı ve düşük düzeyde de olsa bu dili kullanabilmelisiniz. eğer Html bilginiz yeterli değilse lütfen daha önce Html dilinin yazımını ve kurallarını öğrenin!
Xhtml W3C Tavsiyesidir!
Sizde Xhtml öğrenerek ve bu dili yaptığınız web sitelerinde kullanarak tüm modern browserlarda aynı görüntüyü elde edebilir, W3C standartlarına uygun, daha hızlı erişilebilir web siteleri yapabilirsiniz.
Xhtml ile geleceğin web teknolojilerine bir adım daha yakın olursunuz!
BÖLÜM 2
Neden Xhtml?
World Wide Web üzerinde gördüğümüz birçok web sitesi kötü Html yazımına sahiptir. Bu kodu taşıyan web siteleri bir browser üzerinde düzgün çalışabiliyor olsa bile bir başka browserda aynı doğrulukla görüntülenmeyecektir.
Lütfen aşağıdaki örneği inceleyiniz.
<html>
<head>
<TITLE>Kötü bir HTML sayfası</TITLE>
<body>
<h1>Kötü HTML kodu hiçbir zaman W3 standartlarında geçerli değildir!
</body>
Yukarıda yer alan kodda şayet Html bilginiz yerindeyse bazı etiketlerin kapanmadığını ve eğer Xhtml aşina bir kişiyseniz de Xhtml doküman tipinin tanımlanmadığını bununla birlikte kod yazımının standartlara uygun olmadığını göreceksiniz. Bu tür yazım ile yapılmış bir web sitesi internet üzerinde W3C standartlarına uymadığı gibi, browserlar üzerinde de görüntü bozukluğuna yol açmaktadır.
XML dili her zaman geçerli ve “tam uygun” (well-formed) kod bütünlüğü sağlayarak en doğru sonucu almanızı sağlar. XML Html dosyalarınızda oluşturduğunuz yada elde ettiğiniz dataları en iyi ve doğru şekilde webe aktarabilmeniz için kurulmuştur. Ayrıca esnek yapısı ile kullanıcılarına birçok avantaj sağlar.
Günümüzde webe bağlı iş istasyonları, ev kullanıcı bilgisayarları, mobil cihazlar internete browserlar aracılığı ile bağlanmakta ve yukarıda sözünü ettiğimiz “Kötü Html” yazımına sahip siteler bu cihazlar ve platformlar üzerinde doğru sonuç vermemektedir.
Bu nedenle XML ve HTML kombinasyonu ile oluşturulan ve geleceğe yön verecek dil ortaya çıkarılmıştır: XHTML!
Xhtml ve Xhtml ile oluşturulan sayfalar XML standardını destekleyen tüm cihazlarda ve modern tarayıcılarda (IE, FF, Safari, Opera) “Tam ve standartlara uygun” kod yazımı ile web sayfanızın tüm dünya üzerinde doğru olarak görüntülenebilmesini sağlayan bir fırsattır. Eğer hala Xhtml kullanımını bilmiyor yada web siteleriniz üzerinde Xhtml yazımını kullanmıyorsanız bu yazı dizisini takip edin.
BÖLÜM 3
XHTML ile HTML arasındaki farklar
Xhtml dili, Html’den çokta farklı değildir. Xhtml geçerli parametre ve etiketleri Html 4.01 üzerinden alınmış ve dile entegre edilmiştir. Bununla birlikte, şimdiden HTML kodlarınızı küçük harflerle yazmaya başlayın. Zira Xhtml yazım biçemi, bunun dışında olan (HTML’nin kabul ettiği ancak Xhtml’nin kabul etmediği) yazım biçimlerini ve etiket sonlandırılmalarını standartlara uygun bulmamaktadır.
İki Dil Arasındaki Bazı Önemli Farklar
Maddeler halinde sıralayacak olursak iki dil arasında temel olarak şu farklar vardır:
Xhtml Etiketleri Gereği Gibi Dizilmelidir!
Aşağıdaki örneği inceleyecek olursanız bu yazım tarzının Xhtml’ye uygun olmadığını göreceksiniz. Çünkü bu yazımda etiketler sırasız olarak kapatılmışlardır. Bu tarz bir yazım Xhtml’de yine aşağıdaki gibi olmalıdır.
HTML Format: <b>Bu yazı kalın ve italik olarak yazılmıştır</b></i>
XHTML Format: <b>Bu yazı kalın ve italik olarak yazılmıştır</i></b>
Yukarıda görüldüğü üzere Html formatta etiketlerin kapanma sırası önemli değil. Bu tarz bir yazımı browser bir hata vermeden görüntüleyecektir. Ancak ikinci yazımda Xhtml’ye uygun olan kod daha temiz ve daha iyi bir kullanımdır.
Xhtml dokümanları “tam ve uygun kod” yazımı ile yazılmalıdır!
Xhtml üzerinde kodlar, özellikle html, body, head gibileri çift olmalı yani açılan head etiketi komutlar icra edildikten sonra bitirilmeli bu etiket içine standarda uygun olmayan başka eklenti veya kod yazılmamalıdır. Aşağıdaki örnek Xhtml yazımına uygun bir Html kabuğunu bizlere veriyor.
<html>
<head> … </head>
<body> sayfamızda yer alan görsel öğelerin tümü </body>
</html>
Etiket ve parametre isimleri “küçük harflerle” yazılmalıdır!
Xhtml yazımı kesinlikle etiket ve parametrelerin büyük harfle yazımını kabul etmez. Yazılan etiketler mutlaka küçük harflerle yazılmalıdır. Aşağıda html ve xhtml formatında örnekler bulabilirsiniz.
HTML Format: <BODY><FONT color=”red”>bu yazı kırmızı</FONT></body>
XHTML Format: <body><font color=”red”>bu yazı hem kırmızı hem de Xhtml ile yazıldı!</font></body>
Yukarıdaki örnekte gördüğünüz gibi Html format yazılan kodu aynen browserda icra edecektir, burada herhangi bir sorun olmamaktadır. Ancak Xhtml yazımında etiketleri ve parametreleri küçük yazmalıyız. Ancak bu şekilde bir yazım standart uyumu için geçerli olabilir.
Tüm Xhtml etiketleri mutlaka “kapatılmalıdır”!
Xhtml dilinde kodlama yaparken kesinlikte tüm açılan etiketler kapatılmalıdır. Açılan etiketlerin sırayla kapatılması Xhtml için doğru bir yazımdır. Yine örneğimizi inceleyelim:
HTML Format: <p>bu bir paragraf…
XHTML Format: <p>bu bir paragraf </p>
Boş etiketler kesinlikle kapatılmalıdır!
Html üzerinde bazı etiketlerin kapatılmasına ihtiyaç duyulmaz. Örneğin <br>, <img>, <hr> gibi. Xhtml dilinde bu etiketlerinde bir kapatılma biçimleri vardır. Etiketler sonuna /> işareti atılarak bu etiketler kapatılmalıdır. Lütfen aşağıdaki örnekleri dikkatlice inceleyiniz.
HTML Format:
Satır atlayalım<br>
Sayfamıza yatay çizgi atalım :<hr>
ve sayfamıza bir resim yerleştirelim <img xsrc=”xhtml.gif” alt=”xhtml dersleri”>
Xhtml Format:
Satır atlayalım<br />
Sayfamıza yatay çizgi atalım:<hr />
ve sayfamıza bir resim yerleştirelim <img xsrc=”xhtml.gif” alt=”xhtml dersleri” />
gördüğünüz gibi Html üzerinde kapatmaya ihtiyaç olmayan bu etiketler Xhtml dilinde etiket sonuna /> atılarak kapatılıyor. Günümüz browserlarına tam uyumlu olabilmesi için siz de bu tarz etiketlerin sonuna bir boşluk ve /> işaretleri atarak sonlandırınız. Tıpkı örnekte olduğu gibi.
Bir sonraki ders dizisinde biraz daha teknik konulara değineceğiz. Umarım faydalı olabilmişimdir.
DTD nedir?
DTD bir web sayfasının tipini SGML (Standard Generalized Markup Language) dili ile belirler.
DTD, HTML gibi SGML uygulamaları tarafından kullanılır. Amacı sayfa için geçerli olan markup sitilini belirtmektir. XHTML SGML döküman tipinde tanımlanmıştır. Bir XHTML DTD dökümanı sayfada uyulması gereken kuralları, bilgisayarın anlayabileceği bir dille belirtir.
Yazdığınız XHTML dökümanlarının hangi standartlara uyduğunu DTD belirtir ve sayfada ilk satır olarak yer almalıdır. Sayfalarınızın standarda uygunluğu testlerini W3C’nin doğrulama araçları ile yapabilirsiniz. http://validator.w3.org adresinden bu araçlara ulaşabilirsiniz.
Örütbağı üzerinde bir kaç kaynak adresi de işinize yarayacaktır.
W3C XHTML Anasayfa- http://www.w3c.org/MarkUp/
W3C standart bildirgesi - http://www.w3.org/TR/2000/REC-xhtml-basic-20001219/
W3Schools XHTML sayfaları - http://www.w3schools.com/xhtml
Web tasarımcılarının sanal kütüphanesi (WDVL) XHTML sayfaları - http://www.wdvl.com/Authoring/Languages/XML/XHTML/
Webmonkey XHTML Genel Bakış - http://hotwired.lycos.com/webmonkey/00/50/index2a.html
XHTML tartışmaları - http://www.webreview.com/tag/2000/09_01_00.shtml
a- XHTML Strict
XHTML Dökümanlarını css dökümanları ile beraber kullanmanız gerektiğinde kullanılır. HTML’nin dizayn unsurlarını içermez.
Tanımı:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
b- XHTML 1.0 Transitional
CSS anlamayan web gezginlerini desteklemek ve HTML’nin dizayn unsurlarını kullanmak istiyorsanız bu döküman tipini kulanın.
Tanımı:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0
Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd”>
c- XHTML 1.0 Frameset
Eğer XHTML dökümanları pencerelere bölünmüş olarak gösterilecekse bu döküman tipini kullanın.
Tanımı:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
1. Dökümanlar XML uyumlu olmalıdır.
HTML’de geçerli olan bu kod:
<b><i>Bu yazı kalın ve yatıktır</b></i>
XHTML’de geçerli değildir. Elemanlar düzgün biçimde iç içe geçmelidir.
<b><i>Bu yazı kalın ve italiktir</i></b>
Tüm XHTML elemanları <html> kök elemanı içinde bulunmalıdır. Diğer tüm elemanlar alt elemanlara sahip olabilir. Alt elemanların başlangıç ve bitiş tagları olmalı ve doğru biçimde iç içe geçmelidir. Temel döküman yapısı şu şekilde olmalıdır. <html>
<head>…….</head>
<body>…….</body>
</html>
2. Tüm elemanlar küçük harfler kullanılarak yazılmalıdır. XHTML bir XML uygulamasıdır ve XML’de küçük büyük harf ayrımı vardır. Örneğin <BR> ve <br> tagları farklı biçimde yorumlanır.
Bu yazım yanlışdır.
<BODY>
<P>Bu bir paragrafdır</P>
</BODY>
Bu yazım ise doğrudur.
<body>
<p>Bu bir paragrafdır</p>
</body>
3. Tüm XHTML elemanlarının sonlandırılması gerekir. Boş olmayan her elemanın sonlandırılması gerekir, örneğin aşağıdaki yazım yanlışdır:
<p>Bu bir paragrafdır
<li>Bu bır liste maddesidir
Doğru olan:
<p>Bu bir paragrafdır</p>
<li>Bu bir liste maddesidir</li>
4. Boş elemanlarda sonlandırılmalıdır. Boş elemanlar ya bir sonlandırma elemanına yada “ />” işaretine ihtiyaç duyar. Örneğin aşağıdaki yazım yanlışdır.
Bu bir satır atlar<br>
Yatay çizgi böyle yapılır<hr>
Burada resim olacak <img src=”dosyaismi.gif”>
Doruları ise:
Bu bir satır atlar<br></br>
Yatay çizgi böyle yapılır<hr />
Burada resim olacak <img src=”dosyaismi.gif” />
XHTML web sayfalarınızı bugünün web gezginleri ile uyumlu hale getirmek istiyorsanız “/” işaretinden önce bir boşluk bırakmalısınız. <br /> yada <hr /> gibi.
5. Parametre isimleri küçük harf olmalıdır. Aşağıdaki örnek yanlıştır:
<table WIDTH=”100%”>
<div ALIGN=”center”>
Doğrusu:
<table width=”100%”>
<div align=”center”>
6. Parametre değerleri tırnak işareti içinde olmalıdır. Aşağıdaki örnek yanlıştır:
<table width=100%>
<div align=center>
Doğrusu:
<table width=”100%”>
<div align=”center”>
7. Parametre sadeleştirme kaldırılmıştır. Örneğin:
<input checked>
<option selected>
yanlıştır. Doğrusu:
<input checked=”checked” />
<option selected=”selected” />
8. “id” parametresi “name” parametresinin yerine geçer.
<img src=”dosyaismi.gif name=”resim1” />
<a name=”namedanchor”></a>
Yerine doğrusu:
<img src=”dosyaismi.gif id=”resim1” />
<a id=”namedanchor”></a>
9. XHMTL DTD zorunlu elemanları tanımlar. Tüm XHTML dökümanlarının DOCTYPE tanımlama zorunluluğu vardır. Html, head ve body bulunmalı ve title head içinde yer almalıdır. Aşağıda minimum bir XHTML dökümanını görüyorsunuz.
<!DOCTYPE Doctype goes here>
<html>
<head>
<title>Title goes here</title>
</head>
<body>
Body text goes here
</body>
</html>
DOCTYPE elemanı bir XHTML elemanı değildir ve standartlara uymasına gerek yoktur. Ayrıca sonlandırılması da gerekmez.
10. DOCTYPE zorunlu olarak mevcut olmalıdır. Geçerli 3 adet XHTML döküman tipi vardır: