Sekil 1
Elektronik iletisim okulu kösesi --21-- Mart 1999
Merhaba,
Sizlere yazmayali epey uzun zaman oldu. Sizler Ocak ayinda bir yazimi okudunuz ama ben o yaziyi önceki Macworld kapanmadan önce yazmistim. Bu ise, Bahattin'in dergiyi tam kadro yeniden kurmayi (yasatmayi demiyorum, çünkü bütün o sürece taniklik etmis biri için bu, harcanan emeklere haksizlik etmek olur) basarmasindan sonra yazdigim ilk yazi. Yani neresinden baksaniz en az üç ay ara vermisim. Dolayisiyla, yazmaya yazmaya biraz paslanmissam simdiden affola.
Ücretler, Fiyatlar, Bedeller...
Internet üzerinde bilgi toplamanin en etkili araçlarindan biri web sayfalarinda kullanilan formlar. Örnegin formlar araciligiyla dilediginiz konularda anketler yapabilir ve ilgilendiginiz konularda bilgi toplayabilirsiniz.
Formlar, Internet üzerinde yürütülen elektronik ticaretin de ayrilmaz parçalarindan biri. Web sayfanizda kullanacaginiz bir form yoluyla tanittiginiz ürün ya da hizmetler için siparis de alabilirsiniz.
Baska hiç bir türlü kullanamasaniz bile, sayfanizi ziyarete gelenlerin ne düsündüklerini ögrenmek için formlardan faydalanabilirsiniz.
Bir form sayfasinda yer alan bilgi toplama unsurlarinin ayrintilarina girmeden önce ele alinmasi gereken bir konu var: Formlar araciligiyla toplanan bilginin size nasil ulastirilacagi.
Bunun temel olarak iki yolu var. Bir tanesi, web sunucusu olarak çalisan bilgisayar üzerinde bir kisim özel programlar kullanmak. Eger web suncusu olarak kullanilan cihaz sizin kendi elinizin altinda degilse ya da hiç degilse dogrudan kontrol edemiyorsaniz bu yöntemden verim almak biraz zor. Çünkü, öncelikle bu hizmeti saglayan kisinin kendi makinesi üzerinde bir kisim özel programlarin çalistirilmasina izin vermesi gerekiyor. Hadi bu izinleri aldiniz diyelim, bu kez de sözkonusu programlarin yazilmasi diye bir sorun karsimiza çikiyor. Çünkü program yazmak dediginiz anda, bu programin hangi isletim sistemi altinda çalisacagi, hangi programlama diliyle yazilacagi, bunlarin web sayfasindaki formla nasil entegre edilecegi, ilgili web sunucusu cihaza nasil yüklenecegi, vb. gibi bir dizi teknik ayrintiyla ugrasmaniz gerekiyor.
Ama çok sükür ki hayatta her sey bu kadar zor degil. Formlar araciligiyla topladiginiz bilginin size ulastirilmasi için kullanabileceginiz ikinci yol çok daha basit: elektronik posta. Sizin gelen e-postalari alabileceginiz bir hesabiniz ve sayfanizi ziyaret eden kisinin kullandigi web tarayicisinin da e-posta gönderme yetenegi varsa sorun yok. Formunuzda yer alan bütün bilgiler size e-posta araciligiyla ulastirilabilir.
Ancak, bunun da dezavantajlari yok degil, tabii. Bilgiyi iletme yolu elektronik posta olunca, e-postanin beraberinde getirdigi bütün sorunlar formlar için de geçerli olmaya basliyor. Örnegin formu dolduran kisi kimliginin ya da adresinin bilinmesini istemiyorsa (ki bazi anketlerde bu önemli olabilir) bu tür bir formu doldurmak ya da size göndermek istemeyecektir. Ayni sekilde, e-posta ile gönderilen bilgiler güvenli olmadigi için, kredi karti ve benzerleri gibi baskalari tarafindan görülmesi sakinca dogurabilecek bilgiler de e-posta yoluyla iletilmeyecektir.
Dolayisiyla, elektronik ticaret yapmak istiyorsaniz bu türden basit bir form yoluyla siparis alirken müsterinin kredi karti bilgilerini de bu yolla göndermesini beklemek gibi bir hayale kapilmayin. Eger gerçekten bu boyutlarda is yapmak istiyorsaniz, o zaman kesenin agzini (epeyce) açip önce kendinize ait bir web sunucusu kurmaniz, sonra bu sunucu üzerinde güvenli (secure) bir site kurmaniz ve ancak ondan sonra tahsilat yapmaniz gerekir. Güvenli web sitesi olusturmanin fiyati ise hayli yüksek.
Daha ucuz bir yol derseniz, o zaman sanal magaza isleten servis saglayici kurumlara basvurup size de bir köse açmalarini istemek ve bunun ücretini ödemek disinda bir yolunuz kalmiyor.
Kisacasi, elektronik ticaret yapmayi düsünüyorsaniz, siparisi alip da is tahsilata geldiginde ya geleneksel yöntemleri tercih etmeye ya da elektronik tahsilatin bedelini ödemeye hazir olun. Akilli hiç bir müsteri, güvenli olmayan bir sitede kredi karti bilgisini vermeyecektir. Ama web sitesi üzerinden yalniz siparis almaya razi oldugunuz sürece mesele yok. Basit bir form isinizi görmeye fazlasiyla yetecektir.
Form'larla ilgili HTML etiketlerinin ilki, formun baslangiç ve bitisini belirten <FORM> ve </FORM> çifti. Bunlarin ilki, formun hangi sekilde size ulastirilacagini da belirtiyor. Bunun için, <FORM> etiketinin içine METHOD=POST ve ACTION="..." ifadelerini ekliyoruz. Buradaki boslugun içine bir internet adresi yaziliyor. Biz formumuzun e-posta yoluyla gönderilmesini istedigimiz için de buraya önce MAILTO: ifadesini hemen ardindan da e-posta adresimizi yazacagiz. Yani bu etiketi su sekilde kullanacagiz:
<FORM METHOD=POST ACTION="MAILTO:birisi@biryer.com.tr"> .
Formun içinde bilgi toplamak için kullanabilecegimiz unsurlar ise sunlar:
Simdi bunlari sirasiyla görelim.
Açilir menüler
Sayfanizi ziyarete gelen kisinin belirli seçenekler içinden bir tanesini seçmesini istiyor ve bunun için de asagi açilir bir menü kullanmayi tercih ediyorsaniz, kullanmaniz gereken etiket <SELECT> ... </SELECT> çiftinden olusuyor. Örnegin, formu dolduran kisinin hangi tür bilgisayar kullandigini ögrenmek istediginizi varsayalim. Bu durumda söyle bir kod yazabiliriz:
Kullandiginiz
bilgisayarin turu: <BR>
<SELECT
NAME="Bilgisayar">
<OPTION
VALUE="En büyük">Macintosh
<OPTION
VALUE="Mac'in Atasi">Amiga
<OPTION
VALUE="Mazohistlere">IBM Klonu
</SELECT>
Burada görülen unsurlardan, <SELECT> etiketinin içinde yer alan NAME="..." hanesi, asagida göreceginiz üzere, form unsurlarinin bilgi toplamakta kullanilan bütün unsurlarinda yer aliyor. Çünkü bu olmadan hangi haneye hangi bilginin girildigini anlamamiza imkan yok.
<OPTION VALUE="..."> etiketleri ise menüde yer alan seçenekleri tanimlamamiza yariyor. Burada etiketin içinde yer alan ifadeler, bize gönderilecek e-postada yer alacak bilgileri, saginda yer alan bilgiler ise sayfayi ziyaret edecek olanlarin görecegi kismi ifade ediyor. Bu etiketi, kullanmak istediginiz seçenek sayisi kadar tekrarlamak mümkün.
Web sayfasinda ayni anda görünmesini istediginiz seçenek sayisi birden fazla ise, <SELECT> etiketinin içine ekleyeceginiz bir SIZE=x ifadesi ile bunu saglayabilirsiniz. Burada, x yerine görünmesini istediginiz seçenek sayisini yazmaniz gerek.
Radyo dügmeleri
Kullanicinin seçecegi seçenekleri açilir menü yerine radyo dügmeleri ile seçmesini saglamak isterseniz, kullanmaniz gereken etiketler söyle:
Makinenizden
memnun musunuz?<BR>
<INPUT
TYPE="RADIO" NAME="Memnuniyet" VALUE="Memnun" CHECKED>Evet
<INPUT
TYPE="RADIO" NAME="Memnuniyet" VALUE="Orta">Eh iste!
<INPUT
TYPE="RADIO" NAME="Memnuniyet" VALUE="Degil">Hayir
Açilir menüde oldugu gibi, burada da etiketin içinde yer alan ifade size postalanacak olan degeri, saginda yer alan ise kullaniciya görüntülenecek olani ifade ediyor.
Burada dikkat edilmesi gereken püflerin ilki, seçeneklerden herhangi birinin önceden seçili olmasini isteyip istemediginiz ile ilgili. Eger bu tür bir tercihiniz varsa, ilgili seçenegin etiketinin içine CHECKED ifadesini yazmaniz yeterli. Bu durumda kullanici sayfaya baglandiginda seçeneklerden biri önceden isaretlenmis olacaktir. Ama kullanici baska bir seçenegin üzerine tikladigi anda yapilan seçim de degisecektir. [Bkz. Sekil 1.]
Ikinci püf ise kullanilan dügme adinin (yani NAME="..." hanesine yazilan bilginin) bütün seçeneklerde ayni olmasi gerektigi. Aksi takdirde kullaniciya ayni anda birden fazla seçenegi isaretleme imkani tanimis olursunuz. Oysa, radyo dügmeleri için bu, istenen bir durum degildir. Kullanicinin ayni anda birden fazla seçenek isaretleyebilmesini istiyorsaniz, bilgiyi toplamak için isaret kutusu kullanmalisiniz.
Unutmadan, seçenek satirlarin yanyana degil de alt alta dizilmesini istiyorsaniz, satirlarin sonunda <BR> veya <P> etiketlerini kullanmaniz gerektigini de hatirlatalim.
Isaret kutulari
Sayfanizi ziyarete gelen kisinin birden fazla seçenek isaretleyebilecegi bir kisim tercihler belirtmesini istiyorsaniz, kullanacaginiz etiketler söyle olacaktir:
Hobileriniz?<BR>
<INPUT
TYPE="CHECKBOX" NAME="Hobiler" VALUE="Sinema">Sinema <BR>
<INPUT
TYPE="CHECKBOX" NAME="Hobiler" VALUE="Tiyatro">Tiyatro <BR>
<INPUT
TYPE="CHECKBOX" NAME="Hobiler" VALUE="Muzik">Muzik <P>
Buradaki kurallar da Radyo Dügmesindekilerle benzerlik gösteriyor. Söyle ki: önceden seçili olmasini istediginiz seçenekler için, etiketin içine bir CHECKED ifadesi ekliyorsunuz.
Dügme adi yine bütün seçenekler için ayni olmali. Isaret kutularinin temel kullanim alani birden fazla seçenegin ayni anda seçilebilmesi olduguna göre bu kurala ne gerek var diye düsünebilirsiniz. Formlarda farkli adi olan her bilgi giris unsuru, bir anketin farkli bir sorusu gibi degerlendirilir. Dolayisiyla, burada farkli bir isim kullandiginiz takdirde, isaretlenecek seçenekler de farkli bir sorunun cevaplari gibi algilanir.
Bilgi satirlari
Sayfaniz araciligiyla toplamak istediginiz bilgilerin bir kismi tek satirla ifade edilebilecek türden ise bunun için
Adiniz
Soyadiniz:<BR>
<INPUT
TYPE="TEXT" NAME="Kimmis?" SIZE=30 MAXLENGTH=25><P>
örnegindeki gibi bir kod yazabilirsiniz. Burada etiketin içinde yer alan SIZE ve MAXLENTH ifadelerini kullanmak sart degil. Bunlarin ilki, metin girisi için olusturulacak satirin uzunlugunu ikincisi ise bu satirin içine yazilabilecek bilginin en fazla kaç karakter olabilecegini ifade ediyor.
Bu tür alanlarin içinde bir kisim bilgilerin önceden yer almasini istiyorsaniz, bu durumda etiketin içine bir de VALUE="..." degeri eklemeniz gerekiyor. Örnegin, anketimizde kisilerin web adreslerini de sordugumuzu varsayalim. Bu durumda
Web
adresiniz:<BR>
<INPUT
TYPE="TEXT" NAME="Adresi" VALUE="http://"><P>
gibi bir kod kullandiginizda, http:// ifadesi metin alaninin içine önceden yazilmis olacaktir. [Bkz. Sekil 2.]
Sifreli bilgi satirlari
Kullanicinin girecegi bilginin etrafindakilerce görülmemesi gerektigi, örnegin bir sifre bildirmesi gerektigi durumlarda, form üzerine yazigi bilginin ekrana yansimamasi, bunun yerine bastigi her karakter için ekranda bir yildiz veya mermi (bullet) görüntülenmesi gereken durumlar olabilir. Bu durumda kullanilacak kod söyledir:
Bize
etmek istediginiz kufur:<BR>
<INPUT
TYPE="PASSWORD" NAME="BenDeSenin"><P>
Burada dikkat edilmesi gereken nokta, ekranda görülecek sifrelemenin yalnizca görsel oldugu. Yani gönderilecek e-posta içinde sifreleme olmayacagi. Bu nedenle bu tür bir bilgi girisi, bilgiyi gerçek anlamda gizli hale getirmez, yalnizca formu dolduranin etrafindaki merakli gözlerden korumus olur. Dolayisiyla bu islem, güvenli (secure) sitelerin yerine geçmez. Çünkü güvenli siteler bilgiyi gönderirken de sifreleyerek gönderir.
Metin alanlari
Sayfanizi ziyaret eden kisinin size iletmesini istediginiz bilgiler uzunca bir yer kaplayacak cinsten ise tek satirlik bilgi giris alani yerine daha büyücek bir metin giris alani tanimlamaniz gerekebilir. Bu durumda,
Diger
Yorumlariniz:<BR>
<TEXTAREA
NAME="Yorumlar" ROWS=5 COLS=30 WRAP="VIRTUAL">
Yorumlariniz
bizim icin onemli. </TEXTAREA><P>
Türünden bir kod kullanabilirsiniz. Burada ROWS=xx ve COLS=xx ifadeleri, açilacak olan metin kutusunun satir ve sütun cinsinden büyüklügünü belirtmek için kullaniliyor. Bu unsurlarin kullanilmasi zorunlu. <TEXTAREA> ... </TEXTAREA> etiketleri arasina yazacaginiz metin, yukarida Web adresiyle ilgili bilgi giris satirinda oldugu gibi, metin alaninin içine önceden yazilmis olacaktir.
Burada kullanilan WRAP="VIRTUAL" ifadesi yalnizca Netscape 2.0 veya daha yeni sürüm bir web tarayicida ise yarar ve kullanici tarafindan sözkonusu alana yazilan metin için kelime sarma fonksiyonu uygulanmasini saglar. Yani kutuya yazilan metin, görünen kisma sigmadigi takdirde, sigmayan kelime (kelime islem programlarinda oldugu gibi) alt satira kaydirilir. [Bkz. Sekil 3.]
Bu unsurun kullanilmadigi metin kutularinda, yazilan metin kutunun sinirlarini astigi anda metin yana dogru kaymaya baslar ve ekranda yalnizca COLS=xx ifadesiyle tanimlanan kadarlik bir metnin görüntülenmesine izin verilir. VIRTUAL ifadesi ise kelime sarma fonksiyonunun yalnizca kullanicinin ekraninda uygulanacagini, gönderilen metnin kesintisiz postalanacagini belirtir. Eger size gelecek metnin de fiilen kelime sarma fonksiyonundan geçirilmis olmasini istiyorsaniz, bu durumda bu ifadeyi WRAP="PHYSICAL" seklinde kullanmaniz gerekir.
Gönder ve iptal dügmeleri
Istedigimiz bilgileri topladigimiza göre sira geldi kullanicinin bunu bize postalamasina. Ama insanlarin hata yapma ve son anda göndermekten vazgeçip belki yeni bastan baslamak isteyebilecegi ihtimalini gözönüne alarak önce bir iptal dügmesi yaratalim: Bunun için kullanacagimiz etiket söyle:
<INPUT TYPE="RESET" VALUE="Iptal">
Formu postalamak için kullanilacak etiket ise:
<INPUT TYPE="SUBMIT" VALUE="Gonder">
seklinde. Burada VALUE="Gonder" veya VALUE="Iptal" unsurlarinda dilerseniz baska sözcükler de kullanabilirsiniz. Örnegin "Iptal" yerine "Vazgec", "Gonder" yerine "Postala" gibi farkli ifadeler kullanma seçeneginiz her zaman mevcut.
Sonuçlari görmek
Buraya kadar anlattiklarimizin hepsini içeren bir web sayfasi hazirlayip bunu kendi makinenizde yüklü web tarayicida görüntüleyebilirsiniz. Dügmelerin ve metin alanlarinin hepsinin degerlerini degistirerek denemeler yapabilirsiniz. Bunlarin bir tek istisnasi var: "Gönder" dügmesi. Çünkü bu dügmenin çalismasi için öncelikle internete bagli olmaniz, web tarayicinizda e-posta gönderme yeteneginin bulunmasi ve gerekli ayarlarin yapilmis olmasi gerekiyor. eger bu sartlari saglayabiliyorsaniz, hazirladiginiz sayfayi test etmek için herhangi bir web sunucusuna ihtiyaciniz yok. Önce servis saglayiciniza baglanin. Hazirladiginiz sayfayi kendi makineniz üzerinde web tarayicinizi kullanarak açin. Istediginiz örnek bilgileri ilgili alanlara girin. Sonra da "Gönder" dügmesine basip formu postalayin. Tarayiciniz (büyük ihtimalle) kredi karti ve benzeri gizli bilgileri e-posta yoluyla göndermemeniz için sizi uyaracaktir. Bu uyari kutusunu OK'lerseniz, form, kodunda tanimladiginiz adrese postalanacaktir.
Burada kendi adresinizi tanimladiysaniz, e-posta sunucunuzdan yeni gelen mesajlarinizi alip sonucu inceleyebilirsiniz. Form ile postalanan bilgi bir mesaj eki olarak gelebilir. Benim örnekteki sayfadan gönderdigim "Form posted from Mozilla" adinda bir mesaj eki olarak geldi. Açikçasi ilk anda bu dosyayi açacak programi bulmakta zorlandim. MacOS'un önerdigi programlarin hiç biri bu dosyayi açabilecek türden degildi. Ama BBEdit veya MSWord gibi her dosyayi açabilecek bir program ile asagidaki metne ulasabildim (Sekil 3'teki web sayfasinda görünenler ile postadan çikan metin arasindaki farklara dikkat edin):
Bilgisayar=Mazosistlere & Memnuniyet=Degil & Hobiler=Tiyatro & Kimmis%3F=Adamin+Biri & Adresi=http%3A%2F%2Fwww.sanane.com.tr & BenDeSenin=Gozunu+seveyim. & Yorumlar=Yorumlariniz+bizim+icin+onemli. ++++Madem+oyle+neden+bu+kutunun+bir+bucuk+satirini+kendiniz+isgal+ettiniz+ki%3F+Fazla+bir+sey+yazamayalim+diye+mi%3F
Burada gördügünüz %3F, soru isareti; %3A, iki nokta üstüste; %2F, bölü isareti anlamina geliyor. Neden böyle derseniz, Internet üzerinde Türkçe karakter kullanilamamasi ile ayni sebepten derim. Bir gün bu konuya da deginecegim insallah.
Örneklerin Kodu
<HTML>
<HEAD>
<TITLE>Form
Ornegi</TITLE>
</HEAD>
<BODY
BGCOLOR="RED">
<FORM
METHOD=POST ACTION="MAILTO:bataman@marun.edu.tr">
Kullandiginiz
bilgisayarin turu: <BR>
<SELECT
NAME="Bilgisayar">
<OPTION
VALUE="En büyük">Macintosh
<OPTION
VALUE="Mac'in Atasi">Amiga
<OPTION
VALUE="Mazosistlere">IBM Klonu
</SELECT><P>
Makinenizden
memnun musunuz?<BR>
<INPUT
TYPE="RADIO" NAME="Memnuniyet" VALUE="Memnun" CHECKED>Evet
<INPUT
TYPE="RADIO" NAME="Memnuniyet" VALUE="Orta">Eh iste!
<INPUT
TYPE="RADIO" NAME="Memnuniyet" VALUE="Degil">Hayir<P>
Hobileriniz?<BR>
<INPUT
TYPE="CHECKBOX" NAME="Hobiler" VALUE="Sinema">Sinema <BR>
<INPUT
TYPE="CHECKBOX" NAME="Hobiler" VALUE="Tiyatro">Tiyatro <BR>
<INPUT
TYPE="CHECKBOX" NAME="Hobiler" VALUE="Muzik">Muzik <P>
Adiniz
Soyadiniz:<BR>
<INPUT
TYPE="TEXT" NAME="Kimmis?"><P>
Web
adresiniz:<BR>
<INPUT
TYPE="TEXT" NAME="Adresi" SIZE=30 VALUE="http://"><P>
Bize
etmek istediginiz kufur:<BR>
<INPUT
TYPE="PASSWORD" NAME="BenDeSenin" SIZE=30><P>
Diger
Yorumlariniz:<BR>
<TEXTAREA
NAME="Yorumlar" ROWS=5 COLS=30 WRAP="VIRTUAL">Yorumlariniz bizim icin
onemli. </TEXTAREA><P>
<INPUT
TYPE="SUBMIT" VALUE="Gonder">
<INPUT
TYPE="RESET" VALUE="Iptal">
</FORM>
</BODY></HTML>
Go to page: Introduction | Contact | Education | Employment | Projects | Books | Articles | Papers | Interests | MWArticles | Hobbies | Miscellaneous | Photos
In Narratus Vitae, Go to page: Introduction | Archives | Records Management | Business Management | Computers | Research | Publishing | Teaching | History | Public Relations | Medicine | Hobbies | Disaster Preparedness |