|
HTML Nedir?
HTML (Hypertext Markup Language); yazı, grafik, ses, film
gibi pek çok farklı yapıdaki verilerden oluşabilen hypertext bir
dökümanı formatlamak ile ilgili komutlar içeren bir yorumlayıcı
programlama dilidir. Dökümanın hypertext olması, bir dökümanın ya da bir
parçasının, başka bir dökümanın içinden çağırılabilmesini ifade eder.
Çağırılan, aynı döküman içinde bir kısım ya da network üzerinde herhangi
bir makinada yer alan başka bir döküman veya dökümanın bir kısmı
olabilir. HTML programlama dilini kullanarak, kompakt ve etkileşimli Web
sayfaları hazırlayabiliriz.
Her yararlı ve iyi şeyin gelişmekte olduğu gibi, HTML dili de
gelişmeye uğramış ve zaman içinde değişik versiyonları çıkmıştır.
Bunlara kısaca bir göz atmakta yarar vardır.
HTML Versiyonları
HTML 1.0: Bu versiyon, daha sonra geliştirilen
versiyonlarla karşılaştırılınca, çok kısıtlı yeteneklere sahip olduğu
anlaşılır. Bu nedenle HTML 1.0 ile yaratılan dökümanlar da oldukça
basittir. HTML 1.0 dökümanlarının temel özellikleri şöyle özetlenebilir:
Çok seviyeli başlıklar, paragraflar, hipermetin referansları,
maddelenmiş listeler için özel formatlama.
HTML 2.0: Bu versiyon, 1994 yılından önce Web dökümanlarında
kullanılan eklentiler ve özellikler temel alınarak hazırlanmıştır. Bu
versiyonun beraberinde getirdiği temel yenilikler ise, satır içi
görüntüler ve doldurulabilen formlardır.
HTML 3.0: Bu versiyonun sağladığı yeni özellikler şu temel
başlıklar altında incelenebilir: Sayfa görünümü üzerinde ileri derecede
kontrol, manşetler, görüntülerdeki popüler noktaların istemci tarafında
işlenmesi, özelleştirilmiş listeler, istemci çekme/sunucu itme özellikli
dinamik dökümanlar, matematik dökümanlar, stil yaprakları, form içi
tablolar.
HTML Editörleri
HTML kodları herhangi bir editörde yazılabilir. Örneğin; bu
iş için Unix üzerinde pico, vi; DOS altında MSDOS Edit, Windows textpad
ya da herhangi bir metin editörü kullanılabilir. Fakat, HTML komutlarını
hatırlamak, iyi bir programcı için bile güç bir iş olduğu için, tüm HTML
konutlarını hatırlamamıza gerek bırakmayan özel HTML editörleri
geliştirilmiştir. HTML editörleri çok yararlı programlardır. Birçok işi
görsel menüler yardımıyla kolaylıkla yapabilmemizi sağlarlar, fakat,
sayfamızda yapmak istediğimiz birtakım şeylere editörün özellikleri izin
vermezse, o zaman HTML koduna müdahale etmemiz, yapmak istediğimiz şeyi
HTML komutlarını kullanarak gerçekleştirmemiz gerekir. Ayrıca, Java
Appletleri ve bazı CGI teknikleri ekleyebilmek için de sayfamızın HTML
formatıyla uğraşmamız gerekir. HTML Editörlerini kabaca iki gruba
ayırabiliriz.
1) Bu gruba giren editörler, HTML komutlarını menüler ya da
bazı butonlar yardımıyla döküman içine yazmanızı, ilgili ortamlari
kolayca olusturmanizi saglar. Bu editörlerden bazilari, yazdiginiz HTML
kodunun sonuçlarını bir "preview" pencereden görmenizi saglarlar. Hemen
hepsi, tüm HTML belirteç ve komutlarının anlatıldığı yardım dosyaları
sunarlar. Bu tip editörlerin hemen hepsi, kolay web sayfası hazırlama
sihirbazları (wizard) sunarlar. Böylece, bazı boşlukları doldurarak
basit bir web sayfasını kolayca oluşturabilirsiniz. Ayrıca, hemen hemen
tüm editörler, hazırladığınız sayfaları bir web sunucusuna (FTP ya da
HTTP protokolü ile) gönderebilmek için gerekli araçları (web publishing)
da içerirler. Bu editörler, çoğunlukla, dökümanınız içinde kullandığınız
HTML komutlarını farklı renklerde göstererek sayfanınızın oluşturulma
sürecini kolaylaştırırlar. Çoğu editör, bazı temel JavaScript
programları/özellikleri ekleme ya da hareketli GIF resimlerini (animated
GIF) kolayca hazırlamanızı sağlayabilirler. Bu editörlerden bazıları,
hazırladığınız web sayfalarındaki HTML kodlarını kontrol edebilirler ve
hatalı/eksik kullanımları saptayabilirler. Bunları yapan bazı yardımcı
programlar da vardır.Bu editörlerden bazıları HotDog Pro , HomeSite, Web
Edit, HotMetal ve DiDo 'dur.
2) Bu gruba giren editörler, yazdiginiz anda tüm formatlama
özellikleri ile birlikte görebildiğiniz (WYSIWYG - what you see is what
you get) türden "görsel HTML editörleri"dir. Bu programlar kullanılarak,
karmaşık HTML kodlarına bulaşmadan oldukça iyi sayfalar
oluşturabilirsiniz. Bu tip editörlerden bazıları, aynı anda doğrudan
HTML koduna da müdahele edebilmenize olanak tanır. HTML yardımı, kolay
sayfa hazırlama sihirbazları, heceleme, web sunucusuna dosya
gönderebilme gibi özellikleri bu programlar da, genellikle, sunarlar.
Benzer şekilde, buton hazırlama, JavaScript programları/komutları ekleme
ya da hareketli GIF resimlerini (animated GIF) kolayca hazırlamanızı
sağlayabilecek özellikler de bu programlarda son günlerde sıkça
karşılaştığımız özelliklerden. Popüler web istemcilerinden olan Netscape
Navigator (4.x) bünyesi içinde yer alan "Composer" bu tür bir editör.
Eger Netscape 3.x kullanıyorsanız web editörü bu ürünün Gold sürümünde.
Popüler görsel editörlerden bazıları Microsoft Front Page, Symantec
Visual Page, Adobe Page Mill, Claris Home Page' dir. Ayrıca, Microsoft
Internet Explorer 4.x sürümü ile birlikte "Front Page Express" adıyla,
orijinal ürünün daha basit bir sürümü de ücretsiz dağıtılmaktadır.
İkinci gruba giren editörlerden Microsoft FrontPage, hem
yüksek oranda HTML kodlaması gerektiren uygulamaların çok kolay
yapılabildiği görsel editör özelliği ile, hem de düz HTML kodunu
degiştirebilmenize olanak tanıması ile kullanım alanı gittikçe artan
popüler bir editördür.
HTML Komutları
Bir HTML dökümanının genel olarak görünümü aşağıdaki
gibidir:
<HTML> {Html programýnýn baþlangýç komutudur. }
<HEAD> {Bu alanda yazýlan bilgiler Web sayfasýnda görüntülenmezler.
Burada sayfa baþlýðý, anahtar kelime tanýmlamalarý, sayfa içerisinde
kullanýlan karakter bilgisi (dil, code page) gibi sayfanýn doðrudan
kendisine iliþkin tanýmlamalar yapýlýr. }
</HEAD>
<BODY>
{Sayfa üzerinde görülmesi istenen herþey bu bölümde yazýlýr. Hazýrlanan
dökümanýn baþlangýç ve bitiþ bloðu gibidir.}
</BODY>
</HTML> {Html programýnýn bitiþ komutudur. }
Yukarýda da görüldüðü gibi HTML komutlarý (belirteçleri) <
> iþaretleri arasýna yazýlýrlar ve genelde her HTML belirtecinin / ile
baþlayan bir çifti vardýr. Belirteçlerin çiftler halinde bulunmasý; söz
konusu belirtecin saðladýðý özelliðin sadece belirteç çifti arasýna
yazýlan yazýlara etki edeceðini ifade eder. Bir belirtece ait birden çok
seçenek bulunabilir ve belirteçler seçeneklerle kullanýldýðý zaman, bu
seçeneklerin bir de deðeri bulunur.
<belirtec_adi secenek_adi1=deger_1 secenek_2=deger_2 ...>
HTML, büyük harf küçük harf duyarlýlýðý olmayan bir dildir.
Fakat okunabilirliði artýrmak için, HTML belirteçlerinin büyük harf ile
yazýlmasý bir alýþkanlýktýr. Bir HTML dökümaný ile ilgili verilen bu
genel bilgiler, ileride verilecek komutlarýn kullanýmýnýn anlaþýlmasý ve
örneklerin incelenmesinden sonra, daha iyi anlamlandýrýlacaktýr.
<HEAD> .......... </HEAD> Arasýnda Kullanýlan Komutlar :
<TITLE> .......... </TITLE> belirteç çifti: Bu belirteç çifti
arasýna browser' ýn (listeleyici) baþlýk çubuðunda görülecek olan
sayfanýn baþlýðý yazýlýr.
<META> belirteci: Bu belirteç ile kullanýlabilen birçok
seçenek vardýr. Örneðin bir kullanýmý, bu belirteç ile sayfanýzýn
içeriðini yansýtan bazý anahtar kelimeler ve tanýmlamalar verilmesidir.
Web üzerinde arama yapan arama motorlarý sayfalarýn meta belirteçlerine
bakarak gruplandýrma yaparlar. Bununla ilgili aþaðýdaki örnekleri
inceleyiniz.
<META NAME="Description" CONTENT="HTML öðrenmek için yararlý
bilgiler">
<META NAME="Keywords" CONTENT="html, htm, web sayfasý">
<META NAME="Author" CONTENT="Ozge Donmezer">
Baþka bir kullaným, sayfadaki yazýlarýn hangi dil ailesine
ait karakterlerle yazýldýðýný belirtmek içindir. Yine aþaðýda bunula
ilgili bir örnek verilmiþtir.
<META HTTP-EQUIV="Content-Type" CONTENT="text/html;
charset=iso-8858-9"> (Türkçe' nin dahil olduðu dil ailesine ait
standard tanýmlamasý iso-8859-9' dur.)
<BODY> .......... </BODY> Arasýnda Kullanýlan Komutlar :
Her türlü yazý, formatlama bilgileri bu bölüme girdiðinden,
bir HTML dökümanýnýn esas kýsmýný da bu bölüm oluþturduðundan, bu
bölümde oldukça fazla sayýda komuttan söz edilecektir. Bu komutlar
belirli bir mantýk sýrasýna göre verilecektir.
<BODY BGCOLOR=& TEXT=& LINK=& ALINK=& VLINK=&>
RRGGBB ile temsil edilen hexadecimal bir sayýdýr. (R= Red,
G= Green, B= Blue) Bu yöntem kullanýlarak deðiþik renkler elde
edilebilir. Pek tercih edilmemekle birlikte sayý yerine doðrudan renk
isimleri de verilebilir (aqua, black, blue, fuchsia, gray, green, lime,
maroon, navy, olive, purple, red, silver, teal, white, yellow ). Bgcolor
seçeneði, sayfanýn zemininin, text, sayfa içindeki yazýlarýn, link,
baðlantý yazýlarýnýn, alink, aktif durumdaki baðlantý yazýlarýnýn,
vlink, ziyaret edilmiþ baðlantýlarýn renklerini vermemiz için
kullanýlýr.
Sayfanýn zemin rengini tek renk vermek yerine, fona bir
background resmi de koyabiliriz.
<BODY BACKGROUND=”image_URL”>
Sayfa kenarlarý ayarlamalarý da aþaðýdaki þekilde yapýlýr:
<BODY LEFTMARGIN=& TOPMARGIN=&>
& marjin miktarýný temsil etmektedir. Leftmarjin seçeneði
sol kenarý, Topmarjin üst kenarý ayarlamamýzý saðlar.Bir döküman
içerisindeki yazýlardan istediðimiz kýsmýnýn font özelliklerini
belirlemek için font belirteci deðiþik seçeneklerle kullanýlýr:
<FONT SIZE=&> Font büyüklüðü belirlenecek yazý </FONT>
1’ den 7’ ye kadar deðiþebilir. Sayýyý artýrdýkça, belirteç
çifti arasýna yazdýðýmýz yazýnýn büyüklüðü de artar.
<FONT COLOR=&> Font rengi belirlenecek yazý </FONT>
& yerine yine altý basamaklý hexadecimal sayýlar kullanarak
ya da doðrudan renk ismini vererek, ayarlamamýzý yaparýz.
<FONT FACE=”&”> Karakter þekli belirlenecek yazý </FONT>
& yerine istediðimiz karakter tiplerinden birini
yazabiliriz. (Örneðin; Times New Roman, Arial gibi…)
Döküman içindeki yazýlardan istediðimiz bir kýsmýna kalýn,
italik, altý çizgili vb özellikleri verebiliriz:
<B> Kalýn yapýlacak yazý </B>
<I> Ýtalik yapýlacak yazý </I>
<U> Altý çizili yapýlacak yazý </U>
<SUP> Satýrýn biraz üst tarafýnda görünmesini istediðimiz yazý </SUP>
<SUB> Satýrýn biraz alt tarafýnda görünmesini istediðimiz yazý </SUB>
<STRIKE> Üstü çizili yapýlacak yazý </STRIKE>
HTML dökümanýmýzda paragraf baþý yapmak, sadece alt satýra
geçmek ya da bir kýsým yazýyý tek bir satýrda yazmak istediðimiz zaman
aþaðýdaki balirteçleri kullanmalýyýz.
<P>
Yeni bir paragraf yapmak istediðimiz zaman kullandýðýmýz bu belirteç,
çiftiyle birlikte kullanýlmaz. Okunabilirliði artýrmak için, genelde
satýrýn sonunda kullanýlýr. Bir satýr boþluk býrakýr.
<BR>
Bir alt satýra geçmek için kullanýlan bu belirtecin de çifti yoktur. Bu
belirteç bir satýr boþluk býrakmadan, bir alt satýra geçer.
<NOBR> Hep ayný satýrda yer almasýný istediðimiz yazý </NOBR>
Bu belirteç, çiftiyle birlikte kullanýlýr ve belirteç çifti arasýna
yazdýðýmýz yazý, bir satýrda görüntülenir.
Döküman içinde kullanacaðýmýz baþlýk formatlarýný ayarlamak
için kullanacaðýmýz belirteç ise aþaðýda gösterilmiþtir:
<H&> Baþlýk <H&>
Bu belirteç çifti arasýna da kullanacaðýmýz baþlýðý yazarýz. &, 1’
den 6’ ya kadar deðiþebilen bir sayýyý temsil eder. Sayý büyüdükçe,
baþlýðýn ebatlarý da küçülür.
Baþlýðý saða, sola yaslamak ya da sayfanýn tam ortasýnda
bulunmasýný saðlamak için <H&> belirteci ALIGN seçeneðiyle kullanýlýr.
<H& ALIGN=#> Saða, sola ya da ortaya yaslayacaðýmýz baþlýk
</H>
& yerine 1’ den 6’ ya kadar bir sayý, # yerine de left,
right ya da center gelmelidir.
Bir paragrafý olduðu gibi saða, sola ya da ortaya yaslamak
istedimiz zaman da <P> belirtecini çiftiyle beraber benzer þekilde ALIGN
seçeneði ile kullanmalýyýz.
<P ALIGN=#> Saða, sola ya da ortaya yaslayacaðýmýz paragraf </P>
# = left, right ya da center
Hazýrladýðýmýz dökümanda kullanmak istediðimiz özel
karakter stilleri olabilir.Örneðin bir yerden alýntý yapmak
istediðimizde, alýntý yaptýðýmýz yazýlarýn biraz eðik (italik gibi)
görünmesini isteyebiliriz. Ya da bazý vurguladýðýmýz kýsýmlarýn daha çok
göze çarpmasýný isteyebiliriz. HTML’ de bu gibi özellikleri saðlayan
belirteçler de vardýr. Aþaðýda bunlar verilecektir:
<EM> Önemli bir yazý </EM> {Bu belirteç vurguyu belirtmek için
kullanýlýr. (Dýþarýya biraz eðik çýkar.) }
<STRONG> Çok önemli bir yazý </STRONG> {Bu belirteç çifti
güçlü vurguyu belirtir. (Dýþarýya biraz koyu çýkar.) }
<CODE> Yazýlar yazýlar </CODE> {Bu belirteç çifti yasa, kural
belirten yazýlar için kullanýlýr. }
<SAMP> Örnek </SAMP> { Örnek çýktý }
<VAR> Deðiþken, emin deðil </VAR> {Deðiþken, kararsýz }
<DFN> Tanýmlama </DFN> {Bu belirteç çifti tanýmlama belirten
yazýlar için kullanýlýr. (Dýþarýya hafif eðik çýkar.)}
<CITE> Alýntý </CITE> {Bu belirteç çifti alýntý yazýlar için
kullanýlýr. }
<SMALL> Küçük yazý </SMALL> {Bu belirteç çifti arasýnda
yazýlan yazýlar dýþarýya çok küçük çýkar. }
<BIG> Büyük yazý </BIG> {Bu belirteç çifti arasýnda yazýlan
yazýlar dýþarýya çok büyük çýkar. }
<ADDRESS> Yazarýn Adresi </ADDRESS> {Bu format yazarýn
adresini yazmak içindir. }
<BLOCKQUOTE> Ýçeriden baþla </BLOCKQUOTE> {Bu belirteç çifti
arasýna yazýlan yazý sayfanýn hem saðýndan hem solundan içeriye kayar. }
<DIV ALIGN=LEFT|CENTER|RIGHT> Herhangi bir yazý ya da yazý grubu
</DIV> {Bu belirteç çifti herhangi bir yazý ya da yazý grubunun
saða, sola ya da ortaya yaslanmasýný saðlar. }
<CENTER> Ortalanacak yazý </CENTER> {Bu belirteç çifti yazý ve
resimleri sayfada ortalar . }
<PRE> Formatlý metin </PRE> {Bu belirteçler arasýna yazýlan
her þey, yazýldýðý gibi ekrana çýkar. Boþluklar, tab' lar, satýr
bölmeleri vb korunur. }
<BLINK> Yanýp sönen yazý </BLINK> {Bu belirteç çifti arasýna
yazýlan yazýlar dýþarý çýktýklarýnda bir yanýp bir sönen þekilde
görünürler. }
Sayfamýzda herhangi bir yere deðiþik boyutlarda çizgi
çizmek isteyebiliriz. Bunu <HR> belirteciyle yaparýz. Boyutlarýný
ayarladýðýmýz seçenekleriyle birlikte kullanýmý aþaðýdaki gibidir.
<HR SIZE=# WIDTH=# ALIGN=#> {Çizginin uzunluðunu ayarlamak
için kullandýðýmýz WIDTH seçeneðini WIDTH=50% þeklinde de
kullanabiliriz. Örneðin; bizim kullanýmýmýz sayfanýn %50’ si, yani
yarýsý uzunluðunda bir çizgi çizmek istediðimizi belirtir. }
Sayfamýzdan yapacaðýmýz baðlantýlara gelince; öncelikle
Internet üzerindeki herhangi bir makinadaki bir dökümana baðlantý
yapmaya bakalým:
<A HREF=”URL_adresi”> Buraya týklayýnýz </A> {Web sayfanýzda
“Buraya týklayýnýz” yazýsý çýkacaktýr ve bu yazý bir link görünümünü
almýþtýr. Üzerine týkladýðýnýzda yazdýðýnýz URL adresine ulaþýrsýnýz.
URL adresi aþaðýdaki gibidir. }
<servis>://<adres>[:port_numarasý]/<dizin>/dosya_adý
<servis> yerine webin dýþýnda diðer internet servislerini
saðlayan prottokolleri de yazabilirsiniz. Eðer, bulunduðunuz dizinde bir
dökümana baðlantý yapmak istiyorsanýz, sadece dökümanýn adýný yazmanýz
yeterlidir. Kendi makinanýzda fakat baþka bir dizin altýndaki bir
dökümana baðlantý yapmak için, dizin ismini ve döküman ismini
yazmalýsýnýz.
<A HREF=”fotograflarim\uzgun.gif”> buraya týklayýnýz </A>
Ayný dökümanýn içinde bir yere baðlantý yapmak istiyorsak o
zaman þöyle demeliyiz:
<A HREF=”#name”> buraya týklayýnýz </A>
Gitmek istediðiniz yerin HTML kodunu ise þöyle
yazmalýsýnýz:
<A NAME=”name”></A> Buraya hoþgeldiniz.
“name” burada sizin tespit edeceðiniz herhangi bir isim
olabilir. (Örneðin 1. Bölüme gitmek istiyorsanýz, name yerine 1, ayný
þekilde 1. Bölümün bulunduðu yere de name olarak 1 yazmalýsýnýz.)
Baþka bir dökümanýn bir parçasýna gitmek istiyorsanýz, <A
HREF=”URL#name”> hedef </A> yazmalýsýnýz. Tabii gideceðiniz döküman
parçasýnýn baþýnda da <A NAME=”name”></A> yazmalýdýr.
HTML dökümanýnýz içinde bir resim dosyasýný da baðlantý
elemaný olarak kullanabilirsiniz. Örneðin;
Bana mail göndermek için zarfýn üzerini týklayýn<A
HREF=mailto:hizmet@netyardim.net><IMG SRC="envelope.gif"> </A>
Bu dýþarýya þöyle çýkar:
Bana mail göndermek için zarfýn üzerini týklayýn ZARF RESMI
Eðer baðlantý yapýlacak olan, bir dosyaysa, o dosyanýn türü
önemlidir. Dosyanýn türü, Web sunucusu ve sizin Web istemciniz
tarafýndan bilinen bir dosya türüyse (TXT, GIF, JPG, JPEG, PNG, XBM)
baðlantý yazýsýnýn üzerine týkladýðýnýzda dosya açýlýr. Eðer ilgili
dosya bilinmeyen bir dosya türüyse, o zaman bu baðlantý týklandýðýnda,
web istemcisi o dosyayý "diske saklamak" ya da bir uygulama programýyla
açmak þeklinde iki seçenek sunar. Bazý dosya tipleri ise, web
istemcilerine yüklenen yardýmcý "plug-in" ler ile iþlenebilir. Bunlardan
en popülerleri ses formatlarý (AU, WAV, MID); video formatlarý (RM, MOV,
AVI) ve bazý özel tipte dosyalardýr (AutoCAD çizim dosyalarý gibi).
Kayan yazý görüntüsü elde edebilmek için kullanýlacak olan
belirteç çifti <marquee> ... </marquee> ‘dir.
<MARQUEE> Kayan yazý </MARQUEE> {Bu belirteçler arasýndaki
yazý dýþarýya kayan þekilde çýkar}
Bu belirteç çiftinin beraber kullanýldýðý seçenekler
aþaðýda verilmiþtir:
<MARQUEE SCROLLAMOUNT=#> Kayan yazý </MARQUEE>
# burada kayma hýzýný belirten bir sayýdýr.
<MARQUEE SCROLLDELAY=# SCROLLAMOUNT=#> Kayan yazý </MARQUEE>
Scrolldelay seçeneði yazýnýn hangi aralýklarla bekletileceðini belirten
bir sayýdýr.
Kayan yazýnýn büyüklüðünü, geniþliðini ayarlayabiliriz.
Align seçeneði ise, top, middle ve bottom deðerlerini alabilir.
<FONT SIZE=6>
<MARQUEE ALIGN=# WIDTH=#> Kayan yazý </MARQUEE>
</FONT>
Merhaba!
Kayan yazýnýn arkaplan rengini bgcolor seçeneði ile aþaðýdaki gibi
verebiliriz.
<MARQUEE BGCOLOR=#>Kayan yazý </MARQUEE>
<height=# width=#> ANLAMLARINI
<hspace=# vspace=#> ANLAYAMADIM…
Listeler de incelenmesi gereken önemli bir konudur.
Listeleri dört grupta inceleyebiliriz.
1- Sýrasýz (Unordered) Listeler: Bir seçenek belirtilmezse,
siyah noktalý listeler oluþturur.
<UL>
<LI> Win 98
<LI> Win NT
</UL>
Fakat, siyah nokta yerine, içi boþ daire ya da kare þekli
çýkarmak ta mümkündür. Bunun için kullanýlmasý gerekli seçenek TYPE
seçeneðidir. TYPE seçeneðinin alabileceði deðerler disc, circle ve
square’ dir.
2- Sýralý (Ordered) Listeler: Bir seçenek belirtilmezse, 1,
2, 3 … numaralý listeler oluþturur.
<OL>
<LI> Win 98
<LI> Win NT
</OL>
Burada da type seçeneðini kullanarak deðiþik sýralý
listeler yaratmak mümkün olur.
<LI TYPE= #> # = A, a, I, i, 1
3-Açýklamalý Listeler:
<DL COMPACT>
<DT> Win98
<DD> Bir iþletim sistemidir.
<DT> WinNT
<DD> Arayüzü Windows 95’ e çok benzeyen bir iþletim sistemidir.
</DL>
4-Ýçiçe Listeler:
Tüm liste çeþitleri, 3'den fazla bölüm kullanmadýkça içiçe
yazýlabilir. Örnek olarak;
<UL>
<LI> Ýzmir’ deki üniversiteler
<UL>
<LI> Ege Üniversitesi
<LI> Dokuz Eylül Üniversitesi
</UL>
<LI> Ankara' nýn belli baþlý üniversiteleri
<UL>
<LI> ODTÜ
<LI> Hacettepe
</UL>
</UL>
Ekrandaki görüntüsü,
•Ýzmir’ deki üniversiteler
•Ege Üniversitesi
•Dokuz Eylül Üniversitesi
•Ankara'nýn belli baþlý üniversiteleri
•ODTÜ
•Hacettepe
HTML'de Kullanılan
Teknolojiler
1. JAVA
Java, Sun Microsystems firması tarafından 1991 yılında
geliştirilmiş nesneye yönelik bir programlama dilidir. Java, temel veri
tiplerini, giriş çıkış fonksiyonlarını ve diğer fonksiyonları içeren
sınıf kütüphanesine sahiptir. Bu programlama dili aynı zamanda internet
protokollerinin çoğunu destekleyen fonksiyonlara da sahiptir. Java çok
fazla komut içermemesine rağmen, uygun komutları bünyesinde barındırdığı
için, güçlü bir dil olarak kabul edilmiştir. Java programlama dili,
geliştirilirken C ve C++ dillerini kendine baz almıştır.
Java ile yazılan bir programın çalıştırılabilmesi için, iki
aşamadan geçirilmesi gerekmektedir. Birinci aşama programın derlenmesi
aşamasıdır. Programın Java derleyicisi ile derlenmesi sonucunda, byte
kod (Java binary kod) denilen makina koduna yakın, fakat işlemciye özel
olmayan kod oluşturulur. İkinci aşama ise, programın byte kodunun bir
byte kod yorumlayıcısından geçirilmesi aşamasıdır. Byte kod
yorumlayıcısı programın çalışmasını sağlar. Java’ nın bu özellii ona hem
avantaj hem dezavantaj getirir. Derlendikten sonra işlemciye özel kod
üretilmemesi sayesinde Java sistemden bağımsızdır, üzerinde Java
yorumlayıcısı bulunduran herhangi bir sistemde çalışır. Fakat, bir Java
yorumlayıcı programı yürüttüğü için, işletim hızı da yavaşlar.
Java’ da program yazabilmek için bir Java Geliştirme Kiti
(JDK) gereklidir. Herhangi bir editörde (Unix için pine, vi; DOS altında
MSDOS Edit vb…) yazılıp, *.java uzantılı kaydedilen Java programı
dosyası, JDK’ de komut satırına javac dosya_ismi yazılıp derlenir. Bu
işlem sonucunda dosya_ismi .class dosyası oluşur. (Byte kod dosyası)
JDK’ den java yorumlayıcısı çağırılarak, programın çalıştırılması
istenirse, komut satırına java dosya_ismi yazılır.
Java dili ile yazılan programları, Java uygulamaları ve Java
appletleri olmak üzere iki ana grupta toplayabiliriz. Java uygulaması,
herhangi bir probleme çözüm getirmek amacıyla, Java dili ile yazılmış
bir programdır. Örneğin; ekrana “Ben Java öğreniyorum!” çıktısını veren
bir program yazalım:
Class JavaOgreniyorum {
public static void main(String args[]){
System.out.printIn(“Ben Java öğreniyorum!”);
}
}
Bu programı bir editörde yazıp, genelde sınıfa verdiğimiz isi
dosya ismine de verip, kodu JavaOgreniyorum.java olarak kaydederiz. Daha
sonra yukarıda açıklandığı gibi, JDK’ de derlemek için komut satırına
javac JavaOgreniyorum yazıp, JavaOgreniyorum.class dosyasının oluşmasını
sağlarız. Programın çalışması için de java JavaOgreniyorum komut
satırını yazarız.
Java appleti ise, Java desteğine sahip bir listeleyicide
(browserda) görüntülenen Web sayfaları içerisinden çalıştırılabilen
programlardır. Bir Java appleti imajlara benzer, fakat, dinamik ve
interaktif olmasıyla farklılaşır. Bir Web sayfasına java appleti
bağlamak için, önce Java dili ile program yazılıp derlenir. Sonra HTML
ile hazırlanmış Web sayfasında bu dosya referans olarak gösterilir. HTML
dosyası ile applet dosyasının aynı dizinde olması tavsiye edilir. (bir
HTML dosyası ile o sayfada kullanılan imaj dosyası gibi) Web sayfası
yüklendiğinde Web listeleyicisinde (browserında) gömülü olan Java
yorumlayıcısı sayfadaki appletleri çalıştırmaya başlar. Appletlerin Web
sayfasında çalışması için, kullanılan listeleyicinin Java desteğine
sahip olması gerekmektedir. Bu amaçla geliştirilen ilk listeleyici
(browser), HotJava olup (HotJava Java dili ile yazılmıştır.), daha sonra
diğer Web listeleyecilerinin de Java’ yı destekleyen yeni sürümleri
çıkartılmıştır. (Örneğin, Netscape 2.0 gibi)
Şimdi deminkine benzer bir Java appleti yazmayı ve bunu bir
Web sayfasına bağlamayı deneyelim:
import java.awt.Graphics;
public class JavaOgreniyorumApplet extends java.applet.Applet{
public void paint (Graphics g){
g.drawstring(“Ben Java öğreniyorum!”, 5, 25);
}
}
Burada import komutu da applet’ in JDK içindeki sınıflara
erişimini sağlar.
Bu applet dosyası da deminki Java programına benzer biçimde,
bir editörde yazıldıktan sonra ait olduğu sınıf ismi dosya ismi olarak
verilip JavaOgreniyorumApplet.java şeklinde kaydedilir. JDK’ de javac
JavaOgreniyorumApplet komut satırı yazılıp, programın derlenmesi
sağlanır. Daha sonra oluşturulan byte kodun çalışması için, java
JavaOgreniyorumApplet komut satırı yazılır.
2. CGI (Common Gateway Interface)
CGI’ ın ne olduğunu anlatmaya geçmeden önce bazı kavramların
açıklanması gerekmektedir. Buna Web Server ve Client ile başlamak
yerinde olur. Web Server’ lar (HTTPd Server), Web sayfalarını üzerinde
bulunduran makinalardır. Bu makinalar genelde kendi üzerlerinde bulunan
Web sayfalarına erişmek için 80 numaralı portu kullanırlar. Client ise,
Web Server’ lar üzerindeki Web sayfalarına erişmek isteyen makinalardır.
Client herhangi bir porttan Web Server ile iletişim kurabilir. Stdin
standard input’ un kısaltılmışıdır ve server açısından client’ ın
server’ a gönderdiği veriler anlamına gelir. Stdout standard output’ un
kısaltılmışıdır ve server’ ın client’ ın gönderdiği verileri işlemesi
sonucunda client’ a gönderdiği sonuç bilgisi anlamına gelir. Yukarıdaki
açıklamalardan da anlaşıldığı gibi, HTTP protokolü, server’ dan client’
a ve client’ tan server’ a veri aktarımını destekler. Client’ ın server’
a veri gönderebilmesi, formlar aracılığıyla olur. Form, client’ ın
server’ a veri ulaştırmasını sağlamak amacıyla HTML dili kullanarak
yazılmış Web sayfalarıdır. Kullanıcının (client) form aracılığıyla
server’ a gönderdiği bilgiyi işleyecek server tarafında çalışan bir
programa ihtiyaç vardır. Bu programa gateway programı denir. CGI (Common
Gateway Interface), client’ ın gönderdiği input verileri alıp, gateway
programına veren (gateway programının çalışmasını sağlayan) ve programın
çıktısını tekrar client’ a ileten, kısaca server ve server tarafındaki
gateway programları arasında iletişimi sağlayan, bir arayüz,
protokoldür. Bir Web Client programının (Web browser), HTTP server’ ına
veri göndermesini sağlamak için hazırlanan formlar, HTML diliyle
aşağıdaki gibi başlar:
<FORM ACTION=”URL” METHOD=get | post>
…..
…..
</FORM>
Action seçeneğinde belirtilen URL, formun doldurulduktan
sonra, hangi Web server’ daki hangi program tarafından işleneceği
bilgisini ifade eder. Method seçeneği ise, formun Web server’ ına hangi
methodla ulaştırılacağını belirtir. Yukarıdan da anlaşılacağı gibi,
formdaki bilgiler iki methodla ulaştırılabilir. Get metodu kullanılırsa,
veri çevresel değişkenler aracılığı ile, Web Server’ a ulaştırılır. Bu
metodla bütün form bir query_string değişkeninin içine konur, action
kısmında belirtilen adres ve programın sonuna eklenir ve tek bir URL
olarak gönderilir. http://bla.bla.edu./stuff/program?query_string Veri
büyüklüğü sınırlandırılmıştır. Bu yöntem kullanıldığı zaman, actionda
belirtilen URL önce decode edilmelidir, çünkü form doldurulup, submit
edildiğinde, browser bütün bilgiyi URLencode eder. Decode işlemi bir CGI
script (gateway programı) ile yapılabilir. Yukarıda submit edilen URL
incelendiğinde, soru işaretine kadar olan kısmın, formun action kısmında
yer alan adres ve program olduğu görülür. Soru işaretinden sonraki kısım
ise, gönderilen verilerin yer aldığı değişkendir. Post metodu
kullanıldığında ise, CGI veriyi stdin olarak, alır ve bütün çevresel
değişkenlere gerekli atamaları yapar. Veri üzerinde herhangi bir
büyüklük sınırlaması yoktur. Verinin gateway programı tarafından
işlendikten sonra, client’ a geri gönderilmesine gelince; çıktılar MIME
çıktıları, redirection ve nonparsed Headings olmak üzere üç şekilde
gönderilebilir. Sadece MIME çıktılara genel olarak bakalım: Çıktının
MIME type gönderilmesi, herhangi bir Web sayfası, ses veya video dosyası
ya da sade text olması demektir. Gateway programı, standard output’ un
MIME tipini belirten başlık mesajlarını koymak ve altına bir de boş
satır bırakmak zorundadır. Örneğin; Content-type: MIME type (text/html)
Data… Data… Bir gateway’ in kullanım amaçları çok çeşitli olabilir. Bir
örnek vermek gerekirse; bir Web server üzerindeki bir veri tabanı
üzerinde, bir bilginin, verilen bir keyword aracılığıyla araştırılması
bir gateway programıyla halledilebilir. Bir gateway programı herhangi
bir programlama diinde yazılabilir. Fakat, bir gateway yazmak için en
çok tercih edilen programlama dilleri şunlardır: C, C++, Fortran, Perl,
TCL, herhangi bir Unix Shell, Visual Basic, AppleScript. Script diliyle
yazılmış programların kendileri server’ a konur, diğer dillerde yazılmış
programların ise derlenmiş hali server’ a konur. Derlenmiş hali server’
a konan programların source kodları da bilgi amacıyla genelde konur. CGI
real time çalıştırılır, yani client ne zaman çalıştırmak isterse, CGI bu
isteği alır, verileri çevresel değişkenlere aktararak gateway’ e
gönderir ve gateway’ i çalıştırmaya başlar ve çıktı programın çalışması
bitince, CGI tarafından alınıp, client’ a gönderilir. Gateway’ lerin
server’ a konması için iki yol izlenebilir: Bunlardan birincisi, herkes
kendi dizini altına programını koyar ve bir de hangi uzantılı dosyaların
server tarafından cgi olarak kullanılacağının server’ a bildirilmesi
için bir .htaccess dosyası hazırlar. Fakat, bu yöntem pek tercih
edilmez, çünkü güvenli gateway programı yazmak kolay bir iş değildir.
Gateway’ ler real time çalıştırıldığından, kötü niyetli kişiler, gateway
server’ı zor durumda bırakacak şekilde kullanabilirler. Bunu engellemek
için, gatewayler server üzerinde ayrı bir dizin altında tutulurlar. (cgi-bin
dizini) Gateway programları, bu dizine sadece Webmaster’ ların bilgisi
ve izni dahilinde konulabilir.
3. Visual Basic Script
VisualBasicScript, JavaScript gibi script diller, HTML’ ye
ek olarak tasarlanmıştır. Bu diller ile programlar HTML içine yazılır ve
Web sayfasının interaktif ve dinamik olmasına hizmet ederler. VBScript
eklenmiş sayfalar bu dili destekleyen listeleyiciler (browserlar)
tarafından görüntülenebilir. Mevcut listeleyiciler (browserlar)
arasından sadece Internet Explorer VBScript desteğine sahiptir. HTML
dökümanı içindeki scriptleri ayırıp (parse), işletmek (process) -bu dili
destekleyen- listeleyicinin (browserın) sorumluluğundadır.
|