Html Kodlari | | Javascript | | Webmaster Araclari | | Htmlkod | | Javakod | | Css Kod |

1. <HEAD> .......... </HEAD> Arasinda Kullanilan Komutlar

<TITLE> .......... </TITLE> belirteç çifti: Bu belirteç çifti arasina browser' in (listeleyici) baslik çubugunda görülecek olan sayfanin basligi yazilir.

<META> belirteci: Bu belirteç ile kullanilabilen birçok seçenek vardir. Örnegin bir kullanimi, bu belirteç ile sayfanizin içerigini yansitan bazi anahtar kelimeler ve tanimlamalar verilmesidir. Web üzerinde arama yapan arama motorlari sayfalarin meta belirteçlerine bakarak gruplandirma yaparlar. Bununla ilgili asagidaki örnekleri inceleyiniz.

<META NAME="Description" CONTENT="HTML ögrenmek için yararli bilgiler">

Baska bir kullanim, sayfadaki yazilarin hangi dil ailesine ait karakterlerle yazildigini belirtmek içindir. Yine asagida bunula ilgili bir örnek verilmistir.

<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8858-9"> (Türkçe' nin dahil oldugu dil ailesine ait standard tanimlamasi iso-8859-9' dur.)

Her türlü yazi, formatlama bilgileri bu bölüme girdiginden, bir HTML dökümaninin esas kismini da bu bölüm olusturdugundan, bu bölümde oldukça fazla sayida komuttan söz edilecektir. Bu komutlar belirli bir mantik sirasina göre verilecektir.

RRGGBB ile temsil edilen hexadecimal bir sayidir. (R= Red, G= Green, B= Blue) Bu yöntem kullanilarak degisik renkler elde edilebilir. Pek tercih edilmemekle birlikte sayi yerine dogrudan renk isimleri de verilebilir (aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow ). Bgcolor seçenegi, sayfanin zemininin, text, sayfa içindeki yazilarin, link, baglanti yazilarinin, alink, aktif durumdaki baglanti yazilarinin, vlink, ziyaret edilmis baglantilarin renklerini vermemiz için kullanilir.

Sayfanin zemin rengini tek renk vermek yerine, fona bir background resmi de koyabiliriz. <BODY BACKGROUND=”image_URL”

Sayfa kenarlari ayarlamalari da asagidaki sekilde yapilir:

& marjin miktarini temsil etmektedir. Leftmarjin seçenegi sol kenari, Topmarjin üst kenari ayarlamamizi saglar.Bir döküman içerisindeki yazilardan istedigimiz kisminin font özelliklerini belirlemek için font belirteci degisik seçeneklerle kullanilir:

Font büyüklügü belirlenecek yazi

1’ den 7’ ye kadar degisebilir. Sayiyi artirdikça, belirteç çifti arasina yazdigimiz yazinin büyüklügü de artar.

Font rengi belirlenecek yazi

& yerine yine alti basamakli hexadecimal sayilar kullanarak ya da dogrudan renk ismini vererek, ayarlamamizi yapariz.

Karakter sekli belirlenecek yazi

& yerine istedigimiz karakter tiplerinden birini yazabiliriz. (Örnegin; Times New Roman, Arial gibi…)

Döküman içindeki yazilardan istedigimiz bir kismina kalin, italik, alti çizgili vb özellikleri verebiliriz:

Kalin yapilacak yazi

Italik yapilacak yazi

Alti çizili yapilacak yazi

Satirin biraz üst tarafinda görünmesini istedigimiz yazi

Satirin biraz alt tarafinda görünmesini istedigimiz yazi

<STRIKE> Üstü çizili yapilacak yazi </STRIKE>

HTML dökümanimizda paragraf basi yapmak, sadece alt satira geçmek ya da bir kisim yaziyi tek bir satirda yazmak istedigimiz zaman asagidaki balirteçleri kullanmaliyiz. …...Yeni bir paragraf yapmak istedigimiz zaman

kullandigimiz bu belirteç, çiftiyle birlikte kullanilmaz. Okunabilirligi artirmak için, genelde satirin sonunda kullanilir. Bir satir bosluk birakir.

…..Bir alt satira geçmek için kullanilan bu belirtecin de çifti yoktur. Bu belirteç bir satir bosluk birakmadan, bir alt satira geçer.

Hep ayni satirda yer almasini istedigimiz yazi ….. Bu belirteç, çiftiyle birlikte kullanilir ve belirteç çifti arasina yazdigimiz yazi, bir satirda görüntülenir.

Döküman içinde kullanacagimiz baslik formatlarini ayarlamak için kullanacagimiz belirteç ise asagida gösterilmistir:

<H&> Baslik <H&> …..Bu belirteç çifti arasina da kullanacagimiz basligi yazariz. &, 1’ den 6’ ya kadar degisebilen bir sayiyi temsil eder. Sayi büyüdükçe, basligin ebatlari da küçülür.

Basligi saga, sola yaslamak ya da sayfanin tam ortasinda bulunmasini saglamak için <H&> belirteci ALIGN seçenegiyle kullanilir.

<H& ALIGN=#> Saga, sola ya da ortaya yaslayacagimiz baslik </H>

& yerine 1’ den 6’ ya kadar bir sayi, # yerine de left, right ya da center gelmelidir.

Bir paragrafi oldugu gibi saga, sola ya da ortaya yaslamak istedimiz zaman da belirtecini çiftiyle beraber benzer sekilde ALIGN seçenegi ile kullanmaliyiz.

Saga, sola ya da ortaya yaslayacagimiz paragraf

# = left, right ya da center

Hazirladigimiz dökümanda kullanmak istedigimiz özel karakter stilleri olabilir.Örnegin bir yerden alinti yapmak istedigimizde, alinti yaptigimiz yazilarin biraz egik (italik gibi) görünmesini isteyebiliriz. Ya da bazi vurguladigimiz kisimlarin daha çok göze çarpmasini isteyebiliriz. HTML’ de bu gibi özellikleri saglayan belirteçler de vardir. Asagida bunlar verilecektir:

Önemli bir yazi …..Bu belirteç vurguyu belirtmek için kullanilir. (Disariya biraz egik çikar.)

Çok önemli bir yazi .…Bu belirteç çifti güçlü vurguyu belirtir. (Disariya biraz koyu çikar.)

<CODE> Yazilar yazilar </CODE> …..Bu belirteç çifti yasa, kural belirten yazilar için kullanilir.

<SAMP> Örnek </SAMP> …..Örnek çikti

<VAR> Degisken, emin degil </VAR> …..Degisken, karasiz

<DFN> Tanimlama </DFN> …..Bu belirteç çifti tanimlama belirten yazilar için kullanilir. (Disariya hafif egik çikar.)

<CITE> Alinti </CITE> …..Bu belirteç çifti alinti yazilar için kullanilir.

Küçük yazi …..Bu belirteç çifti arasinda yazilan yazilar disariya çok küçük çikar.

<BIG> Büyük yazi </BIG> …..Bu belirteç çifti arasinda yazilan yazilar disariya çok büyük çikar.

<ADDRESS> Yazarin Adresi </ADDRESS> …..Bu format yazarin adresini yazmak içindir.

<BLOCKQUOTE> Içeriden basla </BLOCKQUOTE> …..Bu belirteç çifti arasina yazilan yazi sayfanin hem sagindan hem solundan içeriye kayar.

<DIV ALIGN=LEFT|CENTER|RIGHT> Herhangi bir yazi ya da yazi grubu </DIV> …..Bu belirteç çifti herhangi bir yazi ya da yazi grubunun saga, sola ya da ortaya yaslanmasini saglar.

<CENTER> Ortalanacak yazi </CENTER> …..Bu belirteç çifti yazi ve resimleri sayfada ortalar .

<PRE> Formatli metin </PRE> …..Bu belirteçler arasina yazilan her sey, yazildigi gibi ekrana çikar. Bosluklar, tab' lar, satir bölmeleri vb korunur.

<BLINK> Yanip sönen yazi </BLINK> …..Bu belirteç çifti arasina yazilan yazilar disari çiktiklarinda bir yanip bir sönen sekilde görünürler.

Sayfamizda herhangi bir yere degisik boyutlarda çizgi çizmek isteyebiliriz.

Bunu <HR> belirteciyle yapariz. Boyutlarini ayarladigimiz seçenekleriyle birlikte kullanimi asagidaki gibidir.

<HR SIZE=# WIDTH=# ALIGN=#> …..Çizginin uzunlugunu ayarlamak için kullandigimiz WIDTH seçenegini WIDTH=50% seklinde de kullanabiliriz. Örnegin; bizim kullanimimiz sayfanin P’ si, yani yarisi uzunlugunda bir çizgi çizmek istedigimizi belirtir.

Sayfamizdan yapacagimiz baglantilara gelince; öncelikle Internet üzerindeki herhangi bir makinadaki bir dökümana baglanti yapmaya bakalim:

<A HREF=”URL_adresi”> Buraya tiklayiniz </A> …..Web sayfanizda “Buraya tiklayiniz” yazisi çikacaktir ve bu yazi bir link görünümünü almistir. Üzerine tikladiginizda yazdiginiz URL adresine ulasirsiniz. URL adresi asagidaki gibidir.

<servis>://<adres>[:port_numarasi]/<dizin>/dosya_adi

<servis> yerine webin disinda diger internet servislerini saglayan prottokolleri de yazabilirsiniz. Eger, bulundugunuz dizinde bir dökümana baglanti yapmak istiyorsaniz, sadece dökümanin adini yazmaniz yeterlidir. Kendi makinanizda fakat baska bir dizin altindaki bir dökümana baglanti yapmak için, dizin ismini ve döküman ismini yazmalisiniz.

<A HREF=”fotograflarimuzgun.gif”> buraya tiklayiniz </A>

Ayni dökümanin içinde bir yere baglanti yapmak istiyorsak o zaman söyle demeliyiz:

<A HREF=”#name”> buraya tiklayiniz </A>

Gitmek istediginiz yerin HTML kodunu ise söyle yazmalisiniz:

<A NAME=”name”></A> Buraya hosgeldiniz.

“name” burada sizin tespit edeceginiz herhangi bir isim olabilir. (Örnegin 1. Bölüme gitmek istiyorsaniz, name yerine 1, ayni sekilde 1. Bölümün bulundugu yere de name olarak 1 yazmalisiniz.)

Baska bir dökümanin bir parçasina gitmek istiyorsaniz, <A HREF=”URL#name”> hedef </A> yazmalisiniz. Tabii gideceginiz döküman parçasinin basinda da <A NAME=”name”></A> yazmalidir.

HTML dökümaniniz içinde bir resim dosyasini da baglanti elemani olarak kullanabilirsiniz. Örnegin;

Bana mail göndermek için zarfin üzerini tiklayin<A HREF=mailto:rovelver21@mynet.com><IMG SCR="envelope.gif"> </A> ……Bu disariya söyle çikar:

Bana mail göndermek için zarfin üzerini tiklayin ZARF RESMI

Eger baglanti yapilacak olan, bir dosyaysa, o dosyanin türü önemlidir. Dosyanin türü, Web sunucusu ve sizin Web istemciniz tarafindan bilinen bir dosya türüyse (TXT, GIF, JPG, JPEG, PNG, XBM) baglanti yazisinin üzerine tikladiginizda dosya açilir. Eger ilgili dosya bilinmeyen bir dosya türüyse, o zaman bu baglanti tiklandiginda, web istemcisi o dosyayi "diske saklamak" ya da bir uygulama programiyla açmak seklinde iki seçenek sunar. Bazi dosya tipleri ise, web istemcilerine yüklenen yardimci "plug-in" ler ile islenebilir. Bunlardan en popülerleri ses formatlari (AU, WAV, MID); video formatlari (RM, MOV, AVI) ve bazi özel tipte dosyalardir (AutoCAD çizim dosyalari gibi).

Kayan yazi görüntüsü elde edebilmek için kullanilacak olan belirteç çifti <marquee> ... </marquee> ‘dir.

<MARQUEE> Kayan yazi </MARQUEE> …..Bu belirteçler arasindaki yazi disariya kayan sekilde çikar:

Bu belirteç çiftinin beraber kullanildigi seçenekler asagida verilmistir:

<MARQUEE SCROLLAMOUNT=#> Kayan yazi </MARQUEE> …..# burada kayma hizini belirten bir sayidir.

<MARQUEE SCROLLDELAY=# SCROLLAMOUNT=#> Kayan yazi </MARQUEE> …..Scrolldelay seçenegi yazinin hangi araliklarla bekletilecegini belirten bir sayidir.

Kayan yazinin büyüklügünü, genisligini ayarlayabiliriz. Align seçenegi ise, top, middle ve bottom degerlerini alabilir.

<MARQUEE ALIGN=# WIDTH=#> Kayan yazi </MARQUEE>

Merhaba!

Kayan yazinin arkaplan rengini bgcolor seçenegi ile asagidaki gibi verebiliriz.

<MARQUEE BGCOLOR=#>Kayan yazi </MARQUEE>

<height=# width=#> ANLAMLARINI

<hspace=# vspace=#> ANLAYAMADIM…

Listeler de incelenmesi gereken önemli bir konudur. Listeleri dört grupta inceleyebiliriz.

1- Sirasiz (Unordered) Listeler: Bir seçenek belirtilmezse, siyah noktali listeler olusturur.

<UL>

<LI> Win 98

<LI> Win NT

</UL>

Win 98

Win NT

Fakat, siyah nokta yerine, içi bos daire ya da kare sekli çikarmak ta mümkündür. Bunun için kullanilmasi gerekli seçenek TYPE seçenegidir. TYPE seçeneginin alabilecegi degerler disc, circle ve square’ dir.

2- Sirali (Ordered) Listeler: Bir seçenek belirtilmezse, 1, 2, 3 … numarali listeler olusturur.

<OL>

<LI> Win 98

<LI> Win NT

</OL>

Win98

WinNT

Burada da type seçenegini kullanarak degisik sirali listeler yaratmak mümkün olur.

<LI TYPE= #> # = A, a, I, i, 1

3-Açiklamali Listeler:

<DT> Win98

<DD> Bir isletim sistemidir.

<DT> WinNT

<DD> Arayüzü Windows 95’ e çok benzeyen bir isletim sistemidir.

</DL>

Win98

Bir isletim sistemidir.

WinNT

Arayüzü Windows 95’ e çok benzeyen bir isletim sistemidir.

4-Içiçe Listeler:

Tüm liste çesitleri, 3'den fazla bölüm kullanmadikça içiçe yazilabilir. Örnek olarak;

<UL>

<LI> Izmir’ deki üniversiteler

<UL>

<LI> Ege Üniversitesi

<LI> Dokuz Eylül Üniversitesi

</UL>

<LI> Ankara' nin belli basli üniversiteleri

<UL>

<LI> Ankara

<LI> ODTÜ

</UL>

Ekrandaki görüntüsü,

•Izmir’ deki üniversiteler

•Ege Üniversitesi

•Dokuz Eylül Üniversitesi

•Ankara'nin belli basli üniversiteleri

•ANKARA

•ODTÜ

Web’ in ortak dili HTML kullanilarak hazirlanan sayfalarda, tablo ve form konulari da oldukça önmelidir. Fakat, burada amaç, tüm HTML komutlarini vermek degil, HTML dilinin temel mantigini anlatmak oldugu için, bu konulardan bahsedilmeyecektir.

1. <HEAD> .......... </HEAD> Arasinda Kullanilan Komutlar

2. <BODY> .......... </BODY> Arasinda Kullanilan Komutlar