1. HTML Hakkında
1.1. HTML Nedir?
1.2. HTML Versiyonları
1.3. HTML Editörleri
1.4. HTML Komutları
1.5. HTML'de Kullanılan Teknolojiler
1.5.1. Java
1.5.2. CGI (Common Gateway Interface)
1.5.3. VBScript (Visual Basic Script)
2. Web sayfası hazırlama
3. Web sayfasını internete koyma
4. Frontpage
5. Netscape Composer
6. Browser'lar
6.1. Internet
6.2. Browser nedir?
6.3. Internet güvenliğine genel bakış
6.4. Microsoft Internet Explorer sizi ve verilerinizi korumayı nasıl garantiler?
6.5. Güvenlik belgelerine genel bir bakış
6.6. Netscape Communicator Programı
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 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 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.
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.
1.4.1. <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.)
1.4.2. <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, karası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
SCR="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>
Win 98
Win NT
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>
Win98
WinNT
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>
Win98
Bir işletim sistemidir.
WinNT
Arayüzü Windows 95’ e çok benzeyen bir işletim sistemidir.
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
Web’ in ortak dili HTML kullanılarak hazırlanan sayfalarda, tablo ve form konuları da oldukça önmelidir. Fakat, burada amaç, tüm HTML komutlarını vermek değil, HTML dilinin temel mantığını anlatmak olduğu için, bu konulardan bahsedilmeyecektir.
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.
1.5.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’ I server’ I 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.
1.5.3. VBScript (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.
Bir VisualBasicScript’ I HTML içine yerleştirebilmemizi sağlayan bir HTML belirteci
(tag) vardır: <SCRIPT> ….. </SCRIPT>
Bir VBScript’ I değişik yollarla HTML kodumuz içine yerleştirebiliriz. Örneğin,
üzerinde Tıkla yazılı bir button’ I <FORM> ….. </FORM> belirteç
çiftiyle oluşturmak ve VBScript kullanarak, oluşturduğumuz bu button’ a
tıkladığımız zaman ekranda “Bu VisualBasicScript’ in basit bir örneğidir.”
mesajının gelmesini sağlamak isteyelim. Böyle bir istek aşağıdaki yapı ile
gerçekleştirebilir:
<HEAD>
<TITLE> VBScript içeren sayfama hosgeldiniz. </TITLE>
</HEAD>
<BODY>
<P> Kullanılan VBScript, asagidaki dugmeye tikladiginizda, ekrana bir mesaj
kutusunun gelmesini saglayacaktir. </P>
<FORM NAME="formornegi">
<INPUT TYPE="Button" NAME="Tiklakomutu" VALUE="Tikla">
<SCRIPT FOR=”Tiklakomutu” Event=”onClick” Language=”VBScript”>
MsgBox “Bu VBScript’ in basit bir ornegidir.”
</SCRIPT>
</FORM>
</BODY>
</HTML>
Yukarıdaki
HTML kodunda, SCRIPT belirteciyle kullanılna FOR seçeneği, bu script’ in TiklaKomutu
isimli dğme (button) için yazıldığını belirtir. Event seçeneği ise, bu scriptin
button üzerine tıklayınca çalışacağını gösterir. Language ise, kullanılan
script’ in bir VBScript olduğunu açıklamak içindir. Bu açıklama olmaksızın,
listeleyici (browser) yazılan script’ in hangi script (JavaScript mi VBScript mi)
olduğunu anlayamaz.
Yukarıda kullanılan yöntem okunabilirliği azalttığı için pek tavsiye edilmez. Onun
yerine aşağıdaki gibi bir kod yazılsa daha iyi olur.
<HTML>
<HEAD>
<TITLE> VBScript iceren sayfama hosgeldiniz. </TITLE>
<SCRIPT LANGUAGE="VBScript">
<!--
Sub Tiklakomutu OnClick
MsgBox "Bu VBSript’ in basit bir ornegidir."
End Sub
-->
</SCRIPT>
</HEAD>
<BODY>
<P> Kullanılan VBScript, asagidaki dugmeye tikladiginizda, ekrana bir mesaj kutusunun gelmesini saglayacaktir. </P>
<FORM NAME="formornegi”>
<INPUT TYPE="Button" NAME="TiklaKomutu" VALUE="Tikla”>
</FORM>
</BODY>
</HTML>
Yukarıdaki kodun <HEAD> ….. </HEAD> kısmı içine yazılan script, bir altprogramdır. Sub altprogramın başladığını, End Sub ise bittiğini gösterir. Sub’ tan sonra gelen TiklaKomutu OnClick, TiklaKomutu isimli button üzerine tıklandığında, bu alt programın çalışacağını belirtir. Bu tip procedure’ lara event-procedure denir.