Merhaba arkadaşlar,
Makaleyi okuduğunuza göre HTML diline hakim olmak istiyorsunuz.Dilimiz döndüğünce size
HTML konusunda yardımcı olmaya çalışalım.
Her zaman söylemişimdir: Bir konuyu,olayı öğrenmeye başlamadan önce o konunun aslında ne
anlama geldiğini,ne olduğunu öğrenmek gerekir.Bizde bununla başlayacağız.
HTML web sayfaları oluşturulmasında en gerekli web dilidir.Web programlama dilleri olan php,
asp gibi dillerdede zaten temel olarak html kullanılır.Ve H-T-M-L olarak İngilizce
kelimelerden oluşmaktadır.
Genel bilgileri geçtikten sonra işin ciddi bölümüne geçebiliriz artık.HTML etiketlerden
oluşan bir dildir.Düz bir yazı olarak düşünebilirsiniz HTML'i.Fakat bu yazıların düzene
girmesi için gereken taglar vardır.Bunlar İngilizce kelimeler (table,title vs.)
kısaltılmış İngilizce kelimelerdir (img vs.).Kodlamaya yavaş yavaş geçecek olursak bir
tagın girilmesi için önce "<" ile başlaması bittiğindede ">" ile kapatılması gerekir.
Örnek verecek olursak "
şöyle birşey çıkmakta ortaya ; "
kapatılan taglar ise "" olarak çıkmaktadır.
Şimdi ise öncelikli tagların ne işe yaradığını açıklayalım.
,, ve
etiketlerini açıklayacağız.İlk olarak
etiketinin ne işe yaradığına bakalım.
etiketi paragraf oluşmasını sağlar.Yani bir yazı yazıyorsunuz ve o yazıda gelişme bölümüne
geçeceksiniz.Hemen
etiketini koyuyor ve yazmaya devam ediyorsunuz.Çok düzenli sayfalar
için kullanılır.Unutulmaması gereken bir özelliği var.Diğer HTML etiketleri gibi
tarzında değildir.Yani kısaca
diye birşey yoktur. tagına geçelim.
tagı sizin yazılarınıza şekil vermenize yardımcı olmakla beraber şeklinde
kapatılmalıdır.İngilizce dediğimiz gibi örnek verelim " kalem " kelimesini HMTL'de şekil
vererek yazalım.Örnekler;
- " Kalem Burada "size" boyut anlamına gelmektedir.Ben 4 verdim.
- " Kalem Burada ise "color" renk anlamına gelmekle beraber ben
"red" yani kırmızı değerini verdim.
Kısaca geçelim tagını.Kısaca diğer taglara bakacak olursak: yazınızı kalınlaştırmayı
ise yana yatırmayı sağlar.Örnek verelim ; (Önceden kırmızı ile yazdığım kalem yazısı)
- " Kalem Burada yazımız kalınlaşmaktadır.
- " Kalem BUradada yazımız yana yatmaktadır.
Kısaca taglarada değinmiş olduk.Web sayfalarının tasarımında kullanılan Photoshop gibi
grafik programlarının yanında bizimde kodlar arasında kaybolmadan unutmamamız gereken
kodlar var tabiki.Örnek verelim;
Bu kodları ...etiketlerinin arasına yerleştirebiliriz.Head sitemizin üst kısmıdır.
İstersek header bölümünü çoğaltabiliriz. gibi istediğiniz kadar çoğaltabilirsiniz.
Yazınızda çok önemli bir yere değinmek isterseniz etiketlerini kullanarak altını
çizebilirsiniz.Şimdi kısaca HTML ile yaptığımız sitemize resim eklemeyi görelim;
ile kısaca resim ekleyebiliriz.
Sitemizin arkaplanına renk eklemek istersekte ;
olarak ekleyebiliriz.Tabiki ...tagları arasına.
Sitelerimizdeki resimleri çerçeve içine almak için kullanacağımız taglar ise
etiketidir.Örneğin;
Burada 1 değeri çerçevenin kalınlığıdır.
Boşluk koymak için space tuşunu değilde " &nbps; " kullanmalıyız.Şimdi ise " width " ve " height " etiketlerini kullanalım.
Bir resimin boyutunu değişmek için bunları kullanabiliriz.Deneyelim kodlarımızla;
haline getirebiliriz.Gerçekten seveceksiniz HTML'i bu
yazıdan sonra.İstediğimiz şey eğer yazımıza tıklanıldığında bir siteye veya alt sayfamıza yönlenmesiyse şu örneği incelemeli.
Buraya tıklanınca yönlenecek yazı
Tabi bunları resime tıklayınca yönlendirmektede kullanılmaktadır.Eğer yönlenecek adresimizin yeni bir tarayıcı sayfasında
açılmasını istiyorsak;
satırın başladığını ise düzeni belirtir.Kısa bir örnek yazalım hemen.
| 1.satır 1.hücre | 1.satır 2.hücre | 1.satır 3.hücre |
| 2.satır 1.hücre | 2.satır 2.hücre | 2.satır 3.hücre |
Bu örneği bir notepad belgenizle açarsanız ne anlatmak istediğimizi anlayabilirsiniz.İsterseniz tablonuzu colour'la
renklendirebilirsiniz.Unutmamanız gereken şey ise "border" tagı ile kenarlıkları halletmenizdir.Bu özellik şu şekilde
geçmektedir;
| gibi bir şekildede arkaplan rengini ayarlayabiliriz.Son olarak etiketleriylede alt alta sıralamalar yapabiliriz. Evet arkadaşlar uzun fakat faydalı bir makale olduğu görüşündeyim.Tek bir makale ile HTML'nin çoğunu öğrendiniz.Artık gerisi sizin geliştirici özelliğinize kalmıştır.Son olarak tek bir noktaya değinmek istiyorum."color" özelliklerinde "red,yellow, brown,black" gibi renkler kullanabiliriz.Fakat yaklaşık 16 milyon rengin tek tek adlarını bilmemiz mümkün değil.Bununda kolaylığı var.16 milyon renk değil fakat işinize yarayacak renk kodlarını bulabileceğiniz siteler var ve "HTML Renk Kodları" olarak geçmekte.Ben aramak istemiyorum diyenler için bir adres vereyim : http://www.8rq.org/renk-kodlari .Buradan renk kodlarına ulaşabilirsiniz.Renkler gerçek hayattada olduğu gibi herşeydir unutmayalım. Saygılar, Ersoy Yanık |