Tek Derste FrontPage

Albert Einstein

Byte Eğitim Dizisi’nde yeralan Internet Tasarım Rehberi ve Bir Web Sitesi Kuralım kitapçıkları, kaç okuru site sahibi olmaya teşvik etti, bilemem. Ama o kitapçıkları okuyanlardan o kadar çok elektronik mektup aldım ki, anlatamam. Bu mektupların çoğunun ortak noktası, bilgisayar kullanımıyla ilgili ortak sorundan farklı değildi: Bilgisayar mühendisi ve programcı olmadan nasıl site kurarım; sayfalarımı en kolay şekilde nasıl oluştururum?

Gerçekten, bilgisayar mühendislerinin, programcıların (ve özellikle bilgisayar yüksek öğrenimi yapan bazı kişilerin) gözden kaçırdıkları veya kabul etmekten kaçındıkları nokta, PC’nin aracı olmaksızın, beyin cerrahı veya roket tasarımcısı eğitimi görmeden kullanılmak üzere geliştirilmiş bulunduğu gerçeğidir. Web de öyle. Eğer bugün bilgisayar ağları-arası ağ, gerçekten bütün dünyayı kapladı ve herkes her türlü bilgiye kolayca ulaşabiliyorsa, Web gerçekten en büyük eşitleyici ve en etkin demokratikleştirme aracı olabildi ise, bunu Web’de alan açma (site kurma) işleminin kolaylığına borçluyuz.

Bilgişlem ne kadar kolaylaşırsa, kişilerin bilgilenmesi o kadar kolaylaşır; Web sitesi sayısı ne kadar artarsa, kişilerin ulaştığı bilgi miktarı o kadar artar. Nasıl artık bilgisayarı etkin biçimde kullanmaya başlamak için, 20 sayfalık bir Windows el kitabı yeterli ise Web sitesi kurmak da o kadar kolay olmalı. Evet HTML, Web’in ortak dilidir ve HTML sayesinde, PC’mizle veya Macintosh’umuzla, farklı işletim sistemlerine, farklı dosya sistemlerine, farklı ağ protokollerine sahip bilgisayar-ağları arasında adeta cirit atıyoruz! Fakat Web sitesi oluşturmak ve bu siteyi meydana getiren HTML belgelerini, yani sayfalarımızı, bir Internet Site Hizmeti Sunucusu’nun ücretsiz verdiği alana yerleştirmek için bile HTML uzmanı olmak zorunluk olmamalı!

Piyasada bir çok HTML Editörü var. Basit bir kelime-işlem yazılımına benzeyen bu programların bir kısmı kullanıcının bir ölçüde HTML bilmesini gerektiriyor. Bir kısmı, masaüstü yayıncılık programı gibi, kullanıcının ekranda “sayfa” haline birleşecek yazı ve grafik unsurları arzu ettiği bir tasarımla bir araya getirmesini sağlıyor; sonra bu tasarıma dayanan HTML kodunu kendisi yazıyor. Yine bu programların bir kısmı sadece sitenin kullanıcının kendi sabit diskinde oluşmasını sağlamakla kalmıyor; bu dosyaların siteye Web’de ev sahipliği yapacak firmanın bilgisayarına aktarılmasına da yardımcı oluyor.

Fakat bu programların büyük bir bölümü, sitenin ziyaretçilerle etkileşmesi için gerekli unsurları belirlemeyi ve bu unsurları Web’e yerleştirmeyi site sahibine bırakıyor. Diyelim ki sitenizde bir form bulunsun ve ziyaretçileriniz bu formu doldurarak, sizden bir şeyler istesinler, bir ziyaretçi defterine kayıtlarını yaptırsınlar, veya sitenizle ilgili görüşlerini bize iletsinler istiyorsunuz. Bu tür bir etkileşme sağlayabilmek için, formunuzun derleyeceği bilgileri sunacağı bir program yazmanız gerektirir. İşte yukarıdan beri söylemek istediğim bu: öyle bir program, öyle bir araç olmalı ki, “programcı” olmadan istediğim gibi Web sitesi sahibi olmamı sağlasın!

Bu tür programlar da var. Bu kitapçığın konusu olan Microsoft FrontPage, bu tür programlardan sadece biri. Başka firmaların da FrontPage’in sağladığı imkanları sağlayan, kullanımı FrontPage kadar kolay programları bulunuyor. Sizin yerinize “program yazan” Web sitesi hazırlama programlarının sırrı, bu tür kolaylıkları, sizin değil, sitenize ev sahipliği yapacak firmanın bilgisayarında, daha doğru ifadesiyle Web Server’da yapmalarıdır. Sözünü ettiğimiz programlar bunu Server Extensions denen ek programlarla yaparlar. Başkalarının sitelerine ev sahipliği yapan şirketlerin “Şu, şu imkanı da veririz!” diyerek müşteri çekmeye çalıştıkları ilanları incelersiniz, çoğunun sitelerinin “FrontPage uyumlu olduğunu” belirttiklerini göreceksiniz. Bir bakıma FrontPage, amatör Webcilerin ücretsiz edindikleri sitelerine, profesyonel Webcilerin milyonlar ödeyerek yazdırdıkları programları kolayca koymalarını sağlayan ortak araç haline geldi.

FrontPage’in bu denli ortak araç haline gelmesinin tek nedeni, etkileşme sağlayan Server Extension’larının site evsahibi firmalar tarafından kabul görmesi değil. FrontPage, aynı zamanda, tek kelime HTML bilmeden son derece profesyonel görünümlü sayfalar hazırlamaya imkan veren programlardan biri.

Internet’te çok sayıda ücretsiz HTML editörü bulabilirsiniz. FrontPage ise ancak satın alarak edinebileceğiniz bir program. FrontPage’e ödeyeceğiniz ücret, herhalde HTML ve programlama dilleri bilmeden Internet’te, veya şirketinizin dahili İnternet’i diyebileceğimiz Intranet’te, profesyonel görünümlü ve etkileşmeli Web sitesi sahibi olmanın bedeli olsa gerek!

Not:

Bu kitapçıkta, Internet kullanımı, Web sitesi, bir sitenin yapı taşları olan HTML sayfaları hakkında temel bilgilerin bilindiğini varsayıyorum. Örneğin Web sayfalarının uzatması “.htm” veya “.html” şeklinde bir düz yazı dosyası olduğunu ve içinde “<” ve “>” şeklindeki işaretlmer içine alınmış kodlar, kodların arasında da Internet ziyaretçinizin Web Browser programında görüntülenecek metinler olduğunu bilmeniz gerekir. Bu alanda yardıma ihtiyacınız varsa, en azından genel bir bilgi edinmek zorunda iseniz, amacıyla Byte Eğitim Dizisi’nde Ekim 1998’de yayınlanan Internet Tasarım Rehberi ile Kasım 1998’de yayınlanan Bir Web Sitesi Kuralım adlı kitapçıklara başvurabilirsiniz. Hiç değilse bu kitapçıkların Internet’i tanıtan ve Internet Sitesi hakkında bilgi veren bölümlerini okumanız yeterli. Bu kitapçıkta iddiamız, bir kelime bile HTML bilmeden Web sitesi yapmak olduğuna göre, en azından Web sitesinin ne olduğu hakkında bilginiz bulunması yerinde olur.

Bu kitapçıkta, FrontPage’in Windows ortamındaki kullanım özelliklerinden söz edeceğiz; ancak FrontPage’in Macintosh sürümü de bulunmaktadır.

Bu kitapçıkta alıştırma amacıyla birlikte oluşturacağımız sitenin dosyalarını http://www.pcworld.com.tr adresinde bulabilirsiniz. Bu dosyaları kendi bilgisayarınızda geçici bir dizine koyun. Daha sonra dersler sırasında yeri geldiğinde kopyalayacağınız yeri belirteceğiz.

Teşekkür:

Murat Cankurtaran (mucan@atlas.net.tr), özellikle genç Internet meraklılarının, site oluşturma konusunda duygu, düşünce ve tutumlarını aktararak, bu kitapçığa ışık tutttu. Murat’a teşekkür ederim.

Bu kitapçıkta birlikte bir site oluşturacağız. Fakat sizden önce bu siteyi Bircan Hancı (bircan_h@yahoo.com) birlikte oluşturduk. Bircan, özellikle bedava site alanı bulma işini sanat haline getirmiş bir arkadaş; yarım saatte 10 site açabilir. Ona ait sitelerden birinde örnek sayfaların nasıl işlediğini birlikte sınadık. Değerli katkılarından dolayı Bircan’a teşekkürü borç bilirim.

Hataları bana ait olmakla birlikte, bu kitapçığın ve örnek sitenin yayına hazırlanmasında asıl yük PC World ekibine aittir. Onlara olmasa zaten hiç bir şey olmazdı. Hepsine şükran borçluyum.

Ders 1: Sitenizi Planlayın

Internet’e veya Intranet’te Web sitesi sahibi olmadan önce yapılacak bir çok iş var. Bir kere siteniz Internet’te yeralacak ve World Wide Web (WWW) yoluyla herkese açık olacaksa, bu imkanı size sağlayacak bir evsahibi bulmanız gerekir. Siteniz, şirketinizin Yerel Alan Ağı’nda (LAN) Server görevi yapan bir bilgisayarda duracak ve sadece LAN’a erişimi olanların hizmetine sunulacaksa, sistem operatörü ile uzun uzun görüşmeler yapmak zorundasınız! Bir Web sitesinin, Internet’te mi, Intranet’te mi yer aldığı sitenin tasarımcısı açısından hemen hemen hiç bir farka sahip değildir. Yeter ki sitenize bir ev sahibi bulun: ister Internet’te ister Intranet’te. Biri dünya, diğeri şirket çapında, ama sonuç itibariyle her ikisinin de adı Web Sitesi! Ve her ikisi de aynı şekilde tasarlanır ve oluşturulur.

İşte size iki altın kelime: Tasarlama ve Oluşturma.

Bilgisayarın başına oturmadan önce, babadan kalma yönteme başvurarak, elinize kağıdı kalemi alıp, iyi bir planlama yapmak zorundasınız. Dolayısıyla bu bölümde önce Web Sitesi nasıl planlanır sorusuna cevap arayacağız. Bunu yapmadan site oluşturmaya kalkmak, nereye gideceğini planlamadan otomobile binip motoru çalıştırmaya benzer.

Web Sitesi’nin Amacı

Site planlaması, bütün iletişim araçlarında olduğu gibi, amacın belirlenmesiyle başlar. Sitenizin amacını belirlemek için şu sorulara cevap bulmalısınız:

§  Bu siteyi neden oluşturuyorum? Sitemi ziyaret edip, sayfalarımı görecek olanlar ne öğrenecekler? Ne elde etmiş olacaklar?

Bu soruya vereceğiniz cevap, sitenizin birinci amacını belirleyecektir. Sitenizi gerçekten kişisel bir kararla, yani bir ticaret kuruluşu, bir dernek veya benzeri bir kuruluş için değil de sadece kendi zevkiniz için yapıyorsanız, bu sorunun cevabını siz vereceksiniz. Siteniz bir gruba, bir şirkete, bir kuruma ait olacak ise, bu sorunun cevabı muhtemelen grubu, şirketi veya kurumu yöneten kişi veya kişiler tarafından verilecektir. Siz sitenin sadece mimarı iseniz, bu sorunun cevabını sitenin sahibinden mutlaka almalısınız. Bu sorunun cevabı sitenin içeriğinin ana hatlarını belirler.

§  Hedef kitle nedir? Bu siteyi ziyaret etmesini istediğimiz kişileri nasıl tanımlayabilirim.

Bu sorunun cevabı sitenizin içeriğinin özelliklerini ve sunuluş tarzını, başka bir deyişle uslubuna belirler. Yine, siteniz tamamen kişisel ise, sorunun cevabını siz vereceksiniz; site grupsal, örgütsel veya kurumsal ise, yetkililerden alacaksınız. Bir müzik sitesi, gençlere yönelik olabilir; herkese yöneli olabilir; türkü sevenlere yönelik olabilir; pop müzik sevenlere yönelik olabilir. Hedef olarak seçtiğiniz kitle, içerik olarak sunacağınız müziğin türünü de belirler; hedef kitleyi çekecek unsurlara yer vermeniz mümkün olur. Bu kitlenin zevkleri, ihtiyaçları nelerdir? Bunlara sitenizde nasıl hitabedebilirsiniz?

§  Sitenizde ne tür bilgiler bulunacak? Ne tür bilgiler bulunmayacak?

Özellikle kurumsal nitelikteki sitelerde, yer alacak bilgiler kadar yer almayacak bilgilerin de belirlenmesi şarttır. Sitenizde yer alacak bilgilerin türü belirlendikten sonra, bu bilgilerin derlenmesi sorunu vardır. Yine, kurumsal nitelikteki sitelerde yer alacak bilgilerin birara getirilmesi ve tasarımcı olarak size toplu halde verilmesi gerekir. İster siz derleyin, isterse başka bir birim versin, tasarımcı olarak elinize gelen bilgilerin doğruluğunu tayin etmeniz gerekir. Siteniz tamamen size ait ise, yervereceğiniz bilgileri en az iki kaynaktan kontrol edin. Buna gazetecilikte iki kaynak kuralı denir. Bir örgüt veya kurumun sitesine girecek bilgilerin doğruluğunu tayin eden ayrı bir birim bulunabilir.

§  Ziyaretçilerden ne tür bilgiler isteyeceksiniz ve bu bilgiler ne olacak?

Web, iki yönlü bir trafik gibidir; bir Web sitesi hem bilgi verir, hem de bilgi alır. Alınacak bilgiler bir form yoluyla derlenebileceği gibi, ziyaretçinin bilgisayarına Çerez (Cookie) göndermek ve bu kişinin sitenizi yeniden ziyareti halinde Çerez’deki bilgileri almak suretiyle de olabilir. Form veya Çerez yoluna başvurmasanız bile, bir ziyaretçinin sitenize bağlanması halinde, Web sitenize ev sahipliği yapan Web Server, isterseniz size bu ziyaretçi hakkında bir çok bilgiler sunabilir. Ziyaretçileriniz hakkında neleri bilmek istiyorsunuz? Bu bilgileri nasıl işlemek, ya da bu bilgilerden nasıl yararlanmak istiyorsunuz? Bu soruların cevabı, sitenizin oluşumunda ve gelişmesinde önemli rol oynayabilir.

§  Sitenize ne kadar kaynak ayırabilirsiniz?

Bir site ne kadar büyükse, o kadar çok zaman ve hatta para harcamak gerekir. Sayfalarınızın durduğu ve Internet’e açıldığı Web Server’daki alan için para ödüyor olabilirsiniz; ödemiyor olabilirsiniz. Ücretsiz ev sahipliği yapan firmalar genellikle sınırlı bir alan sağlarlar ve sınırlı ziyaretçiye izin verirler. Ücret alan ev sahipleri ise bu ücreti alanın, sundukları hizmetin ve ziyaretçilerin sayısıyla belirlerler. Siteniz, ücretsiz bir Server’da bile bulunsa, içeriğin hazırlanması için gerekli programları (grafik veya multimedya işleme programları) satın almanız gerekir. İçerik olarak kullanacağınız malzemenin tümü yayın hakları bakımından ücretsiz edinilebilecek unsurlar olsa bile, aralarında yazılı izin gerektirenler olabilir. Bu yazıların yazılması, gönderilmesi ve takibi zaman ve dikkat ister. Şarkı sözlerinin şiir gibi yayınlanması bile “önceden yazılı izin alınmasına” tabi olabilir. Bu bakımdan sitenizin içerik bakımından genişliğini, içerik derleme ve bazılarının kamuoyuna sunulması için gerekli izinlerin alınması işine ne kadar zaman, enerji ve para ayıracağınız tayin edecektir. Siteniz kişisel değil de, bir şirkete veya kuruma ait ise içeriğin yayınında şirket veya kurum açısından sakınca olmadığını belirlemek için malî danışman, hukukçu ve diğer uzmanların onayı gerekebilir.

Şimdi bu soruları burada birlikte yapacağımız site açısından cevaplayalım:

Amatör fotoğrafçılık konusunda bir site yapacağız ve sitemizin amacı, fotoğrafçılık konusundaki merakımızı diğer amatör fotoğrafçılarla paylaşmak, bildiklerimizi onlara aktarmak ve ziyaretçilerimize fotoğrafçılık sevgisi aşılamak olacak. Hedef ziyaretçi kitlemiz, konuya ilgi gösteren yaşlı-genç herkes olacak. Ziyaretçilere herşeyden önce kendi fotoğraflarımızdan örnekler sunacağız. Ziyaretçilerimiz, sitemizde fotoğrafçılık konusunda genel ve uzmanlık konusu bilgiler bulacaklar; onlara İstanbul merkez olmak üzere, bütün yurttan fotoğraf sergileri, yarışmalar, uyarılar, açıklamalar konusunda bilgi sunacağız. Ayrıca sitemizde, resmî-özel, fotoğrafçılıkla ilgili diğer sitelere bağlantılar bulunacak; edinebilirsek, fotoğrafçılık eğitimi konusunda hizmet veren kişi, dernek ve kuruluşların listelerini de vermek istiyoruz. Bununla birlikte sitemizin amacı kendi fotoğraflarımızı pazarlamak olmayacak ve başka firmalara ilişkin ticarî bilgiler bulunmayacak. Yeni ürünler hakkında bilgi verirken, satın alınabilecek yerleri ve edinebilmişsek fiyatlarını ziyaretçilerimize duyurabiliriz. Ama sitemizde kimsenin reklamını yapmak istemiyoruz! Sitemizi ilerde paralı bir Server’a aktarabilir ve genişletebilirsek, belki bazı toptancı ve perakendecilerle anlaşarak, reklam alabiliriz. Sitemize ek olarak bir de ayda bir elektronik posta yoluyla bir bülten yayınlamayı düşünüyoruz. Bu bültenin amacı bizim gibi amatör fotoğrafçılara aylık olayların bir takvimini sunmak ve bu arada sitemizin varlığını bir kere daha duyurmak olacak. Bu bülteni gönderebileceğimiz kişilerin bir listesini oluşturmak için sitemize bir form koyarak, ziyaretçilerimizden isim ve elektronik posta adreslerini isteyeceğiz. Formda, ziyaretçilerimizin sitemiz hakkındaki görüşlerini ve önerilerini yazabilecekleri bir kutu bulunursa, buradan elde edeceğimiz bilgilerle sitemizin içeriğinde düzeltmeler yapabiliriz. Yani anlayacağınız, şimdilik bu siteye verebileceğimiz tek şey, zaman! O da çok değil.

Sitenin Türünü Doğru Belirleyin

Intenet’i dolaşmayı adet edinmiş iseniz, ziyaret ettiğiniz yerlerin ana çizgilerle ikiye ayrıldığını görmüş olmalısınız: kişisel ve kurumsal. Kişisel siteler, adının da belirttiği gibi kişilerin kendi zevklerine, kendi ilgi alanlarına göre oluşturdukları, sonuç itibariyle resmî hiç bir niteliği olmayan, dolayısıyla içindeki bilgilerin seçimi, derlenmesi veya sunuluşunda sorumluluk taşımayan sitelerdir. Fakat siz de bilirsiniz ki, öyle kişisel siteler vardır ki, bir çok kurumsal siteye değişmezsiniz. Gerek tasarımı, gerekse içerdiği bilgilerin doğruluğu bakımından bu sitelerin garantisi, sahibinin adıdır. Bu kişiyi tanıyor ve güveniyorsanız, sitesindeki bilgilere de güvenirsiniz. İkinci grupta ise daha çok profesyonel nitelikte, örgütsel veya kurumsal siteler bulunur. Bu tür sitelerdeki bilgilerin seçimi, sunuluşu ve doğruluğu, site sahibi kurum veya kuruluşun sorumluluğundadır.

Sitelerin kişisel veya profesyonel oluşu, tasarımını da etkiler. Ziyaretçiler, profesyonel bir sitede, konunun uzmanı kişilerle ilgili haberler, bu kişilerin görüşleri, tavsiyeleri, ve benzeri bilgiler bulmak isterler. Kurum veya kuruluşların siteleri, hukukî açıdan da sorumluluğa sahip olabilir. Bu tür sitelerde verilen bilgilerin, yapılan duyuruların, ziyaretçilerin (genel anlamda kamuoyunun) hayatı üzerinde etkileri olabilir.

Bizim fotoğrafçılık sanatı ve tekniği ile ilişkimiz, amatör bir ilişkiden öteye gitmediğine göre, yapacağımız sitenin bu konuda faaliyet gösteren bir derneğin sitesinden farklı olacağı açıktır. Böyle bir derneğin sitesinde, bu konunun uzmanı, mesleği bu alana giren kişiler bilgi verir, soru cevaplar, tartışma yaparken, bizim sitemizde böyle uzmanlık konuları ve sayfaları bulunamaz. Vereceğimiz bilgilerin ve aktaracağımız duyuruların yetkili kaynağı olmadığımızı belirtmemiz yerinde olur. Bu hem bizi sorumluluktan kurtarır; hem de ziyaretçilerimiz üzerinde yanlış bir etki yapmamış (açıkça söylemek gerekirse, yalan söylememiş) oluruz.

O halde, planlama işinin ikinci bölümü olan sitenin niteliğini belirleme kararını verirken, sitemizin kişisel olacağını ifade ediyoruz.

Eş-dost sınırını aşacak mısınız?

Ulaşmak istediğimiz kitleyi iyi belirlemek zorundayız. Kişisel bir site, site sahibinin ilgilendiği konularda bilgisini, deneyimlerinden elde ettiği sonuçları, görüşlerini, hayatını “eş-dost” ile paylaşmasına yöneliktir. Gerçi bir site, Internet’te dünyaya açıldığı zaman, bu siteye erişebilecek kişileri belirlemek (siteye girmeyi parola ile sınırlamazsanız) mümkün değildir, ama bu tür sitelerin erişmek istediği kişiler sınırlıdır. Böyle bir siteye hergün yüzlerce yabancının bağlanıp, çocuğumuzun yaşgünü fotoğraflarını seyretmesini de beklemeyiz. Kişisel sitemizin varlığını duyurmak için göstereceğimiz çaba da sınırlı olur.

Buna karşılık profesyonel bir site, bir grubun, örgütün, firmanın ve kamu kurumunun bilgi paylaşma aracıdır; dolayısıyla sitenin hedefi, grubun, örgütün, firmanın veya kamu kurumunun faaliyet alanına giren kişilerdir. Hedef kitlenin doğru belirlenmesi demek, bu kitleye giren kişilerin beğenileri, tercihleri, Internet’te bulmak istedikleri gibi sorulara doğruya yakın cevaplar vermek demektir. Hedef olarak seçtiğimiz kitlenin bizim sitemizden beklediklerini doğru belirleyemezsek, büyük bir ihtimalle bu kişilere ulaşmamız veya bu kişilerin sitemizi sık sık ziyaret etmeleri mümkün olmayacaktır. Oysa profesyonel veya kurumsal bir sitenin başlıca amaçlarından biri de ziyaretçi listesinin sürekli genişlemesini sağlamaktır.

Eş-dost çevresini aşmak istiyorsak, kime ulaşmak istediğimizi ve bu kişilerin sitemizden ne beklediğini düşünmek ve tartışmak zorundayız. Aslında bu o kadar da zor değil. Herşeyden önce, Internet’te bizim sitemize benzer bir çok site bulabiliriz; onların sitelerini inceleyerek, neler yaptıklarını ve neyi, nasıl sunduklarını görebiliriz.

Sitenin İskeleti

Site planlama işinin kağıt üzerindeki birinci ve ikinci bölümü bitince sıra, yine kağıt üzerinde sitenin iskeleti dediğimiz, sayfalar ve bunların hangisinin hangisine bağlanacağını belirlemeye gelir. Birinci ve ikinci bölümdeki belirlemelerimiz, örneğin sitemizin ne kadar geniş, bilgilerin ne kadar kapsamlı olacağına ilişkin kararımız, bu noktada kağıda dökülecektir.

Internet sitelerini incelediğimiz zaman, genellikle tümünün Home Page, Endeks Sayfası, Splash Screen, Varsayılan Sayfa gibi adlarla anılan bir ana sayfası olduğunu görüyoruz. Bu, sitemizin vitrinidir. Ziyaretçilerimiz bu vitrine bakarak, beğendikleri bir şey görürlerse, bu sayfadaki bir bağlantıyı tıklayarak, içeri girerler.

Biz, ana sayfamıza gelen her ziyaretçinin, sitemizi geziş senaryosunu belirlemek zorundayız. “Şunu yapan sonra şunu yapsın. Bunu yapan daha sonra buraya gitsin!” şeklinde düşünerek, ziyaretçilerin atması muhtemel her adımı düşünerek, sayfalarımıza gereken bağlantıları koyarız.

Sitemizin çatısını, herşeyden önce, içerik belirler. Bir bilgisayar firmasının sitesinde, donanım ve yazılımlara ayrılan iki ana bölüm olabilir. Bir turizm şirketinin sitesinde, gezi planları, yer ayırtma formları, tur düzenlenen beldelerin tanıtımına ilişkin sayfalar bulunabilir. Bizim kişisel amatör fotoğrafçılık sitemizde şuna benzer bir akış planı izleyebiliriz:

<Akis plani01.tif>

Bu planda, ziyaretçilerimizin karşısına çıkacak ana sayfayı, dört sayfa halinde iki bölümün izlemesi öngörülüyor: bizim sağlayacağımız içerik (kendi fotoğraflarımızdan örnekler, fotoğraf teçhizatımız hakkında bilgiler), işimize yarayan ve başkalarıyla paylaşmakta yarar gördüğümüz bağlantılar (sergiler, yarışmalar ve ziyaretçilerimizin görmesini istediğimiz başka sitelerin adreslerini içeren bölüm) ve ziyaretçilerle ilişkiler sayfası (ziyaretçilerin sitemiz hakkında görüşlerini belirtmelerini ve elektronik mektup adreslerini bırakmalarını sağlayacağımız bir ziyaretçi defteri ve ziyaretçiler arasında karşılıklı haberleşmeye imkan veren bir Bülten Tahtası sayfası).

Bu aşamada sitede yer alacak her bir sayfanın içeriğini belirlememize gerek yok. Örneğin, Fotoğraf Örnekleri “sayfası” gerçekten kaç sayfa olacak, bilmiyoruz. Belki fotoğraf örneklerimizi, coğrafî bölgelere göre sayfalara bölsek daha iyi! Fotoğrafları konusuna göre (insan, doğa) veya türüne göre de (siyah/beyaz, renkli) bölümlere ayırabiliriz. Fakat buna karar vermek için henüz erken. Daha sitemize koyacağımız fotoğraf örneklerini bile seçmedik! Sitede yer alacak yazılar ortada yok.. Ne gibi yerlere bağlantılar vereceğimizi bilmiyoruz. Herşeyin bir sırası var!

Site Planını FrontPage’e Geçirmeden Önce

Microsoft FrontPage 98, iki ana programdan oluşur: FrontPage Editör (FrontPage Editor) ve FrontPage Gezgini (FrontPage Explorer). Editör, tek tek sayfalarınızı yapmakta kullanacağınız programdır; Explorer ise daha sonra Internet’e aktarılacak olan siteyi kendi sabit diskinizde oluşturmanızı sağlar.

FrontPage kurulurken, sabit diskinizde bir Kişisel Web Server (Personal Web Server) oluşturmuş olmalı. Sabit diskinizde Kişisel Web Server oluşturmak için aslında FrontPage gerekmiyor; isterseniz Windows 98 veya NT Workstation da sizin için bir kişisel Web Server kurabilir. FrontPage, isterseniz, bu Server’ı da kullanabilir.

“Kullanmak” ne demek? Biliyorsunuz, Web’de iki tür bilgisayar bulunur: Web ziyaretçilerinin bilgisayarları, ki buna teknik adıyla Client (müşteri, istemci) denir; ve ziyaretçilere Web sayfalarını sunan bilgisayarlar, ki bunlar da teknik adlarıyla Web Server diye anılırlar. FrontPage, Internet’e Server olarak açılmayacak da olsa, sizin sabit diskinizde bir kişisel Server kurarak, sayfalarınızı ve sayfalarınız arasındaki bağlantılarını, sanki Web’de imiş gibi, oluşturmanıza ve denetlemenize imkan sağlıyor. Bir siteyi bilgisayarınıza Kişisel Web Server kurmadan da oluşturabilirsiniz. FrontPage’in sadece Editör bölümünü kullanarak, sayfalarınızı yapar, içlerine metinlerinizi, grafiklerinizi, multimedya unsurlarınızı ve bağlantılarınızı koyarsınız. Bunları sabit disk üzerinde sınayabilirsiniz.

FrontPage’in Kişisel Web Server’ının, ilerde göreceğiz, sağlayacağı bir kolaylık, kendi sabit diskinizde, kendi kişisel Web Server’ınızda oluşturduğunuz siteyi, gerçek Web’e (sitenize evsahipliği yapacak firmanın Server’ına) aktarırken ortaya çıkar. Özellikle evsahibi firmanın gerçek Web Server programı FrontPage uyumlu ise, sabit diskinizdeki “site” gerçek Internet’e FrontPage tarafından aktarılır ve sitenizin güncelleştirme ve diğer işlerini FrontPage’i kullanarak yapabilirsiniz. Kendinize bir evsahibi seçerken buna dikkat etmiş ve evsahibiniz olacak firması sizin gibi müşterilerinin sitelerine FrontPage kolaylıkları sağlayan firmalardan arasından seçmiş olmalısınız!

Bununla birlikte evsahibi firmanın Web Server’ı FrontPage uyumlu değilse, yine de FrontPage Editör ile yapacağınız sayfaları, evsahibi firmanın arzu ettiği bir yöntemle (mesela CuteFTP veya benzeri bir dosya aktarma programı kullanarak) firmanın Server’ına gönderebilirsiniz.

Biz burada FrontPage’e sabit diskimizde bir Kişisel Web Server kurdurarak, sitemizi bu Server içinde oluşturacağız. FrontPage’i açtığınızda size mevcut bir siteyi mi açmak istediğinizi, yoksa yeni bir site mi oluşturmak istediğinizi soracaktır. Şimdi, FrontPage’i ilk kez çalıştırırken, yeni bir site oluşturmak istediğimizi belirtmemiz gerekir.

<FP0001.tif>

FrontPage, ilk kuruluşu sırasında varsayılan siteyi oluştururken veya daha sonra yeni bir Kişisel Web oluşturduğunuz zaman, sizden bir kullanıcı adı ve parolası isteyecektir. FrontPage, bu konuda son derece ciddîdir: ilk verdiğiniz isim ve parolayı vermedikçe, kendi bilgisayarınızda kendi oluşturduğunuz siteyi açamazsınız! (FrontPage, sizin siz olduğunu başka nasıl bilebilir!)

FrontPage’in kurulurken Varsayılan Web olarak kendiliğinden oluşturduğu site, bir ana sayfa ile üç bağlı sayfadan oluşur. FrontPage, site kurmayı kolaylaştırmak amacıyla, bilgisayarınıza, bir sitenin bütün sayfaları arasında görsel birlik sağlamak amacıyla “tema” adını verdiği bir dizi grafik dosyası ve stil oluşturur. Kullanıcı, sitesine bir “tema” seçtiği zaman, bütün sayfalarına bu temanın gerektirdiği görsel tarz veya tasarım ögeleri otomatik olarak uygulanır. Bunlara da sonra ayrıntılı olarak döneceğiz.

Bizim tasarlayacağımız sitenin planı, FrontPage’in varsayılan sitesine pek uymadığına göre, ilk diyalog kutusunda yeni Web oluşturulmasını istemeliydik; varsayılan Kişisel Web açık iken, File (Dosya) menüsünden New (Yeni) maddesini, onun açacağı listeden de FrontPage Web maddesini seçebiliriz.

Fakat bunu yapmadan önce, FrontPage Explorer’ın bölümlerini tanıyalım ve adlandıralım. Böylece ilerde birbirimizin ne dediğini daha iyi anlarız.

<FP0002.tif>

FrontPage Explorer, size sitenizi (ya da FrontPage’in terimi ile Kişisel Web’inizi) çeşitli farklı biçimlerde görme imkanı veriyor. Bunu Görünüm Seçme (View) çubuğunda arzu ettiğiniz görünüm türünü tıklayarak yapabilirsiniz. Burada Navigation (Keşif) görünümün seçilmiş olduğunu görüyorsunuz. Bu görünümde sitenin tümünü kuşbakışı görebilir; hangi sayfanın hangi sayfaya bağlantılı olduğunu (veya olmadığını) anlayabilirsiniz. FrontPage ilk açıldığında Folders (Klasör) görünümü seçer: sitenizdeki bütün klasörleri ve dosyaları burada Windows Gezgisi’nde olduğu gibi görebilirsiniz. All Files (Bütün Dosyalar) görünümünde ise seçili klasörün içindeki dosyaları görebilirsiniz. Hyperlinks (Bağlantılar) görünümünde, ana sayfanızdan aşağıya doğru bütün sayfalarınız ve sayfalardaki grafikler ve multimedia unsurları arasında kurduğunuz bağlantılar görüntülenir. Bu görünümü kullanarak daha sonra sitemizdeki bağlantıları kontrol edeceğiz ve kopuk bağlantıları arayacağız. Hyperlink Status (Bağlantıların Durumu) görünümünde ise sayfalarımıza koyduğumuz bütün bağlantıları toplu olarak görebilir ve hangisinin kopuk, hangisinin geçerli olduğunu inceleyebiliriz. Themes (Temalar) görünümünde ise FrontPage bize kurulurken sabit diskimizde oluşturduğu 54 ayrı “Site Teması”nı gösterecektir. Sitemize FrontPage’in hazır temalarından birini seçebiliriz; veya herşeye sıfırdan başlayıp, sayfalarımızın kişiliğini kendimiz belirleyebiliriz. “Site kişiliği” konusuna ikinci bölümde ayrıntılı değineceğiz. Tasks (Görevler) görünümü ise, özellikle bir ekip tarafından işbölümü ile geliştirilen sitelerde, yapılması gereken, yarım bırakılan işlerin bir listesini içerir. Grup halinde inşa edilen sitelerde, bu görünümden yararlanarak, kişiler veya ekipler nelerin tamamlanmasını istediklerini, nelerin tamamlandığını birbirlerine bildirebilirler ve işbirliğinin gelişmesini buradan takip edebilirler. Bu görünümden yararlanarak, kendi kendinize hatırlatma notları da oluşturabilirsiniz.

Kağıt üzerinde yaptığımız site iskeletini FrontPage’e geçirmeden önce bir soru soralım: “Site” veya “Web” dediğimiz ve örneğin Folders görünümünde gördüğümüz klasörler ve dosyalar sabit diskimizde nerede duruyor? Klasörlerin bulunduğu yer olarak FrontPage, Windows sisteminin kuruluş tarzına bağlı olarak, “http://........” şeklinde bir “adres” gösterecektir. Ben FrontPage’i, adı Server olan bir bilgisayara kurduğum için, (Bilgisayarınıza özellikle bir ağ ortamında ise isim vermek zorundasınız!) FrontPage, benim kişisel Web’imi Server adlı bir Server’da duruyormuş gibi göstermektedir: “http://server”. Bir Kişisel Web’in Web server ile ilişkisine, sitemizi gerçek Internet’e açmak üzere evsahibinin bilgisayarına aktarırken döneceğiz. Şimdilik sadece FrontPage’nin “http://server” diye adlandırdığı yerin sabit diskte, “FrontPage Webs” adlı bir klasörde “Contents” (İçerik) adlı bir alt-dizin olduğunu belirtelim:

<FP0003.tif>

FrontPage’in yanı sıra, örneğin Windows 98’e Kişisel Web Server, Web Tabanlı Kuruluş Yönetimi ve Web Yayım Sihirbazı bileşenlerini kurdurdu iseniz, sabit diskinizde “InetPub” adlı bir klasör ve içinde “wwwwroot” adlı bir alt-klasör bulunur.

<FP0004.tif>

Microsoft Kişisel Web Server’a aslında hiç ihtiyacınız yok. FrontPage’nin kendi Web’i, Microsoft Kişisel Web Server kadar kabiliyetli olmasa da sitemizi oluşturmak ve gerçek Web7e aktarmak için yeterli. Ama bu kitapçığı iyice hatmedip, Webcilik mesleğinde daha ileri aşamalara doğru harekete geçtiğinizde, örneğin ASP diye teknik tanışır ve bunu kendi Windows 98 sisteminizde nasıl uygulayabileceğiniz sorusunu kendi kendinize sormaya başlarsanız, cevabının Microsoft Kişisel Web Server programında yattığını ve Windows 98 CD’siyle ücretsiz edindiğiniz bu programın, eğitim amacıyla, 7 bin-8 bin Dolarlık Web Server programları ile boy ölçüşebilecek imkanları size sunduğunu hatırlayın. Microsoft Kişisel Web Server programını kurmak için, Windows 98 CD'nizi sürücüye yerleştirin; Başlat'ı ve Çalıştır'ı tıklayın. Çalıştır iletişim kutusunda x:\add-ons\pws\kur.exe yazın. x yerine CD sürücünüzün harfini yazın ve Tamam'ı tıklayın. Personal Web Server Kur'daki ayarları değiştirmenize gerek yok. Sabit diskinizde tam teşekküllü bir Web Server oluşacaktır.

<FP0005.tif>

FrontPage Web ile (c:\FrontPage Webs\Contents) Microsoft Kişisel Web Server Web’ini karıştırmamanız gerekir. FrontPage’i Microsoft Kişisel Web Server ile birlikte kullanmanız da mümkündür. Bu durumda Microsoft Kişisel Web Server’a, FrontPage Extensions eklemelerini yüklemeniz gerekir.

Biz bu kitapçıkta sayfalarımızı Microsoft Kişisel Web Server’ın Web’inde değil, FrontPage’in Web’inde oluşturacağız. Öylese, başlayalım şimdi bu sayfaları oluşturmaya: kağıt üzerinde tasarladığımız Web’i FrontPage aktaralım ve içini doldurmaya başlayalım.

İlk işimiz tabiî, FrontPage’in bizim için oluşturduğu Personal Web adlı site yerine kendi sitemizi açmak olacak. File menüsünden “Close FrontPage Web” (FrontPage Web’i Kapat) maddesini seçerseniz, FrontPage, yeni Web oluşturma ekranını açacaktır. Aynı işi, File menüsünden, New/FrontPage Web maddesini seçerek de yapabilirsiniz:

<FP0006.tif>

Yeni Web diyalog kutusunda kocaman 1 ve 2 rakamlarıyla işaretlenmiş iki bölüm göreceksiniz. Birinci bölümde, radyo düğmesi şekline sıralanan tercihleriniz şunlar:

1. Tek sayfalık bir Web oluşturabileceğiniz One Page Web;

2. FrontPage Editör (veya başka bir program) ile Site kapsamı dışında bağımsız (fakat bağlantılı) sayfalar haline oluşturduğunuz bir siteyi FrontPage Web’i olarak ithal edebileceğiniz Import an Existing Web;

3. FrontPage’in Sihirbaz veya Şablon yoluyla yardım edeceği tamamen yeni bir Web oluşturmanızı sağlayacağı From Wizard or Template seçeneği. Bu maddeyi seçerseniz, hemen altındaki kutuda bulanan Sihirbaz veya Şablonlardan birini seçebilirsiniz. (Corporate Presence/Kurumsal Varlık ve Discussion Web/Tartışma Web’i sihirbazları, yeni diyalog kutuları açacak ve sitenizin temelini hazırlamak için ek bilgiler isteyecektir. Customer Support Web/Müşteri İlişkileri Web’i, Personal Web/Kişisel Web ve Project Web/Proje Web’i, FrontPage’i tasarlayan uzmanların bu konulara uygun görükleri temalara dayanan site şablonlarına göre, gerekli tekmel sayfaları ve bağlantıları olan sayfalar oluşturacaktır.

Bir başka site oluşturma programını değil de FrontPage’i kullanmamazın sebeplerinden biri ile bu noktada karşı karşıya bulunuyoruz: Hazır Web sitesi. FrontPage bize sihirbazlar marifetiyle oluşturabileceğimiz iki tür Web sitesinin yanı sıra, 56 ayrı tema uygulanabilecek, beş temel site türü sunuyor:

Kurumsal Varlık Sitesi: FrontPage, bir kurumun ınternet sitesinde bulunması gereken Yenilikler, Mamüller ve Hizmetler gibi sayfalar, arama motoru, bilgi veya görüş bildirme formu, ve sitenin içindekileri belirten haritasını içeren sayfalardan hangisini istediğinizi, ana sayfada firmanızın görev anlayışı, profili, temas bilgileri gibi bilgilerin bulunup bulunmayacağını, sitenizde basın açıklamalarınıza, makale ve değerlendirme yazılarına yer verip vermeyeceğinizi, kaç mal ve kaç hizmet tanıtacağınıza, bunların fotoğraflarını verip vermeyeceğinize, formlarınızdan ele edeceğiniz bilgileri ne yapacağınıza, nasıl işleyeceğinize kadar sorarak, ve bize 56 tema arasından birini seçtirerek ortaya en az 13 sayfalık (en çok kaç sayfa olacağı kaç mamül ve hizmet tanıtmak istediğinize bağlı) bir site ve bu sayfaların yapıması için gerekli işbölümünün adımlarını gösteren bir görev listesi çıkartıyor. Bu sihirbaz kadar etkili Webmaster ve İdare Müdürü zor bulunur!

Tartışma Sitesi: Sihirbaz’ın sorduğu sorulara vereceğiniz cevaplarla, herkesin görüşünü ileteceği bir Sunuş formu, sitede lyer alan tartışma konuları ve her bir tartışma bağının içinde yer alan mesajların listesini veren İçindekiler sayfası, Cevap Bağları (Treads), Doğrulama Sayfası oluşturuyor; bu sayfaları, sizden alacağı cevaplara göre tartışma konularına göre bölümlüyor, tartışmaya kimlerin katılabileceği (varsayılan herkesin katılması), cevapların yeniden eskiye doğru veya eskiden yeniye doğru dizilmesi tercihlerinize göre sayfaların izinlerini tayin ediyor, biçimlendirmelerini yapıyor; tartışmaya katılmak istemeyen fakat başkalarının tartışmalarınnda arama yapmak isteyenler için bir arama sayfası oluşturuyor; yine 56 temadan birini seçmenizi sağlıyor. Sayfalarınız çerçeveli mi olacak? Çerçevelerde neler bulunacak? (Çerçeveli sayfa isterseniz, Browser’ı çerçeve teknolojisine uyumlu olmayanlar için bütün sayfalarınızın bir çerçevesiz türünü isteyin istemediğiniz de bu arada soruluyor.) Ortaya, İngilizce yazılmış bir sunuş ve davet yazısı, altında isteyenin tartışmaya katılma formunu seçeceği, isteyenin bütün sitenizde arama yapabileceği forma gitmesini sağlayan bağlantılar bulunan, (bu, sitenize ev sahipliği yapacak Web Server’da FrontPage Extensions ve Index Server varsa, işleyebilir) bir ana sayfa çıkıyor. Arama sonuçlarını ziyaretçinize ulaştıracak sayfa bile hazır! Tartışma uzadıkça, içindekiler listesi otomatik güncelleştiriliyor.

Müşteri İlişkileri Sitesi: Bu site bir şirketin müşterilerine yeni mal ve hizmetleri ile ilgili bilgiler sunması ve müşterilerinin taleplerini ve şikayetlerini iletmesi için gerekli temel sayfaları ve bağlantıları veriyor. Modern bir firmanın, müşterileri ile batılı anlamda ilişki kurması için gerekli bütün sayfalar ve bağlantılar düşünülerek hazırlanmış bu sayfalarda bütün yapacağınız neredeyse sadece kendi firmanızın adını, adresini, telefon ve faks numaralarını vermekten ibaret.

Kişisel Site: Internet’te sık gördüğünüz site sahibinin tamamen kendisiyle ilgili bilgiler sunduğu bir site. Ana sayfaya ek olarak site sahibinin ilgi konuları ve özel fotoğrafları ile ilgili iki sayfadan oluşuyor.

Boş Web: Adından da anlaşılacağı üzere, size içi boş bir site oluşturuyor. “İçi boş site” nasıl oluşturulur diye merak ediyorsanız; hemen belirtelim, içi boş bile olsa bir Web sitesinin içlerinde 20’ye yakın dosya bulunan (6’sı gizli) 13 klasörü ve gerçek Web Server programına kurulmuş FrontPage Extensions programlarının ilerde kullanmak isteyebilecekleri bilgi dosyaları vardır. İçi boş bir sitede, ana sayfa ile ana sayfanın bağlantı vereceği grafik ve multimedya dosyaları ve diğer sayfalar yoktur; ama bu unsurlar eklendiği anda çalışabilecek ve gerçek Web’e gönderilebilecek tam teşekküllü bir Web vardır.

Proje Sitesi: Firmaların kendi yerel alan ağlarında (LAN) kendi özel Internet’lerini (Intranet) oluşturmalarının giderek yayıldığı günümüzde, firma için projelerin gelişimine ilişkin işbirliği neden Web yoluyla yapılmasın? Bu site, bir firmaya veya örgüte, personelin veya mensuplarının süregiden projelerine ilişkin işbirliğini Internet’te veya Intranet’te yapmalarını sağlayan sayfaları hazırlıyor.

Microsoft, FrontPage’in kayıtlı kullanıcıları için sık sık yeni şablon ve temalar sunuyor. Bunların arasında öğrencilerin okulları için ortaklaşa hazırlayacakları bir Web sitesini, özellikle sivil toplum örgütleri düşünülerek hazırlanmış Grup Sitesi’ni, düğün, mezuniyet veya benzeri bir kişisel olayı konu alan Kişisel Olay Sitesi’ni, ve belirli bir proje çerçevesinde çalışan veya bir grubun üyesi olan ekibin kendilerini ve projelerini tanıtmak için kullanabilecekleri Takım Sitesi’ni sayabiliriz.

FrontPage, bu kutuda yapacağınız tercihlere göre sitenizin temelini oluşturacak klasörleri ve dosyaları oluşturacak, size sadece sayfaların içeriğini değiştirmek kalacaktır. Değiştirmek diyorum, çünkü FrontPage, ana sayfanızı ve temel bir kaç bağlantı sayfasını, varsayılan temaya uygun biçimde oluşturacak ve bağlantılarını kuracaktır. Birazdan göreceğiz, bize kalan sadece başlıkları ve metinleri değiştirmekten ibaret.

Asıl işimize başlamadan önce size bu seçeneklerin herbirini sırayla seçerek, FrontPage ile dört beş site oluşturmanızı tavsiye ederim. Bu siteler sabit diskinizde epey bir yer kaplayacaktır. Fakat her bir sitenin oluşumunu çeşitli görünümleri seçerek iyice incelemek, farklı site anlayışları hakkında size iyi bir fikir verecektir. Ayrıca FrontPage’in kendiliğinden oluşturduğu sayfaları da, herhangi bir görünümde sayfa simgesini iki kere tıklayarak Editör’de açabilir, FrontPage’in sayfa tasarım ilkelerini inceleyebilir; bağlantıların nasıl verildiğini, sayfa alanlarının nasıl kullanıldığını görebilirsiniz.

İncelemek amacıyla oluşturacağınız bir site açık iken, Tema görünümüne giderek, bu siteye farklı temalar kazandırın. Bu alıştırma, ikinci bölümde kendi sitemizi yaparken ele alacağımız Site Kişiliği konusuna hazırlık olacaktır.

Alıştırma amacıyla oluşturduğunuz siteleri silmek için, site açıkken, File menüsünden Delete FrontPage Web (Frontpage Web’i Sil) maddesini seçerek ve açılacak teyid kutusunda Evet’i tıklayarak siteyi tümüyle orntadan kaldırabilirsiniz. Fakat bence şu yol daha kazançlı sonuçlar verebilir:

1. Açık Web’i kapatın (File/Close FrontPage Web)

2. FrontPage, kendiliğinden yeni site diyalog kutusunu açacaktır. Burada sınama maksadıyla oluşturduğunuz ve başka bir isim vermediyseniz My New Web adını taşıyan Web’i sağ-tıklayın; açılacak Remove From List (Listeden Çıkart) maddesini seçin. FrontPage Explorer bundan emin olup olmadığınızı sorduğunda EVet’i seçin. Bu Web’e ilişkin klasör (c:\FrontPage Webs\Contents\myweb) artık silinebilir. Bir Web’i FrontPage’in Web listesinden çıkartmadan klasörünü silerseniz, FrontPage açılırken hata mesajı verecektir. Fakat deneme amacıyla oluşturacağınız bu örnek siteleri, ilerde açıp bakmak ve size çözümü zor gelen bir konuda Microsoft uzmanlarının nasıl bir yol izlediğini görmek istiyorsanız, My New Web’i, listeden çıkarttıktan sonra, bu Web’e ait klasörü (örneğin c:\FrontPage Webs\Contents\myweb’i yeniden adlandırın; ve isterseniz sabit diskinizde başka bir klasöre aktarın. İnsanın başı sıkıştığı zaman Microsoft’un Web ustalarını yardıma çağırması kadar zevkli bir şey olamaz.

Kağıttan Web’e

Şimdi artık Front Page’in Web Sitesi hakkında iyi bir fikir sahibi sayılırız. Bundan sonraki aşama oldukça kolay. Edindiğimiz bilgilere göre, bizim amatör fotoğrafçılık sitesi, bir Kişisel Web olacak. Fakat bu kadar övdükten sonra, FrontPage’nin kişisel Web şablonunun bizim planladığımız Amatör Fotoğrafçının Sitesi için yeterli olmadığını söylersem, şaşırır mısınız?

Bir kere kişisel site şablonunda ziyaretçilerimizden bilgi toplayacağımız bir form yok; oysa bizim planımıza göre bir ziyaretçi defteri ve bu deftere ziyaretçilerin gireceği bilgileri işlememize imkan verecek bir CGI programı gerekiyor.

///////////////////////KUTU/////////////////////////

AÇIL CGI, AÇIL

CGI, Web Server’ın Susam Kapısı’dır; ve açılması için büyülü sözler değilse bile, ona yakın güçte programlar gerekir. Common Gateway Interface, Browser’ı ile Internet’te bir siteye bağlanan kişinin talep ettiği sayfa adından başka bir bilgi vermesine imkan tanımayan ve daima dışarı bilgi akıtan Web Server’ın, Browser yoluyla ziyaretçiden mesaj ve hatta komut aldığı tek kapıdır. Ziyaretçiler sitemizdeki bir formu doldurup Gönder düğmesini tıkladıklarında, Browser’ları bu bilgileri paketleyip, Server’a gönderir. Bu bilgiler, CGI kapısından geçerek Server’a girerler; fakat Server, CGI’nın önünde bu formun gönderdiği bilgileri bekleyen bir program yoksa, kendisine ulaşan bu bilgileri yaklaşık 20 dakika sonra siler! Sayfasında forma yer veren kişi olarak, site sahibinin (yani bizim) formun vereceği bilgileri alacak ve işleyecek bir CGI programı yazmamız (Program yazmak mı? Daha neler!) ve bunu Server’da CGI dizine koymamız gerekir. Korkacak bir şey yok; boşuna FrontPage kullanmıyoru, herhalde. Bizim yerimize bir program da yazmayacak ise, neden bedava NotePad yerine şu kadar Dolar’a FrontPage aldık? İlerde, formlarımıza program veya “işlem” bağlamayı ayrıntılı ele alacağız.

//////////////////////////KUTU BİTTİ///////////////////////

Biraz önce sizin yaptığınız gibi ben de FrontPage’in diğer şablonlarını incelerken, dikkatimi, Müşteri İlişkileri Sitesi çekti. Bu sitede, biraz değiştirmek şartıyla, kullanabileceğimiz herşey var. Hatta o kadar güzel şeyler var ki, bunları da sitemize katabilmek için kağıt üzerinde oluşturduğumuz site planında biraz değişiklik bile yapabiliriz.

O halde ne duruyoruz: File... New... FrontPage Webs... Karşımıza gelen diyalog kutusunda Customer Support Web’i tıklıyoruz; 2 numaralı bölümde sitemize bir ad veriyoruz: Amatör Fotoğrafçının Sitesi:

<FP0007.tif>

Tabiî hemen dikkat ettiniz, sitemizin adı Amatör Fotoğrafçının Sitesi değil, Amatör Fotografçinin Sitesi. Bu taktiği biraz sonra sayfa başlığında da uygulayacağız. Bunu neden yaptık? Şimdi bu kutuya, daha sonra da sayfa başlığı kutusuna yazdığınız ve yazacağınız ad, daha sonra sitemizi göndereceğimiz Web Server’da bilgisayarın sistem fontu denen yazı türü kullanılarak görüntülenecektir. Gerçi bunu o Web Server’ın operatöründen başkası görmeyecektir, ama Server sahibinden alacağınız bütün mesajlarda ve raporlarda sizin sitenize bu isimle atıf yapılacaktır. Sayfa başlığı olarak kullanacağınız isim ise, ziyaretçilerinizin Browser programlarının başlık bölümünde görüntülenecektir.

Bildiğiniz gibi ve ne yazık ki, ı, İ, ğ, Ğ, ş ve Ş harfleri, Macintosh ve Windows sistemlerinde, (Türkiye’de satılan Türkçe sürümü değilse) sistem yazı türü tarafından desteklenen harfler değillerdir. Yaptığınız sitenin adının, Türkçe desteği bulunmayan bilgisayarlarda da Türkçe’ye en yakın şekilde görüntülenmesini istiyorsak, biraz cambazlık yapmaya razı olmak zorundayız. İ harfi yerine üzerinde aksan olan Y harfinin görünmesinden I harfinin görünmesi (bence) daha tercih edilebilir durumdur. Şimdi bizim sitenin adı Türkçe desteği olsun olmasın bütün bilgisayarlarda, aslına uygun olmasa bile, aslına en yakın tarzda görüntülenmiş olacak.

İsim meselesi de hallettikten sonra, OK düğmesini tıklıyoruz ve FrontPage, Welcome (Hoşgeldiniz) adlı ana sayfanın altında sekiz sayfalı hazır bir site. Bu “hazır site,” ucuz konfeksiyon gibi planımıza pek uymamış görünüyorsa da, FrontPage’in yeteneği böyle durumlarda ortaya çıkar. Görelim bakalım.

<FP0007.tif>

Önce, bu plandaki bazı sayfaları, sağ-tıklayarak ve açılan menüden Rename (Yeniden adlandır) maddesini seçerek, hem FrontPage’in sayfalara kazandırdığı fonksiyona aykırı düşmeyecek, hem de bizim plana uygunluğu sağlayacak bizimde yeniden adlandıralım. (Search/Ara sayfasına planımıza uysun diye “Başkalarının Sayfaları” adını veremeyiz, değil mi?) Planımızda olmayanlara da Türkçe isimler verelim.

<FP0008.tif>

HTML’e biraz aşina olanların ve plandaki çizgilerin sayfalar arasında mevcut bağlantıların (Hyperlink) işareti olduğunu bilenlerin, “Dur!.. Ne yapıyorsun? Sayfa adlarını değiştirirsen, sayfalar arası bağlantılar kopmaz mı!” dediğini duyar gibi oluyorum. Peki ama biz neden FrontPage kullanıyoruz, eğer sayfa adlarındaki değişikliğe göre kendi linklerini güncelleştiremeyecekse? Siz değiştirin sayfa adları, korkmayın! Sonra Tools (Araçlar) menüsünden Recalculate Hyperlinks (Bağlantıları yeniden hesapla) maddesini seçin. Biraz önce örneğin What Is New sayfasını işaret eden link komutu şimdi Yenilikler sayfasına dönmüş olmalı. İnanmazsanız, ispatı çok kolay! Önce Welcome sayfasını açıyoruz; sol kenardaki Navigation bağlantılarına bakın:

<FP0009.tif>

Sonra, aynı sayfanın, sadece Site Planındaki sayfa adlarını değiştirdikten sonra içindeki değişikliklere bakın:

<FP00010.tif>

FrontPage, sadece sayfanın görünen Hyperlink kelimelerini değil, fakat aynı zamanda HTML kodundaki bağlantı etiketleri (<A> ve </A>) ile belirtilen linkleri de değiştirmiş bulunuyor.

Fakat bu sayfaların Browser programlarının pencere başlığındaki adı halâ FrontPage’in verdiği başlığı taşıyor. Şimdi örneğin Yenilikler sayfasını iki kere tıklayın. Editör programının başlığında hangi adı görüyorsunuz? Sayfanın eski adı olan “Support” kelimesini! Şimdi sayfanın boş bir yerini sağ-tıklayın ve açılan menüden Page Properties maddesini seçin. Açılacak Page Properties kutusunda General sekmesinde Title hanesine, “Yenilikler” yazın. Şimdi sayfamızın hem adı, hem de başlığı Yenilikler oldu.

İsteseydik, yeni Web oluşturma aşamasında, Empty Web/Boş Web şablonunu seçerek sitemizi sıfırdan başlatır ve sayfaları kağıt üzerimizdeki plama uygun olarak yapardık. FrontPage Editör, size tek kelime HTML programlama bilmeden bunu yapma imkanı verirdi. Fakat yine de formları oluşturmak ve formların karşılığı olan programın yapacağı işleri seçmek bize kalırdı. FrontPage’nin hazırladığı sitenin sayfalarında değişiklik yapmak böylesine kolay olduğu için, siteyi, amacımıza en uygun olan şablonu seçerek FrontPage’ye hazırlattırdık. Şimdi, sadece sayfaların adlarını değiştirmekle kalmayacağız, fakat bağlantılarını ve yerlerini de değiştireceğiz. Fakat yine de öyle sayfalarımız olacak ki (örneğin, fotoğraflarımızı ve başka sitelere linkler vereceğimiz sayfalar), bunları sıfırdan biz yapacağız.

Ama bu iş, ikinci dersin konusuna giriyor. Şimdi FrontPage’i kapatıp, bilgisayarın dışında da bir dünya olduğunu keşfedebilirsiniz! Bunu yaparken FrontPage’i kapatmayı unutmayın; çünkü yeniden açılırken bize bir sürprizi olacak!

Ders 2: Sayfaları Yapmaya Başlayalım

Birinci derste, neden bir Web sitesi sahibi olmamız gerektiğine ilişkin bazı soruları yanıtladık; ve daha sonra bu sorulara verdiğimiz cevaplara göre, sitemizi kağıt üzerinde planladık. Sonra, FrontPage’in hazır şablon sitelerinden birini, bir şirketin müşteri ilişkileri sitesi için tasarlanmış şablonunu seçtik ve bu sitenin içi doldurulmaya hazır sayfalarını, kendi planımıza uygun bir tarzda adlandırdık. FrontPage’in hazır sitesi, bize planımızda değişiklik yapma fikri de verdi. Örneğin planda sadece bir ziyaretçi defteri öngörmüştük; FrontPage’in kolayca bize tartışma sayfası açabileceğini farkedince, sitemize bir de tartışma sayfası koymaya karar verdik. Ayrıca FrontPage’nin oluşturduğu sitede “Arama” adlı bir sayfa vardı; ki ona da dokunmadık ve sitemize onu da dahil ettik. Bu arada, Microsoft tasarımcılarının aklına firma deyince bilgisayar programı üreten bir firma geldiği için olmalı, sitemizde bir de ziyaretçilerin yazılım arızalarını bildirmeleri için Bugs sayfası oluştu; onun adına bile dokunmadık. Daha sonra ne yapacağımıza karar veririz, dedik.

FrontPage, birbirine bağlantılı bu sayfalardaki bağlantıları, bizim verdiğimiz adlarla güncelleştirdi. Fakat geriye bir iki ciddî sorun kalıyor: Bizim planımızda ana sayfadan üç (tabir yerinde ise) bölüme bağlantı olması diğer sayfalara bu bölümlerin kendi ana sayfalarından gidilmesi öngörülüyordu. Oysa FrontPage’nin planı, bir ana sayfa ile ona bağlı 7 sayfa oluşturdu. Yani çarşıdaki hesap pek bizim evdeki hesabımızı tutmadı. Ayrıca, hiç bir işimize yaramayacağı belli olan Bugs sayfası da öylece duruyor.

Peki.. Şimdi çalıştırın yeniden FrontPage’i. Parolanızı verdiniz; size FrontPage yeniden açılırken bir sürpriz var demiştim, değil mi? Şimdi FrontPage, sitenizde (daha doğrusu, sizin safya adlarını değiştirdiğiniz sitede bir değişiklik olduğunu farketti ve sizden “Bu sitedeki hatalı Endeks girdilerini güncelleştirmemi ister misiniz?” diye izin istiyor. Buna Evet düğmesini tıklayarak karşılık verin.

Hani, içeriğini pek anlamamakla birlikte, adını Arama yaptığımız sayfa vardı ya, işte bu “Endeks” o sayfaya ziyaretçilerinizin gireceği kelimelerle tüm sitenizde aramaya yapmalarını sağlayacak “site endeksi.” Site endeksi, bir Web’i oluşturan bütün sayfalardaki bütün anlamlı kelimelerin hangi HTML sayfalarında geçtiğini belirleyen (şimdilik FrontPage Web Server’ının; ama ilerde sitenizi Internet’e koyduğunuz zaman—evsahibi firmanın Web Server’i, Microsoft Internet Information Server adlı Web işletim sistemi ise—o Web Server’ın) arama motorunun kullanacağı kelime ve kelimelerin geçtiği sayfaların bağlantı listesi demektir. Özetle, Web sitemizi ziyaret edenler, bir forma herhangi bir kelimeyi yazarak, sitemizde bu kelimeyi içeren bütün sayfaların bir listesini görebilecekler.

Web Sayfasına Yazı Dosyası Yerleştirme

Yeni sitemizin ne kadar marifetli olacağına sevinmekle birlikte, önümüzde daha yapılacak çok iş var. FrontPage’in Navigation görünümünde, “Hos Geldiniz” adlı sayfayı iki kere tıklayın; FrontPage Sayfa Editörü açılacaktır:

<FP00011.tif>

FrontPage’in HTML editörünün, üç ayrı görünüm tarzı vardır. Editör penceresinin sol alt kenarında üç sekme göreceksiniz: Normal, HTML ve Preview (Önizleme). FrontPage Explorer’da herhangi bir görünümde bir sayfayı iki kere tıkladığınızda açılan Editör, sayfayı “Normal” diye adlandırdığı biçimde görüntüler. Bu, kelime-işlem programınızın yazı yazdığınız veya yazının paragraf aralarına grafikler koyduğunuz penceresinden hiç farklı değil. İkince sekmeyi tıkladığınızda, sayfanın Internet’te alışverişini ve Browser’lar tarafından yorumlanarak, ekranda görüntülenmesini sağlayan HTML kodları karşınıza gelecektir. Üçüncü sekme olan Preview ise sayfanızın bir ziyaretçinin Browser’ında nasıl görüneceğini görüntüler.

FrontPage’in hazır şablon sayfalarında, bir çok otomasyona yer verilmiş bulunuyor. Açtığınız “Hos Geldiniz” sayfasının başlığındaki “ş” harfi bulunmayan başlık da bu otomasyonun bir parçasıdır. FrontPage, buraya konan grafiklere, Internet’teki yaygın adıyla Banner (Afiş) diyor; ve sayfaya verdiğiniz adı alıp, Banner grafiği haline getiriyor:

<FP00012.tif>

Bu grafiği sonra değiştireceğiz. FrontPage Editör’de Preview sekmesini tıklayın: gördğünüz sayfa hoşunuza gitti mi? Gitmedi. Peki. Bu, FrontPage’in bir firmanın müşteri ilişkileri sitesine uygun gördüğü “tema” idi. Amatör fotoğrafçılık sitesinde daha başka bir tema belki daha uygun olur. Editörü kapatın. FrontPage Explorer ve başka bir görünüm seçmedi iseniz, Folders (Klasörler) görünümü karşınıza gelmiş olmalı. Sol kenardaki görünüm menü maddelerinden Themes’i tıklayın; iki kutulu bir pencere açılacak ve solda tema listesi, sağda da seçilen temanın temel görünüm örneği yer alacaktır. Bütün temaları sırayla inceleyin. Ben, atatör fotoğrafçı için, ressam tuvali temasını içeren “Canvas” temasını seçiyorum. Siz istediğinizi seçebilirsiniz. Fakat bu kitapçığı uygulayarak okuyorsanız, grafiklerimizin uyumlu olabilmesi için, beğenmesiniz de aynı temayı seçmeniz yararlı olur. Temanın adını seçtikten sonra alttaki Apply/Uygula düğmesini tıklayın. Navigation görünümünü seçin ve Hoş Geldiniz sayfasını iki kere tıklayarak, Editör’e sayfanızı açtırın.

FrontPage, sayfa adını alır ve grafik yapar, demiştik. Fakat aynı isim ziyaretçinin Browser’ında “Hoş geldiniz” şeklinde görünmesin diye, sayfamıza “Hos Geldiniz” adını vermiştik. Şimdi sayfanın Banner grafiği de “ş” harfi olmadan yapıldı. Bu hoş değil.

///////////////////////////QUARK İÇİN NOT/////////////////////////

“....ziyaretçinin Browser’ında “Hoş geldiniz” şeklinde görünmesin diye,...” cümleciğindeki “Hoş” kelimesinin son harfi buna karşılık ASCII karakteri olacak. Sanıyorum, bu “Hoþ” şeklinde. Ama buraya yazdığım örnek, benim bilgisayardan PCW bilgisayarlarına kadar nasıl korunabilir, bilmiyorum. Fakat ş’e denk gelen ASCII’yi bulmak kolay: üstte de kolu olan p parfi, veya altta da kolu olan b harfi, ya da b ve p üst-üste!!

//////////////////////////////NOT BİTTİ///////////////////////////

FrontPage, bu grafiği “Header” adını verdiği özel bir “Component” (Bileşke) içine koyacak ve daha bir çok sayfada tekrar edecektir. Bu grafiği—FrontPage’in temasını bozmadan—değiştirmek istiyoruz.

Şimdi “Hos Geldiniz” yazısını tıklayın; Yazı ve çevresindeki grafik unsurları içeren bir kutu seçilecektir: klavyeden Ctrl+C tuşlarına basın. FrontPage Explorer ve Editör’e dokunmayın; sevdiğiniz grafik programını açın; yeni grafik yapmak istediğinizi bildirin ve boş sayfanın üzerinde Ctrl+V tuşlarına basın. Böylece FrontPage’in Banner grafiğini, grafik editing programınıza aktarmış oldunuz. Bu grafikteki “Hos Geldiniz” kelimelerini silerek yerine “Amatör Fotoğrafıçının Sitesi” yazmak, grafik programınızı kullanmadaki maharetinize bağlı! Sonuçta ortaya 630x60 piksel ebadında ve 72 dpi çözünürlükte bir GIF dosyası çıkartmanız ve bunu “Baslikban.gif adıyla sabit diske kaydetmeniz gerekiyor. Baştan beri site ve diğer isimlendirmelerde buradaki örnekleri izliyorsanız, grafik dosyalarınızı C:\FrontPage Webs\Content\amatrfotorafnn\images klasöründe bulundurmanız, daha sonra işinizi kolaylaştırır. Bu kitapçığın örnek dosyalarını PC World sitesinden indirdi ve geçici bir dizinde tutuyorsanız, şimdi bunları C:\FrontPage Webs\Content\amatrfotorafnn\images klasörüne kopyalayabilirsiniz. Burada bu dosyalardan BaslıkBan.gif adlı dosyayı da kullanabilirsiniz. Örnek sitenize bizim verdiğimiz adı vermediyseniz veya FrontPage’e sitenize ait dosyalar için varsayılan dizinden başka bir dizin gösterdiyseniz, Images klasörünü o dizinde arayın ve grafiklerinizi de o dizindeki Images klasörüne koyun.

Şimdi FrontPage’in bütün sayfalarda tekrar ettiği bu başlıkta grafiği silip, yerine kendi grafiğimizi koyacağız. Bunun için şu işlemleri yapın:

1. “Hos Geldiniz” yazısını sağ-tıklayın; açılacak menüden Delete/Sil’i seçin.

2. Başka bir yeri tıklamadan (yani Mouse işaretçisinin yerini değiştirmeden) Insert/ekle menüsünden Image/görüntü maddesini seçin ve açılacak diyalog kutusunda buraya koyacağınız başlık grafiğinin durduğu klasörü ve dosyayı işaret edin. OK’i tıklayarak yeni grafiğin sayfada yerini almısını sağlayın.

3. FrontPage Editör’ü kapatın; kapanışta sorulacak “Değişiklikler Included Page Header Dosyasına Kaydedilsin mi?” sdorusuna Evet düğmesini tıklayarak karşılık verin. Böylece sitedeki bütün sayfalarda, yeni başlık grafiğiniz kullanılmış olacaktır. Navigation görüntüsüne göre döndüğünüzde, bir başka sayfayı iki kere tıklayarak, başlağın gerçekten bütün sayfalarda değişip değişmesini deneyebilirsiniz:

<FP00013.tif>

Çok güzel! Hepsi değişmiş, değil mi? Fakat sayfalardaki yazılar İngilizce! Bu arada başlık grafiğinin hemen altında site içinde sayfadan-sayfaya hareket etmeye imkan veren navigation düğmelerini görüyoruz; içlerinde “Button” yazısı var.

Peki, şimdi bunları değiştirelim. Önce şu düğmelere Türkçe etiketler bulalım. Bunun için şu işlemleri yapabilirsiniz:

1. Navigation görünümünde, boş bir yeri sağ tıklayın, açılacak menüden Web Settings (Web Ayarları) maddesini seçin.

2. Açılacak kutuda, Navigation sekmesini tıklayın. Burada Home Page kutusuna Ana Sayfa, Parent Page kutusuna Yukarı, Previous Page kutusuna Geri, Next Page kutusuna İleri yazın.

3. Hazır, Web ayarları’nı açmışken, Language (Dil) sekmesini tıklayın, Default HTML Coding kutusunun seçme okuna basarak, açılacak listeden Turkish (Türkçe) maddesini seçin.

4. Web ayarları kutusunu Tamam’ı tıklayarak kapatın.

<FP00014.tif>

Yaptığınız değişikliğin, mesela Ara sayfasına işlenip işlenmediğini anlamak için, Önerileriniz sayfasını iki kere tıklayın. Bu sayfadaki düğmeler Türkçeleşmiş olmalı.

Yapacağımız ikinci iş, sayfadaki yazıları değiştirmekti. Şimdi onu yapabiliriz. Buna geçmeden önce, FrontPage’in Rich Text Format (Zengin Yazı Biçimi) biçimindeki dosyaları kabul edebildiğini hatırlatalım. Kelime-işlem programınızla yazdığınız bir yazıda arzu ettiğiniz kelimeleri koyu veya renkli harflere çeviriyor, paragraflarınıza içerden yazılma veya başlarına nokta koyma gibi biçimler veriyorsanız; bu dosyaları bu şekliyle FrontPage’e ithal edebilirsiniz. Tabiî, FrontPage, bir Windows programı olarak, başka programlarda kopyaladığınız metinleri de Yapıştır yoluyla kendi sayfalarına kabul edebilir. Bu iki yöntemi de şimdi ayrıntılı olarak ele alalım.

Önce kopyala-yapıştır yolunu deneyelim. NotePad’i açarak, şu paragrafı (tırnak işaretli olmadan) yazın:

“Amatör fotoğrafçının sitesine hoş geldiniz. Bu sitenin amacı, sadece kendi fotoğraflarımı sergilemek değil. Burada küçük çapta da olsa, amatör fotoğrafçılar arasında bir fikir alış-verişi başlatmak istiyorum. Tartışma sayfası, amatör fotoğrafçılar arasında sadece fotoğrafçılığı ilgilendiren konularda karşılıklı görüş bildirmeniz amacıyla tasarlanmış bulunuyor. Siteyle ilgili sorunları Öneriler sayfasındaki formu kullanarak bana iletebilirsiniz.

Siteme gösterdiğiniz ilgiden dolayı teşekkür ederim.”

Bu iki paragrafın tümünü seçin ve Düzen menüsünden Kopyala’ı tıklayarak Windows’un panosuna alın.

Sonra, FrontPage’de Navigation görünümünde Ana Sayfa’yı iki kere tıklayın; açılan sayfada, “Welcome” kelimesinden “CompanyEmail” kelimesine kadar olan İngilizce yazıların tümünü seçin ve Edit menüsünden Paste (Yapıştır) maddesini tıklayın. (Seçili yazıların üstünü sağ-tıklayarak açılacak menüden de Paste’i seçebilirsiniz.)

NotePad’in biçimlendirilmemiş yazısı, FrontPage’in biçimlendirilmiş yazısının yerini aldı. Aynı işlemi, sayfanın altındaki koyu harfli bölüm için de yapın, hukuksal ağırlığı olan bir kaç cümle yazın! Ve ortaya şu sayfa çıksın:

<FP00015.tif>

Yukarıda, FrontPage’in biçimlendirilmiş yazı da kabul ettiğini belirttik. Bunun için kelime-işlem programınızda oluşturduğunuz bir metni biçimlendirdikten sonra, RTF siçiminde kaydetme imkanınız olması gerekir. Belli başlı bütün kelime-işlem programları, örneğin Microsoft Word ve Corel WordPerfect, bunu yapabilirler. Kelime-işlem programınızda şu metni yazın:

“Bu sayfada amatör fotoğrafçılar için bilgisayar programları ve benzeri bilgisayar-destekli uygulamalara ulaşmanızı sağlayacak bağlantılar yer alıyor. Bu programların çoğu paylaşmalı programlardır. Bu tür programları sürekli kullanmak istiyorsanız, programın yazarına, talep ettiği ücreti ödemeniz gerekir. Dia-pozitiflere etiket yazma programları

Slide Label Saydamlarınızın çerçevelerine istediğiniz ebadda etiket basıyor.

Dia Labels Saydam etiketleri ile birlikte veritabanı oluşturuyor.

Fotoğraf Arşivi

Photo archive Sabit diskinizdeki bütün fotoğraflarınızın kolay ulaşılır arşivini yapmakta kullanabilirsiniz.”

Kelime-işlem programınız, bu imkanı tanıyorsa, Slide label, Dia Labels ve Photo Archive kelimelerine, gerçek olmayan bir Internet link’i bağlayın. Bu kelimelerle başlayan üç paragrafı noktalı liste biçimine sokun. Özetle, bu metni kelime işlem programınızda şu şekli alsın:

<FP00016.tif>

Sonra, bu metni Destek.rtf adıyla ve Rich Text Format (RTF) biçiminde sabit diskinizde herhangi bir klasöre kaydedin. RTF biçiminde kaydedilen dosyalar, kelime-işlem programının bütün biçimlendirme özelliklerini korumazlar. Fakat burada yaptığımız, yazı türünü Times New Roman yapma, link verme, paragrafları noktalı liste haline getirme ve bazı paragrafları koyu harfe çevirme gibi sabit biçimlendirmeler RTF dosyasında aynen saklanır.

Şimdi, kelime-işlem programını kapatın; FrontPage’in Navigation görünümünde Yenilikler sayfasını açın. Bizim biçimlediğimiz metne benzeyen yazıyı, (“This page” kelimelerinden “published” kelimesine kadar tarayın ve silin.

Mouse işaretçisini başka yere oynatmadan, Insert menüsünden File (Dosya) maddesini seçin ve açılacak diyalog kutusunda biraz önce kaydettiğiniz Destek.rtf dosyasını bulun, Aç düğmesini tıklayın. RTF dosyasını göremiyorsanız, Dosya Türü kutusunda RTF biçimli dosyaların seçilmiş olup-olmadığına bakın.

Destek.rtf dosyasındaki yazı, kelime-işlem programında verdiğiniz biçimi ve bağlantıları koruyarak, sayfadaki yerini almış oldu:

<FP00017.tif>

Böylece bu dersin birinci bölümü olan Web sayfasına yazı yerleştirme konusunu bitirmiş olduk. Bu bölümde öğrendiklerini uygulamak için diğer sayfalarda da yapılmasını gerekli gördüğünüz değişiklikleri yapabilirsiniz. Dersin bundan sonraki bölümünde sayfalarımıza fotoğraf ve resim yerleştirmeye çalışacağız. Ama önce yeni sayfa açmamız gerekiyor.

Web Sitesine Yeni Sayfa Ekleyelim

Sitemizde ana sayfa dışında yedi sayfamız var; ama bunlardan hiç biri, kendi fotoğraflarımızı ziyaretçilerimize sunabileceğimiz nitelikte değil. Fotoğraflarımızı görmek isteyenlerin gidebileceği yeni bir sayfaya ihtiyacımız var.

FrontPage’in bizim için oluşturduğu sayfaları inceledikçe görüyoruz ki, hepsinde ortak bir başlık bölümü, hepsinde ortak bir zemin var. Ayrıca başlık bölümündeki Navigation düğmeleri, ziyaretçiyi bir sayfadan ötekine, istediği bir sayfaya veya ana sayfaya götürüyor. Bizim yapmamız gereken yeni sayfada da bu unsurların olması gerekiyor. Fakat yeni sayfaya—diğer sayfalarda bulunan bu ortak özellikleri nasıl kazandıracağız?

Bu bir HTML kılavuzu olsaydı, şimdi “Açın NotePad’i ve <HTML> yazın...” diye söze girmiştik bile. Fakat FrontPage kullanmamızın bir sebebi de tek kelime HTML kodu yazmamak değil miydi? O halde, diğer sayfaların ortak özelliklerine sahip, başlık bölümü ve site içindeki diğer sayfalara bağlantıları sağlanmış, fakat içi boş bir sayfa oluşturma işini de FrontPage’e yaptırabilir miyiz?

Elbette! Navigation görünümünde, Mouse işaretçisini pencerenin alt tarafında dosyalarınızın ve klasörlerinizin göründüğü bölümü, site şemasının bulunduğu bölümden ayıran çizginin üzerine götürün; imleç aşağı-yukarı iki okun arasında iki çizgi halini alacaktır; şimdi mouse’un sağ düğmesini tutarak, iki bölümü ayıran çizgiyi aşağı doğru çekin; dosya ve klasör bölümü kaybolsun. Merak etmeyin; aynı çizgiyi yukarı çekerek bu bölümü yeniden açabilirsiniz.

Site şemanız şimdi bütün Navigation penceresini kaplıyor. En üstteki ana sayfanız olan Hoş Geldiniz sayfasını bir kere tıklayın; Araç Çubuğu’nda New Page/Yeni Sayfa simgesini tıklayın. En sondaki sayfanın sağında “New Page 1” adlı bir sayfa belirdi. Bu sayfayı bir kere sağ tıklayın; açılan menüden Rename/Yeniden Adlandır maddesini seçin ve sayfanın adını “Fotoğraflarım” olarak değiştirin.

<FP00018.tif>

Sayfayı oluşturduk; adını değiştirdik. Fakat acaba içinde gerçek arzu ettiğimiz şeyler, sitemizin ortak temasının gerektirdiği arka plan, başlık, her sayfada bulunan ortak unsurlar bu sayfada da var mı? Sayfayı iki kere tıklayın; istediğiniz herşeyin (içerik hariç, ki onu biraz sonra biz belirleyeceğiz) sayfada bulunduğunu göreceksiniz. Özellikle, bu sayfa sitenin son sayfası olduğu için “İleri” düğmesinin olmadığına dikkat edin. Bu sayfayı kapatın; Ana Sayfa’yı açın. “Fotoğraflarım” sayfasının soldaki listenin altına eklendiğini göreceksiniz. Ana Sayfa’yı kapatın.

Bence, fotoğraflarımı ziyaretçilere sunduğum sayfanın sitenin son sayfası olması hiç de doğru bir şey değil. Biz bu siteyi neden kuruyoruz? Fotoğraflarımızı sergilemek için! Navigation görünümünde, Fotoğraflarım sayfasını Mouse’un sağ düğmesiyle tutun ve en başa, Yenilikler’in soluna götürüp bırakın. Dikkat edin; Yenilikler sayfasının altına değil, tam soluna bırakın! Sayfayı açın; seyir düğmeleri değişmiş oldu. Ana Sayfa’yı açın; Fotoğraflarım sayfasının bağlantısı ve yerini değişmiş bulacaksınız. Sayfaları kapatın.

Navigation görünümünde Fotoğraflarım sayfasını bir kere tıklayarak seçin ve Araç Çubuğu’nda yeni sayfa simgesini tıklayın. Fotoğraflarım sayfasına bağlanmış yeni bir sayfa oluştu. İçini açıp bakmanıza lüzum yok: bu sayfanın da temel bütün unsurları yerinde! Fotoğraflarım sayfasını tekrar seçin; yeni sayfa simgesini yeniden tıklayın. Fotoğraflarım sayfasına bağlı yeni bir sayfa daha! Eliniz alışmışken, Fotoğraflarım’a bağlı yeni sayfaların sayısını dörde çıkartın ve bu sayfaları sırasıyla Gezi, Doğa, Portreler ve Diğerleri olarak adlandırın.

<FP00019.tif>

Fotoğraflarım sayfasını iki kere tıklayın; biraz önce sağda içinde sadece “Button” yazılı ama bağlantılı olmadığı anlaşılan Link satırlarının yerinde yeni sayfalarınızın adlarını göreceksiniz. Ctrl tuşunu tutarak, bu bağlantıları tıklayın; Gezi, Doğa, Portlere ve Diğerleri sayfalarınızın da sitenin bütün özelliklerine ve temel unsurlarına sahip olduğunu görüyor musunuz? Gezi, Doğa, Portlere ve Diğerleri sayfalarında, diğer sayfalarda bulunmayan bir seyir düğmesinin varlığına dikkat edin. Bu “Yukarı” düğmesidir. Bu bağlantı diğer sayfalarda yok, çünkü o sayfalara sadece Ana sayfa’dan ulaşılıyor. Oysa Fotoğraflarım sayfasının altındaki Gezi ve diğer “alt” sayfalara gelinebilen bir “üst” sayfa (Fotoğraflarım sayfası) var.

Bu sayfalardan birinde iken klavyede Ctrl tuşunu tutarak, Yukarı düğmesini tıklayın, Fotoğraflarım sayfasına geri döneceksiniz. Fotoğraflarım sayfasında, metin imlecinin yanıp-söndüğü yere ziyaretçilerimize bu bağlantıları tıkladıkları zaman ne gibi şaheserlerle karşılaşacaklarını belirten bir metin koyabilirsiniz.

Bunu biraz önce öğrendiğimiz gibi biçimlendirilmemiş bir metni kopyala-yapıştır yöntemiyle veya bir kelime-işlem programı ile RTF biçiminde metin dosyası oluşturarak ve bu dosyayı Web sayfasına eklerek yapabilirsiniz. Fakat yazacağınız metin kısa bir kaç cümle ise bunu doğruca FrontPage Editör’de de yapabilirsiniz. İmlecin bulunduğu yere, “Çeşitli vesilelerle çektiğim fotoğrafları burada beğenilerinize ve eleştirilerinize sunuyorum. Sağdaki dört bağlantıyı tıklayarak, fotoğraflarımın bulunduğu dört sayfayı görebilirsiniz. Fotoğraflarımı gördükten sonra, izenimlerinizi ve eleştirilerinizi bildirmek isterseniz, Önerileriniz sayfasındaki formu kullanabilirsiniz. İsterseniz bana elektronik mektup da gönderebilirsiniz,” yazın. Sonra bu yazının tümünü seçin ve içinde Default Font yazan yazı türü kutusunun seçme okunu tıklayarak arzu ettiğiniz bir harf türünü seçin. Bu kutunun sağındaki üzerinde yukarı ok bulunan A harfini tıklarak harflerin ölçüsünü büyütün. Seçiminiz çok büyük göründü ise, üzerine aşağı ok bulunan A harfini tıklayarak harfleri küçültün.

<FP00020.tif>

İsterseniz “elektronik mektup” kelimelerine kendi eleknonik posta adresinize mektup göndermek üzere kullanıcının elektronik posta programını açtıracak bir bağlantı da koyabilirsiniz. Fakat bu konuya daha sonra geleceğiz!

Şimdi bu sayfa sitemizin fotoğraflar bölümünün ana sayfası oldu. Sıra geldi, fotoğrafları içeren dört sayfaya, uygun fotoğrafları yerleştirmeye!

Fakat sitemizin planı halâ bizim kağıt üzerindeki planımıza benzemiyor. Bunu sağlamak amacıyla ana sayfayı vce Yeni Sayfa simgesini tıklayın. Sayfaların en sonunda New Page adıyla yeni bir sayfanız olacaktır. Artık biliyoruz ki, bu sayfanın aslî bütün unsurları yerindedir. Bu sayfanın simgesini sağ-tıklayın; açılan menüden Rename/Yeniden Adlandır’ı seçin ve sayfanın adını “Oneriler Tartisma Sorular ve Cevaplar” yapın. Sonra, Sorular Cevaplar, Öneriler ve Tartisma sayfalarının simgelerini Mouse işaretçisiyle tutarak, bu yeni sayfanın altına getirip bırakın. Yine eminiz ki, “Oneriler Tartisma Sorular ve Cevaplar” sayfası, bu üç sayfaya da gereken linkleri veriyor. Bu arada işimize pek yaramayacak olan Bugs ve Yazılım sayfalarını da silebilirsiniz: örneğin Bugs sayfasını sağ-tıklayın, açılacak menüden Delete/Sil maddesini seçin.

Açılacak bir soru kutusu, sizden sayfası sadece bağlantılar listesinden mi çıkartmak istediğinizi, yoksa tümüyle yok etmek mi istediğiniz soracaktır. Birinci madde olan “From this page from all navigation bars” (Bu sayfayı tüm seyir çubuklarından çıkart) maddesini seçerseniz, sayfa ve içeriği HTML dosyası olarak sabit diskte kalır, fakat sitedeki bağlantıları silinir. İkinci madde olan “Delete this page from the FrontPage Web” (Bu sayfası FrontPege Web’inden sil) maddesini seçerseniz, sadece sayfa silinmekle kalmaz, ana sayfadaki bağlantısı da silinir. Bu sayfanın HTML kodundan ilerde yararlanabileceğinizi düşünüyorsanız, birinci maddeyi seçin. Yoksa ikinci maddeyi seçin ve OK’i tıklayın. Aynı şeyi Yazılım sayfasına da yapabilirsiniz.

Şimdi yeni sayfaların içeriklerini verebilir, eski sayfaların mevcut içerikleri kendi ihtiyacımıza uygun hale getirebiliriz.

Web Sayfasına Grafik Dosyası Yerleştirme

FrontPage’e, tek kelime HTML kodu yazmadan, aşağı yukarı, sağ ve sol sayfalarla her türlü bağlantısı olan ve temel unsurları bulunan dört yeni sayfa yaptırdık. Şimdi bu sayfalara fotoğraflarımızı koyalım. Fakat önce hukuk ve DPI açısından bazı noktaları belirtelim.

Telif Hakkı Meselesi

Alıştırma amacıyla bu sayfalara istediğiniz fotoğrafları koyabilirsiniz. Burada “Alıştırma maksadıyla” kelimelerine dikkatinizi çekerim. Internet, gerek Türk yasalarına, gerekse uluslararası hukuka göre, bir yayın aracıdır. Yani Internet’te gerçek bir site edinir ve gerçek sayfaları kamuoyuna açarsanız, yasaya göre “ticarî yayın” yapmış ve dolayısıyla basın-yayınla ilgili her türlü ulusal ve uluslararası yasanın kapsamına girmiş olursunuz. Gazete, dergi, radyo ve televizyonlar hangi yasa, tüzük ve yönetmelik ile düzenleniyor ise, Internet’teki siteniz de o hükümlere uymak zorundadır.

Bu yasaların başında gelenlerden biri, Fikir ve Sanat Eserlerini Koruma Kanunu, diğeri ise Ceza Yasası’sıdır. Fikir ve Sanat Eserlerini Koruma Kanunu, veya yaygın adıyla Telif Hakları yasası’nın hükümlerini tek bir cümleye indirgeyebilirsek, şunu söyleyebiliriz: Size ve kamuya ait olmayan bir fikir veya sanat eserini, sahibinin yazılı izni olmadan yayınlamak yasaktır! Ceza Yasası ise çeşitli hükümleriyle, kişilerin özel hayatını izinsiz yayınlara karşı korur; hayatı, yaptıkları, düşünceleri ve sözleri kamu açısından önem taşımayan kişilerin (yani seçilmiş veya yüksek bir görevde bulunan ve kamu hizmeti yapanların, ulusal önemdeki bir haberin konusu olanların, kamuya açık bir gösteri veya sanat eserini icra edenlerin ve benzeri durumdaki kişilerin dışındaki herkesin) fotoğrafının ticaret amacıyla yayınlanmasını yasaklar. Sokakta gördüğünüz bir kişinin, bir sebeple, fotoğrafını çekerseniz, ticaret maksadıyla kullanabilmek için bu kişiden imzalı “Muvaffakat Belgesi” almanız gerekir. Bir çok batı ülkesinde başkasına ait binanın, evcil hayvanın veya bitkinin fotoğrafını bile ticarî maksatla yayınlamanın yasak olduğunu hatırlatırsak, Türkiye’de bu açıdan hayatın çok kolay olduğunu görürsünüz! Başkalarının çektiği fotoğrafları veya yaptığı resimleri sitenizde kullanacağınız zaman, fotoğrafı çeken veya resmi yapan kişiden, sanat eserinin yayın hakkını aldığınızı gösteren bir bir belge imzalamasını istemelisiniz.

Demek ki, Internet’te hoşunuza giden bir fotoğrafı veya bir başka tür grafiği bir sağ tıklamayla sabit diskimize alıp, sonra da kendi sayfamıza koymamız, bize en azından çok ağır bir malî sorumluluk getirebilir. Ayrıca, sokakta gördüğünüz bir kişinin fotoğrafını çekip, şirketinizin ambalaj kağıdına bastırmanız mümkün olamaz. CD-ROM halinde satılan fotoğraf ve grafiklerin kutusunda bulunan broşür ve diğer yazıları dikkatle okuyarak, bu malzemeyi nerede ve hangi şartlar altında kullanabileceğinizi öğrenin. Bu tür CD-ROM’ların kiminde ticaret amacıyla kullanım yasaklanmıştır, kiminde ise her türlü kullanıma izin verilir.

Alıştırma maksadıyla, yani kendi sabit diskimizden başka bir yere gitmemek ve bizden başkası tarafından görülmemek şartıyla, herhangi bir fotoğrafı kullanabiliriz.

Bu hukukî uyarılardan sonra, öğrendiğimiz kurallara uygun fotoğraflarla, son yaptığımız dört sayfayı tamamlayalım. Tabiatıyla bir fotoğrafçının sitesindeki fotoğrafların kendisine ait ve konu itibariyle Internet’te yayınlanabilir olmması gerekir!

Grafiklerin Çözünürlüğü

Internet’te sitenizi oluşturan sayfalar, evsahibi Web Server’dan, ziyaretçinin bilgisayarına sür’atle ulaştırılması gerekir. Bu ulaşımın sür’atini, Web Server’ın ve ziyaretçinin bilgisayarının Internet’e bağlantılarının genişliği belirler. Web Server’lar Internet’in omurgası denilen ana kablolara genellikle çok hızlı bilgi alış-verişine imkan veren kablolarla bağlıdır; fakat ziyaretçiler bağlantıyı telefonla sağlarlar. Telefon tellerinin saniyede aktarabileceği bilgi büyüklüğü ise sınırlıdır. Sayfalarınızdaki grafik unsurlar çok büyük dosyalar oluşturuyorsa, sayfalarınızın ziyaretçinizin bilgisayarında görüntülenmesi çok uzun zaman alacaktır.

Sayfalarınıza koyacağınız grafik unsurların (başlık resimleri veya fotoğraflar gibi) bilgisayar dosyası olarak büyüklüğünü sadece yüzölçümü tayin etmez; çözünürlüğü tayin eder. Bir grafik unsur, çözünürlüğü çok olursa, yüzölçümü daha büyük bir grafikten daha büyük bilgisayar dosyası oluşturabilir. Bilgisayar grafiklerinin çözünürlüğü (yani ekranda veya basıldığı zaman kağıt ya da film üzerinde) kaç nokta oluşturularak gösterileceği demektir. Bunun standart ölçüsü, inç-kare’ye nokta olarak (dot per inch, DPI) gösterilir. Bilgisayar ekranları genellikle 72 dpi çözünürlüktedir, dolayısıyla sadece ekranda gösterilecek bir grafik unsurun 72 dpi çözünürlükte olması yeter. Buna karşılık kağıda veya matbaacılıkta kullanılmak üzere filme alınacak grafiklerin çözünürlüğü en az 300 dpi olur. Fotoğraf veya diğer grafik unsurları tarayıcı (scanner) ile tarayarak, kağıttan bilgisayara aktırırız. Bunu yaparken tarayıcı programa çözünürlük olarak istediğiniz ölçüyü verebilirsiniz.

Şimdi diyelim ki elimizde, geçen derste yaptığımız dört sayfaya koyacağımız dört fotoğrafın bilgisayar dosyaları bulunuyor. Şimdi FrontPage’e bunları sayfalarımıza koymasını bildirelim. FrontPage Explorer’da Navigation görünümünde, Gezi sayfasını iki kere tıklayın; sabit ve ortak unsurları olan fakat içeriği bulunmayan sayfamız Editör’de açılsın. İmlecin yanıp söndüğü noktaya, “Gezi Fotoğraflarım” yazın ve her imleç bu satırda iken (içinde Normal yazan) stil değiştirme kutusunun seçme okuna basın. Açılacak listeden “Heading 2” stilini seçin. FrontPage size 15 hazır stil sunuyor. Bunlardan Heading (Başlık) diye adlandırılmış olanlar 1’den (en büyük) 6’ya (en küçük) kadar numaralanmıştır. Hazır sırası gelmişken, bütün stilleri sırasıyla seçin ve “Gezi Fotoğraflarım” başlığının nasıl biçimlendirildiğini inceleyin. Denemenin sonunda Heading2’de karar kılın. İmleç henüz bu satırda iken, Araç Çubuğu’nda Center (Ortala) simgesini tıklayın. “Gezi Fotoğraflarım” başlığı büyümüş ve ortalanmış olacaktır.

Klaveyede Enter tuşuna basarak, metin imlecini alttaki satıra indirin ve “Foto 1: Antalya-Kemer Olimpos Dağı” yazın. İmleç, henüz bu satırda iken, stil seçme kutusundan Menu List stilini seçin. FrontPage, tüm sitenize uyguladığı tema çerçevesinde bütün menü listelerinin başına aynı nokta grafiğini koyacaktır. Tekrar klavyede Enter tuşuna basın. İmleç alt satıra indiğinde, Araç Çubuğu’nda Insert Image (Grafik Yerleştir) simgesini tıklayın. (Bu kitapçığın örnek dosyalarını PC World sitesinden indirdiyseniz ve örnek dosyaları C:\FrontPage Webs\Content\amatrfotorafnn\images klasörüne kopyalamış olymanız gerekir. Kendi seçtiğiniz bir fotoğrafı kullanacaksanız, bu fotoğrafın dosyasını sitenizin varsayılan Images klasörüne kopyalamayı unutmayın.)

Açılacak diyalog kutusunda, sol taraftaki listede Gezi72dpi.jpg (veya kendi seçtiğiniz herhangi bir dosyayı) tıklayın; sağdaki önizleme kutusunda dosyanın içeriğini göreceksiniz. OK’i tıklayın; fotoğraf sayfada sola bloklanmış olarak yerini alacaktır. Fakat gördüğünüz gibi fotoğrafın orijinal ebadı, sayfamızın diğer unsurlarına göre biraz büyükçe. Fotoğrafın içinde bir yeri tıklayın; dört kenarında küçük kutular halinde tutacak yerler belirecektir. Mouse işaretçisini sağ alt köşedeki küçük kutunun üzerine götürdüğünüzde çapraz iki uçlu ok olduğunu göreceksiniz. Sağ düğmesini tutarak, Mouse’u, sol üst köşeye doğru sürükleyin. Fotoğraf gözünüze yeterince küçülmüş görününce, bırakın. Fotoğraf seçili iken, Araç Çubuğu’ndan Center/Ortala simgesini tıklayın. Sayfanız şu şekli almış olacaktır:

<FP00021.tif>

Şimdi diğer fotoğraf sayfalarına da başlıkları ve fotoğrafları yerleştirelim. Böylece sitemizin “sıfırdan” yapılan sayfaları tamamlanmış oluyor.

Bu derste, FrontPage’e yaptırdığımız sayfalarla sitemizin planı, kağıt üzerindeki plana biraz daha yaklaştı. Fakat halâ bazı eksiklerimiz var; ve sitemizin planı, kağıt üzerindeki plana benzemiyor.

Ders 3: Sayfaları Bağlayın

Internet’i Internet yapan, ya da Internet’in bugüne kadar bilgisayarlar arasında kurulan bağlantıların en kolayı olmasını sağlayan, herhalde, bağlandığımız bir bilgisayarda duran dosyaları kendi bilgisayarımıza aktarma ve o bilgisayarda işimiz bittiğinde başka bir bilgisayara geçmenin olağanüstü kolay olmasıdır. Internet’te siteden siteye gezenler arasında, yaptıkları işin gerçekte başka bilgisayarlarla kendi bilgisayarları arasında bağlantı kurmak ve o bilgisayardan kendi bilgisayarına dosya aktarmak olduğunu bile bilmeyenler vardır.

Bu noktaya kadar daha tek satır HTML kodu yazmamışsak da, FrontPage’e yaptırdığımız sayfalarda, sayfalarmız arasında gidip-gelmeyi sağlayan bağlantı kelimelerinin arkasında bu tür Hyperlink’ler bulunduğunu biliyoruz. FrontPage, yeni bir sayfa yaptığımız veya mevcut sayfaların site planındaki yerini değiştirdiğimiz zaman sayfalardaki bağlantıların gerektirdiği HTML komutlarını kendisi yazıp-düzeltiyor. Fakat FrontPage’nin kullanmaya hazır sitesini kendi planımıza uydururken, kendi sitemiz dışındaki sitelere veya bu sitelerin belirli sayfalarına bağlantı vermek gerekiyor ve bağlantıların hedeflerini biz belirtmek zorundayız.

Inrternet’teki sitelerin ve bu sitelerdeki sayfaların adreslerinin teknik adı “URL Adresi” veya kısaca URL’dir. URL, Universal Resource Locator kelimelerinin kısaltılmışıdır ve Evrensel Kaynak Yeri Belirleyici gibi bir anlamı vardır. Internet’in küresel aleminde, her site bir kaynak sayılıyor; bu kaynak aleminde belirli bir sitenin veya sayfanın bulunması için geliştirilen sistem ise belirli bir iletişim protokolü ile aradığınızda size aradığınız yerin hangi ülkede, hangi ağda, hangi bilgiyarda olduğunu belirliyor.

Internet’te kaynakları (siteleri, sayfaları) ya Hyper Text Transfer Protocol (HTTP) kuralları ile, ya File Trasfer Protocol (FTP) kuralları ile, ya da Simple Mail Transfer Protocol (Basit Posta Aktarma Protokolü) ile arayabilirsiniz. Gerçi kullanabileceğiniz başka protokoller de vardır; ama bunlar giderek daha az kullanılır hale geliyor. Web sitelerini oluşturan HTML sayfaları, Internet’te HTTP protokolü ile alınıp-verilirler. İçeriğini görmeden bir bilgisayardan diğerine dosya aktarmak için FTP kullanılır. Elektronik Posta programınız ise SMTP ile mektup alır-verir.

Bu kadar teknik bilgi yeter; şimdi FrontPage’yi yeniden çalıştırıp, hem mevcut planı kendi kağıt üzerindeki planımıza uydurmaya devam edelim; hem de başkalarının sitelerine bağlantılar verelim.

Site İçi Bağlantılar

Kağıt üzerindeki planımıza göre, başkalarının sitelerine bağlantılar vereceğimiz, yarışma ve sergileri duyuracağımız bir sayfamız olacaktı. O halde, önce ana sayfayı, sonra da Yeni Sayfa simgesini tıklayın. Sayfaların en sonunda New Page adıyla yeni bir sayfanız olacaktır.

Biliyoruz ki, bu sayfanın aslî bütün unsurları yerindedir. Bu sayfanın simgesini sağ-tıklayın; açılan menüden Rename/Yeniden Adlandır’ı seçin ve sayfanın adını “Baglantilar” yapın. Sonra, sayfanın simgesini mouse işaretçisi ile tutup, “Öneriler Tartisma Sorular ve Cevaplar” sayfası ile “Ara” sayfasının arasına bırakın.

Sonra, bu sayfa seçili iken üç kere Yeni Sayfa simgesini tıklayın; yeni sayfalarınızı “Baska Siteler,” “Sergiler” ve “Yarismalar” olarak yeniden adlandırın.

Şimdi sitelerimizin son şeklini bir karşılaştıralım:

<FP00022.tif>

Şimdi Baglantilar sayfasını iki kere tıklayın ve Editör’de açılmasını sağlayın. Metin imlecinin bulunduğu yere şu paragrafları yazın:

“Soldaki bağlantıları tıklayarak, benim çok yararlı bulduğum Başka Siteler'in listesine ve derleyebildiğim bazı Sergiler ve Yarışmalar ile ilgili duyuruların bulunduğu sayfalara ulaşabilirsiniz.

Bu listeler Internet'te bulabileceğiniz sitelerin tümünü içermemektir. Burada bağlantı vermemi arzu ettiğiniz bir siteniz varsa veya böyle bir sitenin adresini biliyorsanız, bana Elektronik Mektup gönderebilirsiniz veya Öneriler sayfasındaki formdan yararlanabilirsiniz.”

İki paragrafı da girdikten sonra, “Başka Siteler” kelimelerini seçin, Araç Çubuğu’nda harfleri koyu renkli hale getirmekte kullandığınız Bold simgesini (B harfi biçiminde) tıklayın. Aynı şekilde Sergiler ve Yarışmalar kelimelerini de koyu harfe çevirin. Bunu da tamamladıktan sonra sıra geldi, sitemizin içindeki bir sayfaya, bu paragraftan bağlantı vermeye.

Ziyaretçilerimiz ana sayfadan Öneriler sayfasını seçerek, Öneriler sayfasına gidebilirler. Bu sayfa, yatay olarak sağındaki ve solundaki sayfalara da bağlantılı olduğu için, Yenilikler sayfasının İlerle Bağlantılar sayfasının Geri düğmeleri (kelimeleri) ziyaretçilerimizi Öneriler sayfasına götürecektir. Fakat biz, Bağlantılar sayfasındaki metinde, “Öneriler sayfasındaki” kelimelerini tıklayanların da bu sayfaya ulaşmasını istiyoruz.

O halde, metinde bu iki kelimeyi seçin ve Araç Çubuğu’ndaki Create or Edit Hyperlink (Bir bağlantı oluşturun ve düzenleyin) simgesini (çevresinde zincir halkaları bulunan dünya simgesi) tıklayın. Açılacak kutuyu biraz inceleyelim:

<FP00023.tif>

//////////////////////////////KUTU/////////////////////

Dosya adlarınız farklı mı?

Sizin ekranınızdaki Edit veya Create Hyperlink kutusu ile burada gördüğünüz kutudaki dosya adları farklı mı? Elbette farklı. Çünkü ben FrontPage’in oluşturduğu dosyaların adlarını Navigation görüntüsünün alt bölümünden yararlanarak değiştirdim. Navigation görünümünde, üst tarafta sitenizin simgeli planını, alt tarafında ise dosya ve klasör adlarını görüyorsunuz. Bu kitapçıktaki örnekleri aynen yapıyorsanız, bu bölümde Newpage1.htm...Newpage5.htm adıyla bir takım dosyalar göreceksiniz. Bunlardan birini tam dosya adından sağ tıklayın, açılacak menüden Rename/Yeniden Adlandır maddesini seçin. Yeni dosya adı olarak, sayfanın başlığına uygun bir ad verin: mesela Fotograflarim sayfasına Foto.htm adını verebilirsiniz. Bir dosyanın adını değiştirdiğiniz zaman FrontPage o dosyaya yapılan bütün otomatik atıfları düzeltecek, bütün otomatik Link’leri güncelleştirecektir. Bu dosyaya otomatik olmadan bir link vermişseniz, FrontPage, bu link’i güncelleştirmek için izin isteyecektir.

/////////////////////KUTU BİTTİ//////////////////////////////

Sitenizde bir unsura (bir veya bir kaç kelimeye, ya da bir grafik unsura) yine sitenizde bir başka sayfaya veya başka bir siteye (ya da bu sitede belirli bir sayfaya) bağlantı sağlamak için aynı kutuyu, Create Hyperlink (Hiperlink oluştur) kutusunu kullanırız. Fakat kendi sitemizdeki bir dosyanın bağlantısı ile başka bir sitenin bağlantısı için farklı işlem yapmamız gerekir. Açılan kutuda dört bölüm olduğunu görüyorsunuz. En üstteki “Look in” (İçinde ara) kutusu, sizin bilgisayarınızda (veya bilgisayarınzın bağlı olduğu yerel alan ağında) kurulu birden fazla fazla kişisel Web varsa, bağlantı kurulacak unsuru bu farklı Web’lerde aramanızı sağlar. İşiniz gerçek Internet’te Web işletmeciliği değilse, büyük bir ihtimalle sabit diskinizde bir adet FrontPage Web veya Microsoft Kişisel Web Server Web’i kurulu olmalı! Dolayısıyla, sitenizde bir başka sayfaya bağlantı vereceğiniz zaman, aradığınız sayfanın bulunduğu site, Varsayılan Web olarak zaten seçilmiş olacaktır; Look In kutusunda bir tercih yapmanız gerekmeyecektir. Create Hyperlink diyalog kutusunun ikinci bölümünde, Look In kutusunda adı yazılı olan sitenin içerdiği bütün klasörleri ve dosyaların listesini göreceksiniz. Kurmak istediğiniz bağlantı kendi sitenizin içinde bulunduğuna göre, bağlantının hedefi olan dosya da şu anda bu listenin içinde bulunuyor. Nitekim, bu kitapçıktaki örnekleri aynen yapıyorsanız, karşısınızdaki listede adı “oneriler.htm” başlığı “Oneriler TartıSma Sorular ve Cevaplar” olan dosyayı görebilirsiniz. Kurmak istediğimiz bağlantının hedefi bu dosya olacak. Dolayısıyla adını bir kere tıklayın; diyalog kutusunun üçüncü bölümü olan “URL:” kısmına bu dosyanın adının yazıldığını göreceksiniz. Bağlantı sağlama işimiz tamamlandı; OK düğmesini tıklayarak, Editör’e geri dönebiliriz. Ama bu diyalog kutusunu tanıma işimiz bitmedi. Daha sonra bu kutunun üçüncü ve dördüncü bölümlerini ele alacağız.

Editör’e geri döndüğünüzde, “Öneriler sayfasına” kelimelerinin renginin ve stilinin değiştiğini, hyperlink stiline dönüştüğünü göreceksiniz. Bağlantının işe yarayıp yaramadığını sınamak için Ctrl tuşunu tutarak bu kelimelerden birini tıklayın; karşınıza Öneriler sayfasının gelmesi gerekir.

Site Dışı Bağlantılar

Create Hyperlink kutusunu incelemeye geri dönebiliriz. Ama bunun için önce site dışı bağlantı vereceğimiz sayfanın içeriğini oluşturalım.

Microsoft Word, Corel WordPerfect veya yazayacağınız yazıyı RTF formatinde saklayabilecek bir kelime-işlem programı açın ve başlayın yazmaya:

Faydalı Siteler ve Sayfalar:

Internet’te amatör fotoğrafçıların yararlanabileceği bir çok site var. Bunların bir kısmını inceledim ve Sık Kullanılanlar listeme aldım. Sizin için de yararlı olacağına inandığım bu sitelere aşağıda sıraladığım adlarını tıklayarak ulaşabilirsiniz.

Bir uyarı: Amatör fotoğrafçılar bütün paralarını fotoğrafçılığa harcadıkları için, çoğu zaman Internet sitelerini devam ettiremiyorlar. Bağlantıları kopuk bulursanız, bana elektronik mektupla bildirebilir veya Öneriler sayfasındaki formu doldurabilirsiniz.

Bir uyarı daha: Sitelerin sadece fotoğrafçılığa ait olmasına dikkat ettim. Ama, hiç belli olmaz! Bir sebeple beğenmezseniz, Tartışma sayfamızda yeni bir tartışma başlatabilirsiniz.

Siteler:

Bu beş paragrafı, RTF biçiminde ve mesela “Baska Siteler.rtf” adıyla saklayın. Üsteki ve alttaki iki başlığın koyu renkli ve ortalanmış olduğuna dikkat edin. Ayrıca, “Bir Uyarı” ve “Bir uyarı daha” kelimeleri de koyu renkli olacak.

Sonra, ziyaretçilerimize sunacağımız başka sitelerin adlarını ve adreslerini içeren şu listeyi aynen yazın ve düz yazı dosyası olarak (ve mesela “Foto siteleri linkleri.txt” adıyla) saklayın, fakat düz yazı programını kapatmadan önce bu listenin tümünü seçerek ve düz yazı programınızın kullarına uygun şekilde (büyük bir ihtimalle Ctrl+C tuşuna basarak) Windows’un panosuna alın. (Yerinizde olsam, diğer metinleri alıştırma amacıyla yazardım, ama bu metni PCWorld’ün Internet sitesinden indirirdim! Eğer bu listeyi yazmıyorsanız dikkatle inceleyin. <A> ve </A> kodu HTML’de bir link belirtmekte kullandığımız Anchor komutunun kodlarıdır ve Hotlink Reference/href ile birlikte yazılır. Bu bağlantının bizim sitemizin dışında bir yere işaret ettiğini URL adresinden anlıyorsunuz. Örneğin İFSAK için adres "http://www.geocities.com/SoHo/Museum/9404/homepage.htm" olarak veriliyor. <BR> ise HTML dilinde “Satır başı yap, ama iki paragraf arasında olması varsayılan aralık olmasın” anlamına gelir!)

<A href="http://www.geocities.com/SoHo/Museum/9404/homepage.htm">IFSAK</A><BR>

<A href="http://www.rdps.freeserve.com/">Rushden &amp; District Photographic Society</A><BR>

<A href="http://www.angelfire.com/in/focus4now/">Jason's Amateur Photography Page</A><BR>

<A href="http://www.angelfire.com/biz/pooleproductions/index.html">Poole Productions Photography </A><BR>

<A href="http://www.sterndalehibbert.freeserve.co.uk/">Tripping Long Haul</A><BR>

<A href="http://mars.ence.kyushu-u.ac.jp/index.html">Japan Photo Studies</A><BR>

<A href="http://home.att.net/~deb.abrams/">Yosemite National Park Photo Gallery</A><BR>

<A href="http://www.micromedia.net/spf/spf-home.htm">Scottish Photographic Federation</A><BR>

<A href="http://www.kodak.com/aboutKodak/kodakHistory/milestones78to32.shtml"> History of Kodak</A><BR>

<A href="http://info.pitt.edu/~rwdst6/">Ryan's Web Site</A><BR>

<A href="http://www.amateur.ru/">Russian Amateur Photography</A><BR>

<A href="http://www2.netdoor.com/~bills/">Bill Strong's Photo Tour</A><BR>

<A href="http://www.gtdesigns.com/photoring/">The Amateur Photography Ring</A><BR>

<A href="http://neon.airtime.co.uk/amphot/boyd1/">Boyd Harris Travel Photography</A><BR>

<A href="http://members.tripod.com/~jwhearn/">JW's Place - Photography, Image Galleries</A><BR>

<A href="http://home.earthlink.net/~troise/index.htm">Welcome to Chase Photography</A><BR>

<A href="http://www.btinternet.com/~jonhall/webring.htm">Jon Hall's Photographic Galley</A><BR>

Şimdi biri RTF biçiminde sadece sabit diskte, diğeri düz yazı biçiminde hem sabit diskte, hem de Windows’un hafızasında iki dosyanız oldu. FrontPage’in Navigation görünümünde Baska Siteler sayfasını iki kere tıklayarak, açın. Metin imlecini yanıp-söndüğü yerden oynatmadan, Insert menüsünden File maddesini seçin ve RTF biçiminde sakladığınız beş paragraflık yazıyı (başka isim vermedinizse Baska Siteler.rtf adlı dosyayı) bulup, OK’i tıklayın. Koyu renk ve ortalama gibi biçimlendirmeleriniz aynen HTML’e çerilmiş olmalı. Şimdi, “Siteler:” kelimesinin sonunu tıklayın ve Enter’a basın.

Tek kelime bilmeden Web sitesi yapacağız, dedik ama HTML’in hiç de yüzünü görmeyeceğiz, demedik. Editör penceresinin sol alt kenarında Normal, HTML ve Preview sekmelerine daha önce işaret etmiştik. Şimdi HTML sekmesini tıklayın. Herşeyi birlikte yapıyorsak, karşınıza aynen şu görünüm gelmiş olmalı:

<FP00024.tif>

Normal görünümde metin imleciniz, “Siteler:” kelimesinin altında boş bir yerde idi. Son kelime ortalanmış ve koyu renkliydi; tam o noktada Enter tuşuna bastığımız için yeni paragraf da tek kelimelik son paragrafın özelliklerini aldı, ve imlecinizi <p ALIGN=”CENTER”><b>&nbsp;</b> kodlarının ortasında buldunuz. HTML öğrenmeye bu noktada başlamayacağız, tabiî. Ama buradaki kodlar bu paragrafın (<p>) ortalanacağını (ALIGN=”CENTER”) ve koyu renkli (bold) olacağını (<b>) gösteriyor. “&nbsp;” ise satırı bölmeyen boşluk (non-breaking space) anlamına geliyor. Şimdi buradaki kodları şu şekle getirin: <p></p>. (HTML öğrenmeye burada başlamayacağız dedik, amahiç olmazsa ne yaptığımızı bilmemiz bakımından; ortalamayı ve koyu harf özelliklerini kaldırıyoruz, paragrafın bittiğini belirtiyoruz. Bu değişikliği yaptıktan sonra metin imlecinizi “>” ve “<” işaretlerinin tam ortasına getirin; (biraz önce düz yazı programında listeyi panoya almıştığınız değil mi?) ve klavyede Ctrl+V tuşlarına basın. Biraz önce panoya aldığınız link adresleri ve sitelerin adlarını içeren HTML kodlarını sayfanızın HTML kodlarının arasına kopyalayın. Kim demiş HTML yazmıyoruz, diye!

Sonra, Normal sekmesini tıklayın; sayfamıza geri döndüğümüzde, tavsiye ettiğimiz siteler ve bağlantılar olması gerektiği gibi gösterilmiş bulunuyor:

<FP00025.tif>

Çok güzel. Fakat Rushden Bölgesi Fotoğrafçılık Derneği’nin bağlantısını tıklarsanız, Browser’ınızın hata mesajı verdiğini göreceksiniz; çünkü bağlantıda bir hata yapmış bulunuyoruz. Adresin doğrusu "http://www.rdps.freeserve.co.uk/" şeklinde olacak.

Yukarıda, FrontPage’in HTML koduna, HTML kodu “ithal” ettik. Fakat şimdi düzeltmeyi “elle” yapacağız, böylece FrontPage’in Edit “Hyperlink” kontrol kutusunu tanımış olacağız. Şimdi, metin imlecini, linklerinizden ikincisi olan Rushden Derneği’nin satırısına getirin ve daha önce site içi bağlantılar için yaptığımız gibi, Hyperlink simgesini tıklayın:

<FP00026.tif>

Biraz önce, yeni bir bağlantı oluşturmak için bu simgeyi tıkladığımızda açılan kutunun başlığı “Create Hyperlink” (Hyperlink oluştur) iken şimdi kutunun adının “Edit Hyperlink” (Hyperlink düzelt) olduğunu görüyorsunuz. Yine önceki kutudan farklı olarak bu kez URL hanesinde biraz önce HTML dosyası olarak kopyalayıp-yapıştırdığımız listedeki adresin yer aldığına dikkat edin. Mouse işaretçisini URL kutusunun içine tıklayın ve adresin sonundaki “com” harflerini “co.uk” yapın, OK’i tıklayın.

Bu kutunun URL hanesinin sağındaki simgeleri aşağıda, “Target Frame” bölümünü daha sonra ele alacağız.

Elektronik Posta Bağlantısı

Bu arada, RTF dosyası olarak getirdiğimiz beş paragraflık metinde, en az iki yere “link” vermemiz gerektiğini farkettiniz mi? Birincisi, “Bana elektronik mektup gönderebilsiniz” dediğimiz yer; diğeri aynı cümlede Tartışma sayfasına yapılan atıf.

Bu dersin başında, site içi bağlantı konusunu ele alırken, Baglantilar sayfasından Oneriler sayfasına bağlantı yapmıştık. Aynı şeyi siz burada da Tartışma sayfası için yapabilirsiniz. Birlikte elektronik posta bağlantısını ele alalım.

Hatırlıyorsanız, Internet’de bilgisayarlararası alış veriş protokollerinden birinin Posta Ulaşım Protokolü (SMTP) olduğundan söz etmiştik. Elektronik postanın hangi protokolle gelip-gittiği bir süre öncesine kadar kullanıcı açısından önem taşıyordu. Fakat günümüzde elektronik mektup alış verişini de artık Browser programları yapıyor. Browser programları ise elektronik posta bağlantısı ile HTTP ve diğer bağlantı türleri arasındaki farkı, sayfa tasarımcısının bu bağlantıya verdiği kod sayesinde anlayabilirler. Elektronik posta adresi ile bağlantılı bir link kelimesini (veya grafiğini) tıklayan ziyaretçinin Browser programı elektronik posta bölümünü çalıştıracak ve alıcı hanesine bizim adresimiz yazılmış bir yeni mektup formu açacaktır.

Yine teoriyi fazla uzatmadan, uygulamaya geçelim; biraz önce kendi sitemiz içinde ve kendi sitemiz dışında verdiğimiz bağlantılarla elektronik mektup adresi bağlantısı arasındaki farkı görelim. Bu bağlantıyı sağlamak için, Başka Siteler sayfasında “elektronik mektupla” kelimelerini tarayarak seçin ve Araç Çubuğu’nda “Create or Edit Hyperlink” simgesini tıklayın.

Kutu, bu iki lekimede bir bağlantı mevcut olmadığı için “Create Hyperlink” (Bağlantı oluştur) başlığıyla açıldı. URL hanesinin sağında dört simge görüyorsunuz. Bunlardan üzerinde büyüteç olan dünya şeklindeki simgeyi tıklayarak Web Browser’ınızı çalıştırabilir ve Internet’te kısa bir turla arzu ettiğiniz site veya sayfaları bulup, bu site veya sayfanın adresini URL hanesine yazdırabilirsiniz.

Üzerinde büyüteç olan klasör şeklindeki ikinci simge ise bilgisayarınızdaki bir dosyaya bağlantı vermenizi sağlar. Fakat hemen belirtelim: bu dosya sizin bilgisayarınızda durduğu sürece, sitenizi Internet’e “koysanız” bile, bu dosyaya verdiğiniz bağlantı, ziyaretçiler açısından bir işe yaramayacaktır. (Tabiî Web Server sizin bilgisayarınızda çalışıyor ve bilgisayarınız da bir kablo ile Internet’e bağlı ise, mesele yok. Ama sitenizi bir evsahibinin Web Server’ına “gönderecekseniz,” bağlantıların sizin bilgisayarınızdaki dosyalara değil Web Server’da bulunan dosyalara işaret etmesi gerekir. Bunu, bu dosyaları FrontPage’in sabit diskinize kurduğu FrontPage Web’e aktararak ve bağlantıları sabit diskte bir klasöre değil, FrontPage Web’e işaret ederek sağlamanız gerekir.

Bu simgelerden zarf şeklindeki üçüncüsü, şu anda aradığıımız elektronik adres linki verme aracıdır. Dördüncü simge ise boş bir sayfa oluşturup, bu sayfaya link vermekte kullanılır. Eğer “elektronik mektupla” kelimeleri halâ işaretli ise şimdi, elektronik adres linkini tıklayalım.

<FP00027.tif>

Ve açılan kutuda Type an E-mail address (Bir elektronik posta adresi yazınız) denilen yere adresimizi yazalım; OK’ye tıklayalım. Bağlantı oluşturma diyalog kutusuna geri döndüğünüzde URL hanesine “mailto:hocal@pcworld.com.tr” (veya siz nasıl bir adres yazdı iseniz, o adresin) yazıldığını görüyor musunuz? Belirttiğimiz gibi Internet’de URL adresi, HTTP, FTP veya elektronik posta adresi olabilir. Nitekim, kutunun da OK düğmesini tıklayarak, Baska Siteler sayfasına döndüğünüzde, “elektronik mektupla” kelimelerinin de diğer bağlantı kelimeleriniz gibi özel biçime girdiğini göreceksiniz.

/////////////KUTU///////////////////

FrontPage Editör’de, yaptığınız bağlantıları izlemek istiyorsanız, bağlantı kelimesinin veya resminin üzerini, klavyede Ctrl tuşunu tutarken tıklayın. Sanki sayfanız gerçekten Internet’te imiş gibi, sayfa bağlantılarını izleyebilirsiz.

FrontPage Editör’de Mouse işaretçisini herhangi bir bağlantı kelimesi veya grafiğinin üzerine getirdiğinizde, pencerenin sol alt kenarında bağlantının URL’i gösterilecektir.

////////////////////////KUTU BİTTİ/////////////////

Bağlantıları Kaldırmak İstiyorsanız

FrontPage’de, sitenizdeki bir sayfayı kaldırmanız halihde site içi bağlantıları, dışarıya verdiğiniz bir bağlantıdan bağlantıdan vaz geçmeniz halinde de site dışı bağlantıları kaldırmanız gerekir.

FrontPage, otomatik olarak kurduğu site içi bağlantıları, bağlantılı sayfa silindiği taktirde kendiliğinden kaldıracaktır. Kimi zaman bir sayfayı silmeden, site dışında bırakmak isteyebilirsiniz. FrontPage, bu durumda da bağlantıları yok edecektir.

FrontPage Explorer’da Navigation görünümünde iken, kaldırmak veya site dışı bırakmak istediğiniz bir sayfayı sağ-tıklayın ve açılacak kutuda ne yapmak istediğinizi belirtin:

<FP00028.tif>

Açılacak kutudaki birinci tercih, (Remove this page from all navigation bars) sadece bu sayfayı site dışı bırakır. İkinci tercih (Delete this page from the FrontPage Web) sayfayı hem tümüyle yok eder, hem de bağlantılarını kaldırır. Site dışı bağlantıları kaldırmak ise otomatik olarak yapılamaz; bu tür düzeltmeleri sizin yapmanız gerekir.

Sayfalarınızdaki Navigation çubuklarında farkettiğini gibi, FrontPage, sitenizdeki sayfaların birbirine göre konumunu, hangi sayfadan hangisine geçilebileceğini ve bütün sayfalardan ana sayfaya bağlantıyı kendisi otomatik olarak veriyor. Fakat bazen sitenin bir sayfasının içindeki bir kelimeden bir başka sayfaya bağlantı kurulabilir. Bu bağlantı FrontPage için otomatik Navigation bağlantısı sayılamaz. Bu bağlantıların düzeltilmesi yarı-otomatik olarak yapılır.

FrontPage site içi ve dışı, Navgation çubuklarında veya metinlerde ve grafiklerde, kendi kurduğu veya sizin kurduğunuz bütün sayfaların bütün bağlantılarının bir envanterini tutar. Bu envantere göre durumu bilinmeyen veya koput bağlantıları, FrontPage Explorer’da Hyperlink Status (Bağlantıların Durumu) görünümünde inceleyebilirsiniz:

<FP00029.tif>

Buradaki örnekte, Bugs.htm sayfasını sildikten hemen sonra sitenin bağlantı statüsünü görüyoruz. Bugs.htm sayfasına verilen bağlantının koptuğu (Broken/Kopuk) kelimesiyle belirtiliyor. Diğer bağlantılarımızın önündeki “Unknown/Bilinmiyor” kelimesi ise, FrontPage’in bu bağlantıyı sınamadığını gösteriyor. FrontPage, bir Web Browser gibi, bağlantı verdiğiniz bütün siteleri arayıp, verdiğiniz adresin işe yarayıp, yaramadığını sınayabilir. FrontPage’in bunu yapabilmesi için, kurulu olduğu bilgisayarın Internet bağlantısı olması şarttır. Linklerinizi sınamak istiyorsanız, Tools/Araçlar menüsünden, Verify Hyperlinks/Bağlantıları Doğrula maddesini seçmeniz yeter:

<FP00030.tif>

FrontPage, bütün bağlantılarınızı tek tek arayarak, temas kurulup kurulamadığını araştıracaktır. FrontPage’in yukarıdaki envanteri verdikten sonra yaptığı doğrulama araştırması, benim bilgisayarda şu sonucu veriyor:

<FP00031.tif>

Biri dışında durumu bilinmeyen bütün bağlantıların doğrulandığını, yanlarındaki OK/Tamam yazısından anlıyoruz. FrontPage, “Fotosite.com” adresinin kopuk olduğunu bildiriyor. (Tabii bildirir; çünkü böyle bir site yok. Örnek olarak, biz uydurmuştuk!) FrontPage’nin sitemizi ilk oluşturduğu sırada yaptığı Bugs sayfasını işimize yaramayacağı düşüncesiyle biz sildik; sayfanın bütün bağlantıları otomatik olarak kaldırıldı; fakat bu sayfaya bir bağlantı halâ durduğu için, FrontPage tarafından kopuk olarak işaretleniyor.

Şimdi bu bağlantıyı kaldırarak, bir bağlantı kaldırma alıştırması yapabiliriz. Kopuk bağlantının bulunduğu sayfanın adını sağ-tıklarsanız, açılacak menüde, Edit Hyperlink/Bağlantıyı Düzelt ve Edit Page/Sayfayı Düzelt şeklinde iki tercihiniz olduğunu görürsünüz. Bu maddelerden birincisi size, mevcut HREF komutunun karşısındaki URL adresini yenileme imkanı verir. Bu maddeyi seçerseniz, karşınıza şu kutu gelecektir:

<FP00032.tif>

Bu kutunun yardımıyla, olmayan sayfaya (bu örnekte, sildiğimiz Bugs.htm sayfasına) verilen bütün bağlantıları başka bir sayfaya aktarabiliriz. Olmayan sayfaya bağlantı Tavsiye.htm sayfasından geliyor. Kutunun birinci bölümündeki “Replace hyperlink with/Bağlantıyı ... ile değiştir” kutusuna olmayan sayfanın yerini alacak bir bağlantımız varsa, o sayfanın adını yazabiliriz. Böyle bir sayfa olduğunu biliyor, ama dosya adını tam bilmiyorsanız, Browse/Gözat düğmesini tıklayarak, bu dosyayı arayabilirsiniz. Kimi zaman, bu bağlantının yerini başka bir sayfanın almasını istemeyebilirsiniz. O zaman ya kopuk bağlantılı sayfanın adını sağ tıkladığınız zaman çıkan menüde ikinci maddeyi ya da burada sağda gördüğünüz Edit Page/Sayfayı Değiştir düğmesini tıklayarak, kopuk bağlantının bulunduğu sayfayı Editör’de açıp, bağlantıyı elle kaldırmanız gerekir.

Biz şimdi bu ikinci yolu izleyerek, Tavsiyeler sayfasındaki bağlantıyı yok edelim. Burada Edit Page düğmesini tıkladığımızda, Editör, tavsiyeler.htm dosyasını (başka bir deyişle, Tavsiyeler sayfasını) açacak ve kopuk bağlantının bulunduğu kelime veya kelimeleri (veya grafiği) seçecektir:

<FP00033.tif>

Bu sayfa, FrontPage tarafından otomatik yapılmış İngilizce bir sayfa olduğu ve henüz kendi içeriğimizi koyarak düzeltmediğimiz için, içeriği ile fazla ilgilenmeden, sadece bağlantısına bakalım. Aynı işlemleri yapıyorsanız, karşınızdaki sayfada Bug Report Form kelimelerinin seçildiğini göreceksiniz. Sayfada başka bir yeri tıklamadan, Edit/Düzen menüsünde Unlink/Bağlantıyı kaldır maddesini tıklayın. Bağlantının bulunduğu üç kelime, bağlantı biçiminden çıkacaktır. FrontPage’de herşey kolay demiyor muydum?

FrontPage’de bağlantı verme ve bağlantı kaldırma konusunu ele aldığımız bu dersin sonuna geldik. Bu derste bir kaç yerde “bağlantı verilmiş kelime veya kelimeler ya da grafikler..” dediğimizi farketmiş olmalısınız. Şu ana kadar, bir kaç sayfaya fotoğraf koyarak, sayfamızı güzelleştirdiğimiz halde, grafiklere nasıl bağlantı verilebileceğine değinmedik. Gelecek derste, sayfa biçimleme konusuna biraz daha yakından bakarken, grafiklerimize de bağlantı verme alıştırması yapacağız.

Ders 4: Sayfaları İşleyelim

Bu derste FrontPage’nin hazır sayfalarının görünümlerini değiştirmeyi, sayfadaki yazıları düzenlemeyi ve sayfanın temasını değiştirmeyi ele alacağız.

Web sayfaları “bilgi vermek” amacıyla vardır. Internet ziyaretçileri yeni oyunlar hakkında bilgi edinmek istiyor da olsalar, sonuç itibariyle bilgi edinmek istedikleri için sitenize geleceklerdir. FrontPage’nin hazır sayfalarında yapacağınız en önemli değişiklik, içi boş sayfalara vermek istediğiniz bilgileri koymak ve sırf yer tutması için konulmuş metinleri kendi metinlerinizle değiştirmek olacaktır. Sonra sıra her yayın organının sayfası gibi, Web sitenizin sayfalarında görsel etki bakımından arzu ettiğiniz düzenlemeyi yapmaya gelecektir.

Internet siteleri, gazete, dergi gibi bilgi vermekle birlikte, yazılı yayın aracı ile televizyon arasında bir noktada bulunuyorlar. Yani bir Web sitesi, gazete veya dergi gibi metne dayalı unsurlara yer verebildiği gibi, bunlardan farklı (ve üstün) olarak, televizyon unsurlarına da yer verebilir; bir Web sayfasında hareketli görüntü ve ses unsurları bulunabilir.

Bu web sitesi sahibi ve sitenin tasarımcısı olarak karşısına ciddi bir durum çıkartıyor demektir. Gazetecilik okullarında, yazılı yayın araçları ile televizyonda görsel tasarım birbirinden çok farklı dersler olarak okutulur. Bunun sebebi iki aracın, yazılı ve görüntülü yayın organlarının okuyucu veya izleyici üzerindeki etkilerinin birbirinden farklı olmasıdır. Bu ikisi başlı başına uzmanlık alanlarıdır. Şimdi siz Web tasarımcısı olarak, bir kaç saat içinde bu iki alanda da uzmanlaşmak zorundasınız!

İşte bu işi FrontPage ile yaptığınız için mutlu olmanız gereken bir an daha! FrontPage’i tasarlayanlar, hemen her türlü ihtimale ve zevk türüne göre farklı temalar ve multimedya dediğimiz hareketli veya sabit imajlara (fotoğraf, resim veya video gibi) ve sese dayanan malzemenin sayfalarda kolay ve etkili kullanımını sağlamış bulunuyorlar. Bize kalan, kendi zevkimize uygun bir tema ve Internet’te yayınlamamızda hukukî sakıncası olmayan malzemeyi bulmaktan ibaret.

“FrontPage uzmanları her zevki dikkate almışlar,” dedik, ama Internet’in ortak dili olan HTML ve Internet ziyaretçilerinin bu amaçla kullandıkları Browser programların bu dili yorumlama yetenekleri, bize görsel etki amacıyla sayfalarımızda istediğimiz herşeyi yapma imkanı da vermiyor, veremiyor. Bir kere, sayfalarımızın PC ve Mac gibi farklı bilgisayar cihazları ve bu cihazlarda bulunan farklı işletim sistemleri yüzünden asgarî ortak bir noktada tasarlanması gerek. HTML dili, bu sebeple, oldukça sınırlı imkanlara sahiptir.

Oluşturduğu sayfaları HTML dosyası olarak kaydetmek zorunda olan FrontPage, bir masaüstü yayıncılık veya grafik tasarım programı gibi, sayfalarınızı çok fazla işlemenize izin veremez. Bununla birlikte şu anda 4’ncü sürümüne ulaşmış bulunan HTML dilini de pek yabana atmamak gerekir. Dikkatli ve becerikli bir kullanımla FrontPage Editör’de masaüstü yayıncılık programlarına yakın güzellikle sayfalar yapabilirsiniz. Üstelik bu sayfalarda masaüstü yayıncılık programlarının ürünlerinde hiç bir zaman bulunamayacak video ve ses unsurları bulunabilir.

Yazıları Biçimlendirme

Web, yayın aracı olarak gazete ile televizyon ortasında bir konuma sahiptir. Şimdi Web sayfasının gazete-dergi niteliği ile ilgili görsel araçlara bakalım.

Şimdi, FrontPage’de Navigation görünümünde, daha önce üzerinde çalıştığımız Fotoğraflarım sayfasını iki kere tıklayın; sayfa Editör’de açılsın.

<FP00034.tif>

Dikkatlice incelerseniz, bu sayfanın hiç de albenisi olmadığını göreceksiniz. Evet, tema bakımından, ortak başlıklar, site içinde sayfadan sayfaya hareket bağlantıları gibi teknik özellikleri açısından sayfamız kusursuz görünüyor; hele sayfanın gerisindeki 250 satırlık HTML kodunun tek kelimesini bile biz yazmamış olduğumuza göre, bundan iyisi can sağlığı sayılabilir.

Fakat yine de bu sayfada bir başlık yok ve metin yazıları çok “normal” görünüyor. Normal görünmesinin sebebi, bu yazıların stilinin “Normal” olmasından geliyor!

//////////////////KUTU///////////////////////

Sitenizi arada bir yayınlıyor musunuz?

Fotoğraflarım sayfasının buradaki görünümünün FP Editör’deki görünümü olmadığını farketmiş olmalısınız. Bir kere bu görüntünün FP Editör veya MS Internet Explorer değil, Netscape Communicator programına ait olduğunu görüyorsunuz. FP ile oluşturduğunuz sayfalarınıza, projenin çeşitli aşamalarında FP Web’i IE ve Netscape ile gerçek bir Internet sayfası zilaret ediyormuş gibi bakmanızda yarar var. Bir kere sayfalarınızın farklı browserlerda nasıl görüntülendiğini görmek, işin başında iken hoşunuza gitmeyen şeyleri düzeltmeniz için size zaman kazandırır. Bunu sağlayabilmek için, henüz bitmemiş de olsa, sitenizi arada bir, sanki gerçek Web’e gönderiyormuş gibi, sabit diskinizde geçici bir klasöre “yayınlamanız” gerekir. FP, bir sitenin FP Web’den gerçek Internet’e gönderilmesine “yayınlamak” (Publish) diyor. Sitenizi gerçek Internet’e ulaştırmanız için yapmanız gereken işleri ilerde ele alacağız. Fakat burada sitemizi bütün sayfalarıyla ve sayfalardaki unsurları ile birlikte Internet’e değil, sabit diskte başka bir klasöre göndermek istiyoruz. FP Web’de iken sayfalarımızda belirgin olan otomatik unsurların komutları, sayfalar başka bir klasöre kaydedildiğinde yerini ya gerçek düğmelere bırakacaktır, ya da kullanılmayan düğmeler ve bağlantı yerleri silinecektir. Bu, sayfaların “bitmiş şeklini” görme imkanı verir.

FP Explorer’da, Araç Çubuğu’ndaki  Publish düğmesini tıkladığınızda açılacak diyalog kutusunda FP’in kendi Web’i (çoğunlukla “Root Web” adıyla gösterilir) ve yanında More Webs (Başka Web’ler) düğmesi bulunur. “Başka Webler,” sabit diskinizde bir klasör olabileceği gibi, Internet’te siteize evsahipliği yapacak firmanın Web Server’ı da olabilir. Şimdilik sitenizi sadece sabit diskte başka bir dizine kopyalamak istiyoruz. More Web düğmesini tıkladığınızda açılan kutuya sitenizin şu andaki haliyle tamamlanmış şeklinin kopya edilmesini istediğiniz klasörü yazın ve OK’i tıklayın.

<FP00035.tif>

Şimdi, bu yeni dizindeki sayfalarınızı gerçek bir Internet sitesi gibi, sayfadan sayfaya geçerek, istediğiniz Browser ile denetleyebilirsiniz.

/////////////////////////KUTU BİTTİ/////////////////////////

Stiller

HTML, en sabit şekliyle, Web tasarımcısına 15 adet önceden tanımlanmış stil kullanma imkanı veriyor. Normal de bu stillerden biri ve en temel olanı. Stil, bir yazının harf türü, harfin koyu, normal, italik veya altı çizgili oluşu, harfin büyüklüğü, harfin rengi, yazının Browser penceresine veya bir çerçeve içinde ise çerçevenin iki kenarına göre sağ mı, sola mı hizalanacağı veya ortalanacağı, gibi özelliklerine topluca verilen addır. HTML, ilk günlerinde sadece alıp-vermeye yaradığı (grafik unsurlar bile şifrelenmiş düz yazıya çevrilerek verilebildiği) için, Web Browser programlarının temel metin stilleri çok sınırlıdır. Oysa günümüzde Web Browser’lar (Cascading Stil Sayfaları denen yöntem sayesinde) bu temel 15 stilden daha fazla metin görüntüleme imkanına sahiptir. (FrontPage, Format/Biçimle menüsünden Steylesheet maddesini seçerseniz, size kendi stillerinizi oluşturma imkanı verir. Fakat bunu yapabilmek için, burada yerimiz yok.)

Yine teoriye fazla zaman ayırmadan, uygulamaya geçelim. Mevcut 15 stilin genel hatları ile metinlerimize nasıl biçimler kazandırdığına değinelim. Bunu yapabilmek için, biraz önce açtığımız Fotoğraflarım sayfasındaki yazının birinci kelimesinden önce, “Eleştirilerinizi Bekliyorum” yazın ve Enter tuşuna basın. Bu iki kelime şimdi bağımsız bir paragraf oluşturdu.

Metin imleci bu paragrafın içinde iken (yani iki kelimeden birini tıkladıktan sonra) Change Style/Stil Değiştir penceresinin seçme okunu tıklayın; açılacak listeden, Heading1 (Başlık 1) stilini seçin. İki kelimebüyük bir şekilde neredeyse sayfanın sağından soluna tümünü kaplayacak büyüklüğe ulaştı. Aşağıda, FP’in altı başlık büyüklüğünü bir arada görüyorsunuz:

<FP00036.tif>

Sayfalarımızda dikkat çekmek istediğimiz başlıklara, ara başlıklara, alt başlıklara, bu listeden uygun bir başlık stili seçerek, metin yazılarının stili olan Normal’den farklı bir nitelik kazandırabiliriz. Başlık stili seçmede gözetilecek ilke, başlığın sayfanın bilgi düzenlemesi açısından sadece bölüm değiştiği mesajını verebilmektir. Başlıklar dikkati tümüyle kendisinde toplarsa, sitenizi ziyaret edenin gözü, başlığın belirttiği asıl metin yazısına kaymaz. Sayfadaki tüm başlıkların birbirini dengelemesi, başlıkların büyükten küçüğü doğru gitmesi gerekir. Küçük bir başlıktan sonra büyük bir başlığın gelmesi, gazete-dergi okuyucularının bunca yıldır göregeldikleri sayfa düzenlemelerinden alıştıkları şekilde, konunun değiştiği izlenimine kapılmalarına yol açabilir.

FP’in stil listesinde daha başka stillerin adlarını da gördünüz. Bunları uygulayabilmek için, bir alıştırma daha yapalım. Fotoğraflarım sayfasındaki birinci paragrafın sonuna “Bu sayfalarda” kelimelerini yazın ve klavyede Enter tuşuna basın. Yeni paragrafa “Gezi” yazın, Enter’a basın. Sonra “Doğa,” “Portre” ve “ve Diğer” kelimelerinin bulunduğu üç paragraf daha yapın. Ve nihayet eski ikinci paragrafın başına “fotoğraflarımdan örnekler var.” yazın. Şimdi, Mouse işaretçisiyle Gezi kelimesinin başınhdan “Diğer” kelimesinin sonuna kadar tarayın; ve stil listesinden “Bulleted list” (Noktalı liste) maddesini seçin. Dört kelimenin de başına sitemize uyguladığımız temanın ortak nokta grafiği geldi ve kelimeler Normal paragrafa göre, bir santimetre içeri kaydı:

<FP00037.tif>

Bu kelimeleri seçerek ve listeden diğer liste türlerini tıklayarak, aralarındaki stil farklarını inceleyebilirsiniz.

Yerel Biçimlendirme

Yukarıda FP’in temel ve bütün Web Browser programları tarafından anlaşılan stilleri ile yaptığımız biçimlerdirmeye genel biçimlendirme denir; çünkü bu yolla bütün paragrafın genel stilini değiştirmiş oluyorsunuz. İster tek kelime, ister 200 satır olsun, paragrafın bütün üyeleri seçtiğiniz stilin bütün özelliklerini topluca kazanmış oluyorlar. Kimi zaman böyle genel biçimlerdirmeye değil, paragraf stili ne olursa olsun, sadece bir veya bir kaç kelimeyi, bir ya da bir kaç harfi biçimlendirmek isteyebilirsiniz. Buna yerel biçimlendirme denir.

Yerel biçimlerdirme, özellikle Normal stildeki metin yazılarında bir ya da bir kaç kelimeye dikkat çekmek için uygulanabilir. Mesela, buradaki örnek sayfamızda ziyaretçilerimize, fotoğraf sayfamızın amacını vurgulamak için, dikkatlerini özellikle “beğenilerinize ve eleştirilerinize” kelimelerine çekmek isteyebiliriz. Bu iki kelimeyi tarayarak seçin ve Stil seçme kutusunun bulunduğu Araç Çubuğu’ndaki B harfiyle gösterilen simgeyi tıklayalım. Seçili iki kelimenin türü koyu harf oldu. Bu simgenin yanındaki öne eğit I harfi şeklindeki italik, ve altı çizili U harfi şeklindeki Underline/Altını Çiz simgelerini tıklayın; değişiklikleri inceleyin. Aynı sırada ressam paletine benzeyen renk seçme simgesini tıklayarak, bu iki kelimeye bir de renk verin:

<FP00038.tif>

Yerel biçimlendirme, teknik anlamda yerel sayılsa bile, bütün bir sayfaya, uzun bir yazının tümüne uygulanabilir. Buradaki değişiklikleri yapmak için yararlandığınız simgelerin yanında içinde muhtemelen Arial yazılı harf seçme kutusunu farketmiş olmalısınız. Bu kutunun yanındaki seçme okunu tıklayarak, seçili metinlerinize (veya yeni yazmaya başladığınız bir yazıya) arzu ettiğiniz fontu verebilirsiniz. Fakat bunun bir sınırı var: FrontPage, burada sizin bilgisayarınızda bulunan harf türlerini sıralamaktadır. Bu listeden seçeceğiniz harfler, ziyaretçilerinizin hepsinin bilgisayarında bulunmayabilir. Özellikle şimdi bir çok bilgisayarın Windows kurulu olarak satıldığını ve bu bilgisayarlarda Microsoft’un temel Web harfleri dediği farklı harflerin yüklenmiş olduğunu düşünürseniz, sayfalarınızda bütün bir yazıyı seçerek, listeden hoşunuza giden ve Windows 95/98 kurulu bilgisayarların çoğunda bulunabilecek bir harf türünü seçerek, yerel imkanları kullanmak suretiyle genel biçimlendirme yapabilirsiniz. Ama tekrar edelim; sizin bilgisayarınızda bulunan her harf ziyaretçilerinizin bilgisayarında bulunmayacaktır; ziyaretçinin Browser programı ziyaretçinin bilgisayarında bulunmayan bir harf talep edildiği zaman kendi varsayılan harfine dönecektir. Bu harf, sizin sayfanızda oluşturmak istediğiniz görsel etkiye uygun olmayabilir.

Yaptığınız bir genel (stil değiştirerek), veya yerel biçimlendirmeyi beğenmezseniz, Edit/Düzen menüsünden Undo/Geri Al maddesini seçerek, eski biçime geri dönebilirsiniz.

Sayfa Biçimlendirme Unsurları

HTML dili, bütün basitliğine rağmen, sayfalarınızda bir çok görsel etkiye imkan verecek araçlara sahiptir. Yatay çizgi, tablo ve çerçeve bu unsurların başında gelir. Burada yatay çizgi ve tabloyui ele alalım; çerçevelere kapsamı geniş olduğu için ayrı bir derste değinelim. Ayrıca FP, sitemizin tümüne uygulamayı öğrendiğimiz temaları, sayfalara tek tek de uygulayabilir ve sayfalarımıza birbirden farklı temalar seçebiliriz. Bu dersin sonunda tüm sitenin değil sadece bir sayfanın temasını değiştirme konusunu ele alacağız.

Yatay Çizgi:

Sayfanızda yer alan bilgileri gruplandırarak birbirinden ayırmak ve ziyaretçinizin dikkatini yeni bir grup bilginin başladığına çekmek istiyorsanız, yatay çizgiden yararlanabilirsiniz.

Örnek sayfamızda, iki paragrafı birbirinde bir yatay çizgiyle ayırarak, alıştırma yapabiliriz. Birinci paragrafın son kelimesinden sonra klavyede Enter tuşuna basın; metin imleci yeni paragrafın başında iken, Insert/Ekle menüsünden Horizontal Line (Yatay çizgi) maddesini seçin. İki paragrafın arasına, yazının paragraf eni kadar uzunlukta bir yatay çizgi belirecektir. Bu çizgi, FP’e sayfalarınıza uygulattığınız ortak temanın gerektirdiği görsel nitelikte olacaktır.

Burada bir parantez açalım; HTML’de dikey çizgi olmadığını belirtelim. Bunun sebebi, HTML’in Browser tarafından “satır satır” icra edilmesidir. Dikey çizgi, yanındaki metnin birden fazla satırının kapladığı alanı kaplayacağı için, Browser önce çok-satırlı bir unsuru, ardından da tek satırlı bir başka unsuru görüntüleyemez. Sayfalarınıza dikey çizgi koymak için tablodan yararlanabilirsiniz.

Tablo:

Bir Web sayfasında bilginin sunuluşunu düzenleyen iki araç vardır: liste ve tablo. FP’de bir metnin nasıl liste haline getirileceğini yukarıda ele aldık. Tablo, HTML’de hem bilginin sunuluşuna tertip-düzen getiren ve anlamayı kolaylaştıran bir araçtır; hem de HTML sayfalara yapısal iskelet kazandırır. Burada kısaca tablonun bu iki kullanım alanına değinelim.

Sayfalar dolusu tanımlama yazısı yerine bu yazıda yer alan bilginin sütun ve sıralar halinde dizilen kutulara bölünerek sunulması, kavramayı arttıran bir araçtır. Sayfalarınızda bir çok bilgiyi tablolar halinde sunarak, yer kazanabilirsiniz.

Şimdi bir örnek yapalım. Önce, FP Explorer’da Navigation görünümünde iken Yenilikler sayfasını bir kere tıklayarak seçin ve Araç Çubuğu’nda New Page (Yeni Sayfa) simgesini tıklayın. Yenilikler sayfasının altına bir yeni sayfa eklenecektir. Şiemdi bu yeni sayfayı sağ-tıklayın ve menüden Rename/Yeniden Adlandır maddesini seçin. Yeni sayfanın adını, “Yeni filmler” yapın. Bu sayfada ziyaretçilerimize yeni çıkan filmler hakkında bilgi vereceğiz. Navigation görünümünde, altta dosya adlarının bulunduğu bölümde bu sayfaya Yeni.html adının verildiğini göreceksiniz; bu adı da film.htm yapın.

İster kelime-işlem programınızda yazarak ve RTF biçiminde kaydederek ve daha sonra sayfanıza Insert menüsü yoluyla ithal ederek, ister doğruca sayfanın içinde yazarak, (isterseniz, PC World sitesinden indirerek) şu metni sayfanıza girin:

“Burada piyasaya yeni sürülen filmlerle ilgili bilgiler veriyoruz. Bu bilgiler, denediğim ve aldığım sonuçları yansıtmaktadır. İmalatçı firmaların tavsiyeleri ve sizin alacağınız sonuçlar farklı olabilir.”

Şimdi, “olabilir” kelimesinden sonra klavyede Enter tuşuna basın ve yeni bir paragraf açın. Metin imleci yeni paragrafta iken Araç Çubuğu’nda Insert Table/Tablo Ekle simgesini tıklayın; fakat Mouse’un düğmesini bırakmayın. Simgenin hemen altında boş bir tablo görüntüsü oluşacaktır; şimdi Mouse’u, üç kutu aşağı, üç kutu sağa yürütün. Tablo görüntüsünün altında “3 by 3 table” (3’e 3 tablo) kelimelerini görüyor musunuz? Bu şu anda oluşturmak üzere bulunduğunuz tablonun kaç sütunu, kaç sırası olduğunu gösteriyor. Şimdi Mouse’un düğmesini bırakın; yeni paragrafınızın olduğu yerde üç sütunlu, üç sıralı ve kutuları boş bir tablo oluşacaktır. (Kendinizi kutlayın; şu anda tam 16 satırlık bir HTML kodu yazmış bulunuyorsunuz!)

<FP00039.tif>

Sonra bu tablonun birinci sütundaki kutularına film adlarını, ikinci sütundaki kutulara türünü ve üçüncü sütuna bu film hakkındaki izlenimlerinizi yazın. Tabii amatör fotoğrafçı değilseniz, bu kutulara “nmnmnmnmn” veya “ababababa” yazmanız da mümkün! Sonuçta ortaya şöyle bir tablo çıkacaktır:

<FP00040.tif>

Tablunuzun kutularındaki metinlere, stil yoluyla veya yerel biçimlendirme yöntemiyle istediğiniz şekli verebileceğinizi; isterseniz yazıları renklendirebileceğinizi, hizalarını değiştirebileceğini söylemek bile gereksiz. Fakat belirtememiz gereken bir iki nokta var:

Tablonun özellikleri: Mouse işaretçisini tablonun yazı bulunmayan bir yerine getirdiğiniz zaman, simgenin metin imleci değil ok halini aldığını farkettiniz mi? Bu durumda iken Mouse’u sağ tıklayın; açılacak menüden Table Properties (Tablo Özellikleri) maddesini seçin. Açılacak kutuda, tablonun kendisini biçimlendirmekte kullanacağımız bir çok kontrolle karşılaşacaksınız:

<FP00041.tif>

Bu kutuda önce tablonun kendisinin sayfada hiza durumu ve konumu, ve çerçeve çizgisinin piksel olarak kalınlığı (0, çerçeve çizgisi olmasın demektir), tablonun kutularında çerçeve ile içerik arasında bırakılacak boşluk ve kutuların arasındaki tamponun genişliği gibi özelliklerini ayarlama imkanı veren Layout (Yerleşim) bölümü vardır. Alignment (Hizalanma) kutusunun yanındaki oku tıklarsanız, tablonun tümünün bulunduğu yerde sola (left), sağa (right) ve ortaya (center) hizalanmasını sağlayan veya bunu browser’ın varsayılan ayarlara bırakan 8default) seçenekleri göreceksiniz. Aynı bölümdeki Float (Yüzme) kutusu ise tablonun çevresindeki unsurlar tarafından sağa mı, sola mı itileceğini tayin eder.

Layout bölümünün yanında Minimum Size (Asgarî büyüklük) bölümü bulunur. Tabloların ölçüsü, varsayılan ölçü olan yüzde ile, içinde bulunduğu sayfanın veya çerçevenin (tablo, tablo içinde ise içinde bulunduğu kutunun) yüzde 100’ünü kaplayacak şekilde oluşturulur. Fakat çoğu zaman tablonuzun eninin bulunduğu yerde asgari ne ölçüde olmasını istediğinizi belirtebilirsiniz. Bunu yüzde olarak da yapabilirsiniz; piksel olarak da.

/////////////KUTU////////////////////////

YENİ ÖLÇÜ BİRİMİNİZ PİKSEL

Bugüne kadar santimetre ile düşünmeye alışıktınız. Önce televizyon sonra da bilgisayar ekranları sizi inç ölçüsüne alıştırdı. Ama bir Web tasarımcısı olarak bundan sonra Piksel diye birimle düşünmek zorundasınız. İşin kötüsü, mesela 10 piksel bazen 1 milimetre olabilir, bazen yarım! Bu ne biçim ölçü demeyin. Piksel, ekran kartınızın ekranda (monitör), bir “ekran dolusu” bilgiyi (yazıyı, resmi, çizgiyi ve ekranda gördüğünüz herşeyi) yatay ve dikey olarak kaç nokta ile canlandırdığını belirten bir ölçüdür. Başka bir deyişle, ekranınızdaki en küçük birim, piksel’dir. Ekran kartı, standart VGA ölçüleriyle çalışıyorsa, “bir ekran dolusu” görüntüyü yatay 640, dikey 480 nokta ile oluşturur. Yok eğer yeni ve marifetli bir ekran kartınız varsa, aynı fikizî ekrana, yatay 1600, dikey 1200 nokta da koyabilir. Buna ekranın çözünürlüğü denir. Çözünürlük ne kadar büyük olursa, ekrandaki “cisimler” o kadar büyük olur, dolayısıyla ekrana o kadar “az şey” sığar. Çözünürlüğü 640x480 olan bir ekran kartı, diyelim ki çaprazlama ölçüsü 14 inç olan bir ekranda, bir fotoğrafı sağdan sola, yukarıdan aşağıya ekranı dolduracak ölçüde görüntülüyor. Aynı ekranı, 1280x860 piksel olan bir grafik kartına bağlar ve aynı fotoğrafı görüntülerseniz, bu kez fotoğraf ekranın sadece dörtte birini dolduracaktır. Web tasarımcısı olarak ölçülerinizi piksel olarak vermekle, tablolarınızın, çerçevelerinizin veya grafiklerinizin, izleyicinin grafik kartına ve ekranının büyüklüğüne göre kaçta kaçında oluşturulmasını istediğinizi nisbî (rölatif) olarak belirtmiş oluyorsunuz. Bu aslında size tasarladığınız sayfanın ziyaretçinin bilgisayarında  nasıl görünmesini istiyorsanız öyle görünmesini sağlama imkanı veriyor.

Bu arada Web sayfalarında “Bu sayfa en iyi şu çözünürlükte, şu renk derinliğinde görünür,” veya “Şu browser’ı kullanırsanız daha iyi olur!” gibi uyarılar, Internet ahlâkına aykırıdır; ziyaretçiyi sitenizden soğutmak istemiyorsanız, bu tür “uyarılardan” kaçının.

//////////////////////////KUTU BİTTİ///////////////////

Tabloların yüksekliği de ölçü olarak belirtilebilir. Ancak tablo yüksekliğini genellikle içeriği belirler. Tablodan iskelet unsuru olarak yararlanmak istiyorsanız, yükseklik ölçüsü verebilirsiniz.

Tablo özellikleri kutusunun Custom Background (Özel zemin) bölümünde Use Background Image (Arka-plan resmi kullan) kutusuna işaret koyar ve yanındaki Browse (Gözat) düğmesini tıklayarak bir grafik dosyası seçerseniz, seçtiğiniz grafik (fotoğraf veya resim) tablonun tümüne arka-plan olarak yerleştirilir. İsterseniz tablonun tümüne, Bacground Color (Zemin rengi) kutusunun seçme okunu tıklayarak açılacak tablodan zemin rengi de seçebilirsiniz.

Bir tablonun unsurlarının ayarlanması için imkanlarınız bununla sınırlı değil. Bir tablonun hücrelerinin özellikleri de ayrı ayrı belirlenebilir. Tablonun herhangi bir hücresini tıkladığınızda açılacak menüden Cell Properties (Hücre Özellikleri) maddesini seçerek, sadece içini tıkladığınız hücrenin özelliklerini belirleyebilirsiniz. Tablonun tümünün özelliklerini belirlemeye yarayan kutudan farklı olarak bu kez Layout bölümünde Header Cell (Başlık hücresi) ve No Wrap (Kelimeleri Kaydırma) kutularını göreceksiniz. Bir hücreyi başlık hücresi olarak tayin ederseniz, içeriği yazı ise harf türü olarak koyu harf seçilir ve yazı ortalanır.

Tabloların her sırada ve sütunda eşit sayıda hücresi olması gerekmez. Başka bir deyişle, komşu iki veya daha fazla hücreyi birleştirebilirsiniz. Bunun için birleştireceğiniz iki veya daha fazla hücreyi birlikte tarayın; herhangi birini sağ-tıklayın. Açılacak menüden Merge Cells (Hücreleri birleştir) maddesini seçin. İçinde ayrı ayrı yazılar bulunan hücreleri birleştirirseniz, sağdaki yazı soldakinin, alttaki yazı üsttekinin altına eklenir.

Herhangi bir hücreyi iki veya daha fazla hücreye bölebilirsiniz. Bunu yapabilmek için herhangi bir hücreyi sağ-tıklayın; açılacak menüden Split Cells (Hücreleri böl) maddesini seçin. Açılacak diyalog kutusunda hücrenin sütun (column) olarak mı, sıra (row) olarak mı bölüneceği ve kaça bölüneceğini (Number of...) belirtebileceğiniz kontrolleri göreceksiniz. Bir hücrenin içeriği bölündükten sonra solda veya üstteki hücrede kalır.

Tablo hücrelerine, bir HTML sayfasına giren herşey girebilir. Başka bir ifadeyle, bir hücre kutusuna yazı, resim, multimedya unsuru ve başka bir tablo koyabilirsiniz. Hücrelerin içerdiği yazılarda bağlantı olabilir.

Özellikleri böylesine inceden inceye kontrol edilebilen ve hücrelerine bir Web sayfasında bulunabilen her türlü malzeme konulabilen bir araç olarak hücre, sayfalarınıza, HTML’de olmayan bir özellik kazandırabilir; sayfanın iskeletini sağlayabilir. FP’in bizim için hazırladığı bütün “boş” sayfalarda, başlık grafiği, Navigation düğmeleri veya kelimeleri gibi unsurların aynı yere denk gelmesini sağlayan yapısal iskelet de aslında bir tablodan ibarettir. Yukarıdaki örnekte sayfamıza tablo yerleştirdiğimiz “yer” de gerçekte sayfanın çatısını oluşturan tablonun bir hücresinden ibaret! FP’in sayfanın tümünde yaptığını, biz de, sayfamızın içeriğini koymamız için bize sağlanan yerde yapabiliriz.

Hatırlıyorsanız, yukarıda, HTML’de dikey çizgi unsuru olmadığını belirtirken, HTML komutlarının yukarıdan aşağıya doğru satır-satır icra edildiğini söylemiştik. Yani, Browser, sizin sayfanızı oluştururken, HTML kodunuzu satır-satır okuyacak ve emrettiğiniz işi yukarıdan aşağıya doğru yapacaktır. Buna göre, Browser’a, mesela, ekranın sol kenarına üstten 3 santim aşağıya bir resim koymasını, sonra üst kenara soldan 3 santimetre içeri bir başka resim koymasını emredemezsiniz. Browser, üstten 23 santimetre aşağıda görüntü oluşturacak bir emir icra ettikten sonra, tekrar yukarı çıkarak başka bir görüntü oluşturamaz. Buna, yani ekranı bir gazete veya dergi sayfası gibi kutu-kutu işlemenize imkan veren, tablodur. Örneğin, üç sütunlu üç sıralı bir tablonun, birinci sütun-ikinci sırasındaki hücresine, ikinci sütun-birinci sırasındaki hücresine, ve üçüncü sütun- üçüncü sırasındaki kutusuna resim veya diğer mültimedya unsurlarını koyabilirsiniz; diğer hücrelere de yazılarınızı ve başlıklarını yerleştirirseniz, sayfanız bir dergi sayfası gibi, sütunlar halinde işlenmiş olur.

Bir Sayfanın Teması Değiştirmek:

FP’de sitemizi oluşturan sayfaların tümüne ortak bir tema vermeyi ilk derste öğrendik. Bu sayede, içi boş sayfalarımız bile, sitemizin ortak bütün özelliklerine sahip olarak oluşturuluyor. Fakat öyle bir an olabilir ki, sitenin tümü için seçtiğiniz tema, bir sayfaya uygun görünmeyebilir; bazı sayfalarda farklı bir tema ugyulamak isteyebilirsiniz.

Bizim sitemiz için seçtiğimiz tema, gerek zemininde yağlı boya tuvaline benzeyen grafiği, gerekse başlığında ve yatay çizgilerindeki “resim” havası ile amatör fotoğrafçılık konusuna uygun göründü. Fakat mesela fotoğraf örneklerimizi verdiğimiz sayfalarda daha sade bir tema belki dikkatin fotoğraflarda toplanması açısından daha uygun olabilir. Hatta belki bu sayfalarda hiç tema uygulamasak ziyaretçinin dikkatini daha çok fotoğraflara çekme imkanı bulabiliriz.

Bir sayfanın temasını değiştirmek veya temayı tümüyle kaldırmak için sayfayı Editör’de açın. FP Editör’ün Format/Biçimle menüsünden Themes/Temalar maddesini seçin. Karşınıza, FP Explorer’da tema görünümünü seçtiğiniz zaman gelen tema diyalog kutusu gelecektir. Sol taraftaki listede adını seçtiğiniz temanın, uygulandığı sayfanın ana unsurlarını nasıl biçimlendireceğini sağdaki büyük panoda görebilirsiniz. Tema diyalog kutusunun sol üst tarafında en üstteki seçeneğe dikkatinizi çekerim: “This Page Does Not Use Themes” (Bu sayfada tema kullanılmaz) maddesini işaretlerseniz, tema önizleme penceresindeki görüntü kaybolacaktır. Bu, sayfadan da tema unsurlarının kaldırılacağı anlamına gelir. Bu durumda iken tema kutusunun OK düğmesini tıklarsanız, açık sayfadan tema unsurları kaldırılacaktır. Şimdi ya farklı bir tema seçin, ya da tema uygulanmamasına karar verin; ve OK’i tıklayın. Sayfanız, seçeneğinize göre ya yeni temaya uygun hale getirilecektir; ya da tema tümüyle kaldırılacaktır.

Bir sayfadan tema unsurlarını kaldırma yolunu seçerseniz, temanın gerektirdiği zemin grafiği kaldırılacak, Navigation düğmeleri düz yazıya çevrilecek, çizgilerin grafik değil, gerçekten HTML’in düz çizgisi şeklini alması sağlanacaktır; fakat sayfanızda FrontPage’in sağladığı otomasyona ait unsurlar aynen korunacaktır. Sayfanızın diğer sayfalara ve ana sayfaya bağlantısı ile ortak başlık grafiği yerinde kalacak; sayfalardaki ortak metinler aynen korunacaktır.

Ders 5: Sayfalarımızı Hareketlendirelim

Web’i Web yapan unsurların başında bilgisayarlar arası iletişimi kolaylaştırmak gelirse, iki sırada Web sitelerinin içeriğini sayarsak, hata etmemiş oluruz. Web, hem yazılı iletişim araçlarının durgun fakat derinlemesine içerik bulunabilen sayfalarına, hem de televizyonun sesli ve hareketli, buna karşılık sathî içeriğine sahip olabilir. Kısaca bir Web sitesi, hem dergi, hem televizyondur. Buraya kadar bir Web sitesinin inşaatına başlamayı ve yaptığımız sayfalara duragan içeriği koymayı ele aldık. Şimdi sitemizi biraz televizyona benzetebiliriz!

Bu amaçla sayfalarımıza grafik bağlantı unsurları, ziyaretçinin Mouse işaretçisini üzerine getirdiği zaman bazı özellikleri değişen bağlantılar ile ses ve video unsurlar koyacağız. FP’de bu işin tekniğini görmeden önce işin zevkle ilgili unsurları üzerine bir iki uyarıda bulunalım.

Mimarlar, “İyi tasarım, göze görünmeyen tasarımdır,” derler. Gerçekten de iyi bir gazete veya dergi sayfası mizanpajı da dikkati kendisine çekmeyen, tersine okuyucunun içeriğin vermeyi amaçladığı mesajı kolay ve en az hata ile almasını sağlayan mizanpajdır. Yazılı basın-yayın araçlarında sayfa tasarımcısının sayfasını görsel olarak daha zengin hale getirmek ve sözgelimi ofset baskı tekniğinin inceliklerine ne kadar hakim, usta bir mizanpör olduğunu göstermek için, sayfasını içeriğin gerekli kılmadığı çizgiler, kutular, renkler ve grafiklerle doldurur veya olur-olmaz yerlere boşluklar koymaya kalkması halinde ortaya nasıl hatalı sayfalar çıkarsa, aynı tuzağa Web sayfasında da düşebilirsiniz.

Renk verme imkanınız var diye hiç de ihtiyaç olmayan metinlere veya çizgilere renk vererek, resim koyma imkanınız var diye içeriğin gerektirmediği yerlere—sırf süs olsun diye—grafik unsurlar koyarak, Web sayfalarınızı “ne dediği belirsiz” hale getirmeniz çok kolaydır. Başka bir deyişle bu teknikleri dikkatle, itidalle ve vermek istediğiniz mesajın gerektirdiği ölçüde kullanmazsanız, sayfalarınız gerçekten televizyona dönebilir! (Ve bu siteniz için bence hiç de olumlu bir puan sayılmaz!)

Web’de Grafik

FrontPage programını kurduğunuz CD-ROM’da çok sayıda sabit ve hareketli grafik unsur bulacaksınız. Ayrıca Internet’te de istemediğiniz kadar çok grafik (resim, fotoğraf, animasyon), video ve ses dosyalı bulabilir ve sabit diskinize kaydedebilirsiniz. Ancak bir kere daha hatırlatmak gerekir ki, sanat eserlerinin kullanımı, daima izne tabidir.

Grafik dosyaları bayt ölçüsüyle çok büyük dosyalardır. Web’de grafik kullanacağınız zaman grafiğin ziyaretçinin bilgisayarına aktarılma zamanını hesaba katmalısınız. Hiç kimsenin saatlerce sizin grafiklerinizin kendi bilgisayarına indirilmesini beklemeye tahammülü yok. Sayfalarınıza ekleyeceğiniz her grafik ögenin, ses ve video dosyasının sayfalarınızın ziyaretçilerin bilgisayarına aktarılmasını biraz daha zorlaştıracağını unutmamalısınız. Sitenizi, özel nitelik ve özel amaçlarla inşa ediyorsanız, mesele yok; istediğinizi doldurun, sayfalarınızın ziyaretçilerinizin bilgisayar ekrarında görüntülenmesi isterse 20 dakika alsın! Fakat özel bir firmaya ait bile olsa, bir Web sitesi halka hizmet amacıyla kurulmuş ise, sayfaların sür’atli aktarılması gerekir. İyi bir Web tasarımcısı, sayfalarında sadece sitenin mesajının gerektirmediği görsel unsurlara yer vermemekle kalmaz, fakat aynı zamanda sayfalarını yavaş bir modem bağlantısı olan bilgisayarla, ülkenin farklı köşelerinden sınar veya sınattırır.

Dolayısıyla Web’de kullanılan grafiklerin sıkıştırılması gerekir. Bir grafik, video veya ses dosyasının sıkıştırılması ebadının veya süresinin değişmesi anlamına gelmez. Sadece bayt olarak dosya büyüklüğü azaltılır.

Grafik alanında Web’de yaygın olarak kullanılan üç sıkıştırma tekniği kullanılınır: Grafics Interchange Format (GIF), Joint Photographic Expert Group (JPG) ve Portable Network Graphic (PGN). Bunlardan JPG en kaliteli ve kalitesine göre oldukça dosya halindedir. GIF, hem kalite bakımından zayıf, hem de dosya ölçüsü bakımından büyük olduğu halde, PNG’ye göre daha sık kullanılır. Hangi sıkıştırma tekniğini kullanacağınıza geçmeden, grafiklerle ilgili bir kaç teknik bilgiyi tekrarlayalım:

Bir grafiğin bilgisayar ekranında görüntülenmesinde kullanılan iki ölçü vardır: grafiğin ekranda bir inçkarede kaç nokta yoğunluğu olacak; grafiğin oluşturulmasında bilgisayarın ekran kartı kaç adet renk bulunan bir model kullanacak? Ekran kartının ve fizikî ekranın çözünürlüğü konusunu ele alırken, grafik unsurların çözünürlüğü ile ilgili temel bilgileri gözden geçirmiştik. Şimdi bu bilgiler ışığında, bir fotoğrafın bir inçkarede 72 adet nokta kullanılarak oluşturulması ile bir inçkarede 300 nokta kullanılarak oluşturulması arasında fark olduğunu görebiliyorsunuz. Bir grafik bir inçkarede ne kadar çok nokta ile tanımlanırsa, grafik dosyası o kadar büyük olur. Web sayfalarında yer alan unsurların çoğu sadece ekranda izlenmek üzere hazırlandığına göre, grafiklerinizi 72 dpi olarak üretmeniz veya taramanız yeterli olacaktır.

Renk modeli ise, kabaca tanımlarsak, bir grafiği ekranda oluşturabilmek için ekran kartının, fizikî ekranda kaç renk meydana getirmesi gerektiğini gösterir. Televizyon ekranı gibi bilgisayar ekranı da katot ışınları ile çalışır ve bütün renkler üç temel rengin (kırmızı, mavi ve yeşil) birbirine belirli oranlarda karıştırılması ile elde edilir. Teknik ayrıntıya girmeden ifade etmek gerekirse, standart ekran kartları, teknik özelliklerine göre ekranda 256, 65 bin 536 veya 16 milyon renk oluşturabilirler. Gelişmiş ekran kartları, gerçek renk diye adlandırılan modelle, daha çok renk sağlayabilir. Her grafik dosyasının içinde bu grafiğin görüntülenebilmesi için ekran kartının ekranda asgari kaç renk oluşturması gerektiği belirtilir. Grafiğinizde 256’dan fazla renk varsa, JGP olarak kaydetmeniz gerekir; çünkü GIF sıkıştırma tekniğinde 256’dan fazla renge yer verilemez. Ayrıca GIF modelinde, zemini saydam (yani arkasındaki unsuru gösterebilen) grafikler oluşturulabilir.

Çok ayrıntılı bir fotoğrafın bile aslına yakın biçimde ekranda görüntülenebilmesi için 256 renk yeter! Burada, aynı fotoğrafın değişik renk modelleri ve değişik kayıt biçimlerinde iken ekranda nasıl görüntülendiğini görüyorsunuz:

<FP00042.tif>

Bu sayfayı, gördüğünüz fotoğraflardan sadece birini kullanarak yaptığımız zaman, 28.8 K’lık bir modemle sayfanın ziyaretçinin bilgisayarına aktarılması için gerekli süreler ise şöyle:

16 Renk GIF: 3 saniye

216 Renk GIF: 9 saniye

256 Renk GIF: 11 saniye

16 Milyon Renk JFP: 32 saniye

Web’de birinci sayfanın aktarılması süresinin 20 saniyeyi geçmemesi geleneğini hatırlatırsak, tasarımcı olarak grafik konusunda ne denli sınırlamalar altında olduğunuz, çok daha iyi anlaşılabilir.

Sayfaya Grafik Koymak

FP Editör’de sayfanıza grafik koymak için, imleç, grafiğin görünmesini istediğiniz yerde iken, ya Insert/Ekle menüsünden Image (Grafik) maddesini seçerek, ya da doğruca araç çubuğunda Insert Image (Grafik ekle) simgesini tıklayarak grafik dosyasını seçmenizi sağlayacak diyalog kutusunu açabilirsiniz. Bu kutuda seçtiğiniz grafiğin gerçekten istediğiniz grafik olup olmadığını önizleme penceresinde görebilirsiniz.

HTML sayfada bir grafik, diğer bir grafiğin veya metnin ya yanında, ya da altında yer alabilir. Yani, bu grafiğin yeri, yanındaki unsurun ebadına veya uzunluğuna göre değişir. Grafiklerin sayfada sabit bir yerde durmasını istiyorsanız, sayfaya tablo ile bir iskelet kazandırmanız gerekir. Tablonun herhangi bir hücresine grafik koyabilirsiniz. Böylece yandaki hücrenin içeriği ne kadar geniş veya uzun olursa olsun, grafiğinizin bulunduğu hücrenin ebadı ve yeri, sizin tabloya verdiğiniz biçim değişmedikçe, aynı kalacaktır.

Şeffaf (Transparan) Grafik

Grafikleriniz, bilgisayarınızda sıkıştırılmamış grafik biçimleri olan BMP, TIFF, TGA, RAS, EPS, PCX ve WMF biçimlerinde kaydedilmiş olabilir. FrontPage’de bu biçimlerdeki bir grafiği sayfanıza koymak istediğiniz zaman, FP, grafikte 256’dan fazla renk varsa JPG’e, 256’dan az renk varsa GIF’e çevirecektir. Bu kitapçıkta grafik oluşturma konusuna giremeyiz; ama bir noktayı belirtmemiz gerekir. Başka bir programda yaptığınız ve GIF olarak kaydettiğiniz bir grafiği, FP’de şeffaflaştırabilirsiniz. FP Editör’de sayfanızda bulunan herhangi bir GIF grafiği bir kere tıklayın; Editör penceresinin alt kenarında Grafik editing araç çubuğu belirecektir. Bunlardan Make Transparent (Şeffaflaştır) aracını seçin; ve grafiğinizin şeffaf olmasını, yani arkasındaki unsurların görünür hale gelmesini istediğiniz yerini tıklayın. Burada, aynı grafiğin üstte saydamlaştırılmamış, altta saydamlaştırılmış örneğini görüyorsunuz:

<FP00043.tif>

Sitenizde kullanmak istediğiniz grafikleri bir klasörde biriktirdiyseniz, bu klasörü tümüyle FP Web’e ithal edebilirsiniz. FP, sitemizi oluştururken, kendi grafiklerini, IMAGES adlı bir klasöre koymuştu; biz de fotoğraf örneklerimizi bu klasöre kopyalamıştık. Ancak siteniz çok sayıda grafik kullanacaksanız, bulunduğu klasörü, Web’e aktarmak daha kolay olabilir. (FP, sitenizi gerçek Internet’e aktarırken, bu klasörleri de aktaracaktır.)

Anime (Hareketli) Grafik

GIF biçiminde grafiklerin diğer biçimlerde olmayan bir özelliği, aynı dosya içinde birden fazla sabit grafiğin kaydedilmesi ve bunların tayin edilen sırayla gösterilmesidir. Tıpkı sinema tekniğinde olduğu gibi, gözümüz, kısa aralıklarla birbiri ardına gördüğü sabit resimleri hareketli imiş gibi algılar.

Anime (Hareketli) GIF dosyası üretebilmek için önce bir grafik programı yardımıyla hareketi yansıtacak GIF dosyaları üretmeniz gerekir. FP’i kurduğunuz CD-ROM’da bir Anime (hareketli) GIF yapma programı bulacaksınız. Bu program, bir çok GIF dosyasını belirli bir sırayla ve her biri arzu ettiğiniz bir süre ile gösterilecek şekilde tek GIF dosyası haline getirecektir.

Sayfalarınıza anime grafik koymakla, düz grafik koymak arasında işlem bakımından hiç bir fark yoktur.

Alternatif Metin

Dosya büyüklüğünü ne kadar sınırlı da tutsanız, grafiklerin sizin sitenizden ziyaretçinin bilgisiyarına aktarılması metne göre çok zaman alır. Kimi zaman da bu aktarma, ne sizin, ne de ziyaretçinin kusuru olmaksızın, kesilir. Aktarma sırasında ziyaretçinin Browser’ı, grafiğe ayırdığınız kutuyu çizecek ve içini boş bırakacaktır. Grafik bir sebeple aktarılamadığı zaman, bu kutunun içinde kırmızı bir çarpı işareti veya kopuk grafik bağlantısı simgesi görülecektir. Aktarma sırasında ve aktarma kesildiği hallerde bu kutuda bir yazı görünmesini sağlayabilirsiniz. Bazı Internet meraklıları ise Browser programlarının grafik gösterme özelliğini iptal ederler ve ziyaret ettikleri sitelerdeki grafiklerin kendi bilgisayarlarına aktarılmasını durdururlar. Bu durumda da grafiğin yerine bir yazı görüntülenebilir.

FP’de sayfanıza koyduğunuz bir grafiği sağ-tıklayın; açılan menüden Image Properties (Grafik özellikleri) maddesini seçin:

<FP00044.tif>

Açılacak kutuda, resmin kaynağını, dosya adını ve diğer özelliklerini sıralayan birinci bölümün altında “Alternative Representations” (Alternatif gösterimler) bölümünü göreceksiniz.

Bu bölümde önce, sitenizin yapısı gereği, sayfalarınıza yüksek çözünürlükte, çok renkli modellerde, ziyaretçiye aktarılması uzun sürecek grafikler koymak zorunda iseniz, bu grafik aktarılıncaya kadar, ziyaretçinin boş ekranı seyretmesi yerine resmin düşük çözünürlükte az renkli bir örneğini çabucak görmesini sağlayan “Low Res” (Düşük çözünürlük) alternatifi bulunur. Bu kutunun yanındaki Browse düğmesini tıklayarak, gerçek grafik aktarılıncaya kadar çabucak görüntülenmesini istediğiniz düşük çözünürlükteki grafik dosyasını seçebilirsiniz. Aynı bölümde “Text” (Metin) kutusunun içine yazacağınız yazı ise grafik ziyaretçinin bilgisayarında görüntüleninceye kadar veya  grafik bir sebeple aktarılamazsa (veya ziyaretkçinin Browser’ında grafik gösterme imkanı kapatılmışsa) grafiğin yerine gösterilir. FP, otomatik olarak grafik dosyasının adını ve büyüklüğünü metin olarak seçer; isterseniz bu metni silerek yerine arzu ettiğiniz herhangi bir yazılı yazabilirsiniz.  (Bu yazı, ziyaretçinin bilgisayarının sistem harfleriyle görüntüleneceği için, mesela sizin bilgisayarınızda mevcut Türkçe harfleri içeren bir yazı yazarsanız ve ziyaretçinin bilgisayarında bu harfler yoksa, yazınız çok çirkin bir görünüm alabilir!)

Image Properties (Grafik özellikleri) kutusunun üçüncü bölümü olan Default Hyperlink (Varsayılan Bağlantı) bölümü dikkatinizi çekmiş olmalı. Bu bölümü kullanarak neler yapabileceğimizi aşağıda göreceğiz.

Grafiklerde Bağlantı

Web sayfasında nasıl bir veya birden fazla kelimeyi tıklandığı zaman ziyaretçiyi başka bir sayfaya veya başka bir siteye götüren bağlantı kazandırabiliyorsak, aynı işlemi grafiklerle de yapabiliriz. Başka bir deyişle, sayfamızdaki grafiklere, tıklandıkları zaman ziyaretçiyi, sayfamızda başka bir bölüme, başka bir sayfaya veya başka bir URL adresine götürme imkanı kazandırabiliriz.

Bunu, Image Properties (Grafik özellikleri) kutusunun üçüncü bölümü olan Default Hyperlink (Varsayılan Bağlantı) bölümüne bir URL yazarak yapabileceğimiz gibi, FP Editör’ün ana penceresinde de yapabiliriz. Her iki yönteme de kısaca değinelim.

Önce bir film, bir de fotoğraf makinası grafiği (veya onların yerini tutacak iki örnek grafik) bulun. Tabii yine bunun en kestirme yolu, PC World sitesinden örnek dosyaları indirmektir. Sonra, FP Explorer’da Navigation görünümünde iken Yenilikler sayfasını ve Araç Çubuğu’nda New Page (Yeni Sayfa) simgesini birer kere tıklayın. Yenilikler sayfasına yeni bir sayfa eklenmiş oldu. Bu sayfanın Navigation görünümündeki simgesinin adını “Yeni Techizat” olarak değiştirin. (Dosyalar bölümünde bu sayfanın Yeni1.htm olarak adlandırıldığını göreceksiniz; bu adı da techizat.htm yapın) Yenilikler sayfasını iki kere tıklayarak FP Editör’de açtığınız zaman, sol taraftaki Navigation bölümüne Yeni Filmler satırının altına Yeni Techizat sayfasının da eklendiğini göreceksiniz. Fakat sitemiz amatör fotoğrafçılıkla ilgili olduğuna göre, düz metin bağlantılara ek olarak, biz sayfamıza biraz daha görsel bağlantı düğmeleri de koymak istiyoruz.

Şu ana kadar örnekleri birlikte yaptı isek, bu sayfadaki metin, “...arşvini yapmakta kullanabilirsiniz.” Şeklinde bitiyor olmalı. Mouse işaretçisini son kelimenin sonunda tıklayın ve klavyeden Enter tuşuna basın. İmleç şimdi yeni bir paragrafın başında duruyor ve son paragraf noktalı liste olduğu için, yeni paragrafın da başında nokta var. Klavyede’de Backspaçce (Geri) tuşuna basarak, bu paragrafı Normal hale getirin. Insert menüsünden Clipart maddesini seçerseniz, FP’in kendi grafik arşivi açılacaktır. FP kurulurken bazı örnek fotoğraflarla size bir grafik arşivi kurmuş olmalı. Fakat siz şimdi kendi sağladığınız grafiği kullanacağınız için bu listeden Image (Grafik) maddesini seçin ve açılacak kutuda altta URL hanesinin sağındaki üstü büyüteçli klasör simgesini (sabit diskte dosya seçme aracı) tıklayın. Hazırladığınız vepa PC World sitesinden indirdiğiniz dosyayı (film.gif) sabit diskinizde bulun; OK’i tıklayın. Grafik yerine göre biraz büyükse, bir kere tıklayarak dört tarafında belirecek tutamaklardan köşelerde bulunanlardan birini Mouse işaretçisiyle tutarak, çaprazlama sürükleyin; resim oranları değişmeden küçülecektir. Gözünüze uygun büyüklüğe inince, Mouse’un düğmesini bırakın. Resim hala seçili iken, Editör pencerisinin alt kenarındaki Grafik Editing Araç Çubuğu’ndan resmi şeffaf (transparan) hale getirme aracını seçin ve grafiğin boş bir yerini bu araçla tıklayın. (Resmin çevresindeki beyaz boşluk kayboldu ve sayfanın zemin grafiği görünür hale geldi.) Şimdi resmin sağındaki boşluğu tıklayın ve klavyeden aralık çubuğuna iki üç kere basın. Şimdi ikinci resmi (kamera.gif) koymak üzere harekete geçin. Gerekiyorsa bu resmi de küçültün; şeffaf hale getirin. Grafikleri sayfamıza koymuş olduk. Sıra, bu iki grafiğe bağlantı kazandırmaya geldi. Fakat bu arada bir şeyi not etmemiz gerekiyor. Mouse işaretçisini sayfada soldaki seyir metinlerinden “Yeni Filmler” satırına götürün ve bu sırada Editör penceresinin alt kenarında belirtilen bağlantıyı bir kenara yazın (film.html); sonra aynı işlemi “Yeni Teçhizat” bağlantısı için de yapın (techizat.html).

Tekrar birinci grafiği (film resmini) tıklayın; Araç Çubuğu’ndan “Create or Edit Hyperlink” (Bir bağlantı oluşturun ve düzenleyin) simgesini (çevresinde zincir halkaları bulunan dünya simgesi) tıklayın. Filk resmi tıklandığında ziyaretçimiz Yeni Filmler sayfasına (film.htm) gitsin istediğimize göre, açılan diyalog kutusunda üstteki listede film.htm dosyasını iki kere tıklamanız yeterli. Aynı işlemi diğer grafik için de yapın ve bu kez techizat.html dosyasını seçin.

Grafiklerin bağlantılı olduğunu göstermek üzerde çevrelerinde ince bir mavi çerçeve oluştuğunu göreceksiniz. Bu çerçeve bazı tasarımcıların hoşuna gitmez ve ziyaretçilerin grafiklerde bağlantı olduğunu Mouse işaretçisini bu grafiğin üzerine getirdiğine imlecin el görünümü almasından anlamasını isterler. Eğer siz de bu çerçevenin grafiğinizin görünümünü kötü etkilediğini düşünüyorsanız; resmi sağ-tıklayın; açılacak menüden Image Properties (Grafik özellikleri) maddesini seçin; açılacak kutuda Appearance (Görünüm)  sekmesine gidin ve Border Tickness (Çerçeve kalınlığı) kutusuna 0 rakamını yazın.

İşte bu kadar. Sayfanızda artık grafikli bağlantı veya bağlantılı grafik var!

<FP00045.tif>

Grafiklerde Hotspot

Diyelim ki ziyaretçiniz grafiğin tümünü tıklayınca belirli bir yede değil de, grafiğin belirli bir yerini tıkmayınca bir sayfaya, başka bir yerini tıklayınca başka bir sayfaya gitsin istiyorsunuz. Teknik deyimiyle bir grafiğin üzerinde Hotspot’lar (kelime anlamı “sıcak noktalar” olan bağlantılı bölgeler) oluşturmak istiyorsunuz. FrontPage, grafiklerinize dikdörtgen, daire, veya çok kenarlı bağlantılı bölgeler oluşturabilir; veya grafiğiniz GIF biçiminde ise üzerine bir yazı yazmanıza ve bu yazıya bağlantı kazandırmanıza imkan verebilir. Bu işleme bir grafik üzerinde bağlantı haritası yapmak denir.

Bunu sağlamak için tabii biraz büyükçe ve üzerinde bölge oluşturmak için anlamlı bir grafiğe ihtiyacımız var. Bağlantı haritası için iyi örnek bir harita grafiği olabilir. Elinizde güzel bir Türkiye haritası dosyası varsa, sabit diskinizdeki Web’de grafiklerinizin durduğu yere kopyalayın; veya PC World sitesindeki örnekler dosyasından Türkiye.gif’i indirin.

Şimdi, diyelim ki, Sergiler sayfamızda yer alacak fotoğraf sergileri ve gösterileri bölgeler itibariyle (Doğu ve Güneydoğu Anadolu ile Ege ve Marmara bölgeleri birleştirmek suretiyle) beş sayfa halinde vereceğiz; sergi ve gösterilerin listesini yapıldığı illere göre bu beş sayfaya ayıracağız. O halde, Sergiler sayfasını bir kere, New Page simgesini de beş kere tıklayın; sonra yeni sayfaların adlarını Doğu, Batı, Kuzey, Güney ve Orta diye değiştirin. Bu noktada klavyeden F5 tuşuna basarsanız, yeni yaptığınız sayfaların dosya adları sayfa başlıkları ile uyumlu şekilde düzeltilecektir (doğu.htm’i dogu.htm ve batı.htm’i bati.htm yapmayı unutmayın). Şimdi, Sergiler sayfasını iki kere tıklayarak FP Editör’de açın.

Ortak unsurları bulunan buna karşılık içeriği henüz olmayan bu sayfaya, “Sergi listesini görmek istediğiniz bölgeyi aşağıdaki haritada tıklayın” yazın, klavyede Enter tuşuna iki kere basın ve “Eklemek istediğiniz sergiler için lütfen Öneriler sayfasındaki formu doldurun” yazın. Sonra, imleci iki paragrafın ortasındaki boş paragrafa götürüp, Insert/Ekle menüsünden Image/Grafik maddesini seçin, ve harita dosyanız nerede ise bulup, OK’i tıklayın. Harita, ebad olarak sayfanız için çok büyükse, köşelerinden tutarak küçültebilirsiniz.

İki paragrafın ortasında belirince haritayı bir kere tıklayın ve Editör penceresinin alt kenarında beliren Grafik Editing Araç Çubuğu’na bakın. Çubuğun ilk simgesi olan okdan sonra, sırasıyla dikdörtgen, daire ve çok kenarlı (poligon) simgelerini görüyor musunuz? Bunlar, grafik üzerinde tıklanabilir bağlantılı bölge çizmek için kullanacağımız araçlar. Aynı yerde, çizdiğiniz bölgeleri topluca görmenizi sağlayan “Highlight Hotspots” (Bağlantı bölgelerini göster) ve grafik üzerine metin yazma ve bu metne bağlantı vermeye yarayan A harfi şeklindeki Text (metin) aracı da yer alıyor.

Bağlantı bölgeleri haritasını harita üzerine çizeceğimize ve illerimizin sınırları düz çizgi şeklinde olmadığına göre, bize çok kenarlı (poligon) aracı gerekiyor. Bu aracı tıkladığınızda Mouse işaretçisinin kalem şeklini aldığını göreceksiniz. Başlayın dikkatli bir şekilde ekrandaki harita üzerinde tayin ettiğimiz beş bölgenin sınırlarını denk geldikleri coğrafî bölgelere uygun şekilde çizmeye! (Maalesef, FP’de sayfayı ve grafiği büyütme imkanı yok! Ve küçük bir harita üzerinde il sınırlarını doğru şekilde çizebilmek zor olsa gerek!)

Çok kenarlı bir bağlantı bölgesi çizebilmek için, önce kalem şeklindeki imleci bölgenin başlayacağı bir noktaya getirerek, Mouse’un sol düğmesini tıklatın; Mouse işaretçisini yürüttüğünüzde tıkladığınız noktadan itibaren düz bir çizgi çizildiğini göreceksiniz; çizginin köşe yapmasını istediğiniz noktada Mouse düğmesini tıklayın ve Mouse’u sürüklemeye devam edin. Bölgeyi çizmeye başladığınız roktaya gelip de ilk noktanın üzerini tıkladığınızda, Create Hyperlink (Bağlantı Oluştur) kutusu açılacaktır. Çizdiğiniz bölge örneğin Ege ve Marmara’nın bileşimi idiyse, açılacak listeden bati.htm’i seçin. Diğer bölgeleri de harita üzerinde çizerek bu bölgeye ait bağlantının HTML dosyasını seçin. Bu işlem bittiği zaman ortaya şöyle bir görünüm çıkacaktır:

<FP00046.tif>

Mouse işaretçisini çizdiğiniz bölgelerin üzarine sürüklediğiniz zaman FP Editörün alt çerçevesinde bağlantı kurulmuş sayfanın adını görebilirsiniz. İsterseniz, klavyede CTRL tuşunu tutarak bölgelerinizi tıklarsanız, bağlantıyı sayfaya gidebilirsiniz.

Sitemizin giderek “usta işi” halini aldığını görüyorsunuz, değil mi?

Ses ve Video

Web sayfalarımızı zenginleştiren unsurlar arasında sayabileceğimiz ses ve videonun sitenin ve sayfanın genel içeriğine uygun olmaması halinde, ziyaretçileri en şaşırtan unsur olması da mümkündür. Ayrıca müzik ve video eserlerinin de telif hakkı bulunduğunu unutmamak gerekir.

Sayfalara ses yerleştirmek

FrontPage, en sık kullanılan MIDI, AU, WAV biçimleri dahil bir çok farklı ses dosyası türünü tanır ve kullanabilir. Ancak ziyaretçilerinizin Internet programları, sizin kullanacağınız bütün dosya biçimlerini tanımayabilir. Bu sebeple, bu üç ortak biçimdeki dosyaları kullanmalısınız. Ses dosyaları da grafik dosyaları gibi sıkıştırılabilir. Microsoft Active Media teknolojisi ile üretilecek projeler ve Real Audio (RA) bunlar arasında sayılabilir.

Web sayfasında ses dosyası, bir bağlantı olarak konulabilir; ziyaretçi bu bağlantıyı tıkladığı zaman Browser’ı bağlantılı ses dosyasını indirerek, çalacaktır. Amatör fotoğrafçılık sitemize fotoğrafçılık dersleri ile ilgili bir bölüm koyar ve bölüme “Ders 1,” “Ders 2” şeklinde ses dosyaları bağlantıları yaparsak, ziyaretçinin bu bağlantılardan birini tıklaması halinde, Browser programının bağlantılı ses icra programı devreye sokarak, ziyaretçinin ses dosyalarını dinlemesini sağlayacaktır.

Bunun dışında ses unsurundan arka-plan unsuru olarak da yararlanabiliriz. Bu durumda ses dosyası, içinde bulunduğu sayfa ile birlikte ziyaretçiye aktarılar ve sizin vereceğiniz ölçülere göre ya bir kere ya da sayfa açık olduğu sürece biteviye çalınır. Ziyaretçi, Netscape browser kullanıyorsa ve gerekli plug-in denilen ek programları kurmamışsa, arka-plan seslerini duyması mümkün olmayabilir.

Sitemiz, amatör de olsa fotoğrafçılıkla ilgili olduğuna göre, sayfalarımız açıldığı zaman bir fotoğraf makinasının deklanşör sesi duyulması, fena olmayabilir. Ana sayfamıza söyle bir ses ekleyerek, alıştırma yapabiliriz. Bunun için bize bir fotoğraf makinası deklanşör sesi içeren ses dosyası gerekiyor. Bilgisayarınızda ses kartı varsa (aslında ses kartı olmayan bilgisayar kalmı mı, diye sormak gerekir!) ve ses kartına bir mikrofon bağlı ise, istediğimiz sesi kaydedebiliriz. Filanca şarkıcının şarkısını müzik setinde çalıp, bu sesi kaydedersek, telif hakkı bize ait bir ses elde etmiş olmayız, ama kendi fotoğraf makinamızın çıkarttığı sesi kaydedersek, bunun telif hakkı bize ait olur. Bu sesi diyelim ki sabit diskimize “deklansor.wav” adıyla kaydettik. (Bu dosyayı PC World sitesinde bulabilirsiniz, veya alıştırma maksadıyla Windows’un kendi ses dosyalarından herhangi birini kullanabilirsiniz.)

FP Explorer’da Navigation görünümünde, Ana Sayfa’yı iki kere tıklayalım. Sayfamız FP Editör’de açıldığında herhangi bir boş yeri sağ tıklayarak, açılacak menüden Page Properties (Sayfa Özellikleri) maddesini seçelim. Açılacak kutunun birinci sekmesinde (General), “Background Sound” (Arka-plan sesi) başlıklı bölüme dikkat edin. Location (Mahal) kutusu boş, ve yanında Browse (Gözat) düğmesi var. Bu düğmeyi tıklayarak, ses dosyasının bulunduğu klasöre gidin ve dosyayı seçin. OK düğmesini tıklayarak Sayfa Özellikleri kutusuna geri döndüğünüzde, Location hanesinde seçtiğiniz dosyanın adının yazılı olduğunu göreceksiniz. Merak etmeyin, sayfayı ilk kaydettiğinde ve siteyi güncelleştirdiğinde FP bu dosyayı Web klasörüne koplayalayacaktır:

<FP00047.tif>

Bu kutuda Loop (döngü) hanesini görüyorsunuz. Buraya yazacağınız sayı, sayfa ziyaretçinin bilgisayarında görüntülendiğinde arka-plan ses dosyasının kaç kere çalınacağını gösterir. Bu kutuya 9999’a kadar bir rakam yapabilirsiniz; veya yandaki Forever (Sonsuz) kutusuna bir işaret koyarak sürekli çalınmasını sağlayabilirsiniz.

Sayfanıza arka-plan sesi yerleştirdikten sonra FP Editör’de Preview (Önizleme) sekmesine giderek, sesi dinleyebilirsiniz. Eğer ses sizin bile sinirinize dokunuyorsa, Normal sekmesinde sesi koyarken izlediğiniz yolu izleyip, Location hanesindeki dosya adını silmeniz, sesi kaldırmanız için yeter.

Sayfalara video yerleştirmek

Sayfanıza ses dosyası koymak, sayfanızı yeterince televizyona çevirmedi ise, bir de video koymaya ne dersiniz? Buna geçmeden dijital video konusuna kısaca değinelim.

Televizyonda izlediğiniz, televizyondan ya da kameradan kasete kaydettiğiniz, kasette kayıtlı olup da VCR/VTR aracılığıyla oynattığınız video, analog şekilde kaydedilmiştir. Analog video kaydının özel bir aygıt yardımıyla bilgisayarın sabit diskine aktarılmasına videonun dijitale çevrilmesi veya dijitalize edilmesi denir. Günümüzde doğrudan bilgisayara (veya bilgisayarın okuyabildiği bir ara ortama) kayıt yapabilen dijital video kameralar vardır. Dijital video da grafik ve ses gibi bir çok biçimde kaydedilebilir. Microsoft’un Windows için geliştirdiği dijital video biçimine AVI (Audio/Visual Interleaved) denir. Daha başka dijital video kayıt ve sıkıştırma biçimi de vardır. FP, AVI dosyalarını okuyabilir. Ayrıca AVI, Web Browserlar arasında da en yaygın tanınanıdır. Intel Firmasının Indeo Video, Apple Firmasının QuickTime ve Microsoft Firmasının Active Media video teknolojileri, RealAudio-Video firmasının RA sıkıştırma yöntemi,

Internet’te ücretsiz ve telif hakkından vazgeçilmiş video dosyalar bulunabilir. Fakat herhangi bir sinema filminin bir bölümünü bile dijitale çevirip, sitenize koyamazsınız. Film yapımcıları telif haklarını koruma işini çok ciddiye alırlar! Yeni ve giderek ucuzlayan dijital video kameraları ile kendi filminizi kendiniz çekip, sitenize koyarsanız, buna kimse bir şey diyemez! Fakat alıştırma maksadıyla PC World’ün CD Magazin’indeki herhangi bir AVI dosyasını kullanabilirsiniz. PC World sitesinde bu kitapçıkla ilgili dosyalar arasında Test.avi adlı bir örnek dosya bulacaksınız.

Web sitesinde video ile ilgili son uyarımız, video dosyalarının çok büyük yer tutması ve dolayısıyla ziyaretçinizin bilgisayarına indirilmesinin çok uzun zaman almasıdır. 800 KB’dan büyük video dosyalarına sitenizde yer vermemeniz gerekir.

Şimdi bir örnek uygulama yapalım. Web sitemizin Navigation görünümünde Yeni Teçhizat sayfasını iki kere tıklayın; açılan sayfada metin imlecinin bulunduğu yeri değiştirmeden, Insert/Ekle menüsünden Active Elements (Hareketli Unsurlar) maddesini, onun alt menüsünden de Video maddesini seçin. Sabit diskte dosya bulma düğmesini tıklayarak, video dosyasının bulunduğu yere gidin. Aradığınız videoyu bularak, ve OK’i tıklayarak, sayfaya geri dönün. FP, seçtiğini videonun birinci karesini görüntüleyecektir. Preview sekmesini tıklarsanız, videoyu izleyebilirsiniz.

Sayfanıza koyduğunuz videonun nasıl gösterileceğini denetlemeniz mümkündür. Halâ Preview sekmesinde iseniz Normal’i tıklayın ve video kutusunu sağ-tıklayarak açılacak menüden Image Properties maddesini seçin. Açılacak kutuda ikinci sekme olan Video’da sayfanızdaki videonun nasıl görüntüleneceğine ilişkin kontrolleri göreceksiniz:

<FP00048.tif>

Video Source (Video kaynağı) olarak dosyanızın adı yazılı olacaktır. Hemen altında, ziyaretçinizin Browser ekranında bu videonun oynatılması ve durdurulmasına ilişkin kontrol düğmelerinin görüntülenip görüntülenmemesini sağlayan “Show Controls in Browser” (Browser’da Kontrolleri Göster) kutusunu görüyorsunuz. Bu kutuya işaret koyarsanız, ziyaretçi videoyu istediği zaman oynatabilir, istediği zaman durdurabilir. Çok uzun ve özellikle eğitim-öğretim amacıyla verdiğini videolarda ziyaretçiye kontrol imkanı vermek gerekir. Videonun ne zaman gösterileceğini belirleyen iki kontrol göreceksiniz. “On File Open” (Dosya açılınca) maddesini işaretlerseniz, sayfanız ziyaretçinin bilgisayarına indirildiği anda video oynayacaktır. “On Mouse Over” (Mouse üstüneyken) maddesi ise ziyaretçinin Mouse işaretçisini videonun üzerine sürüklediği zaman videonun gösterilmesi sağlar. Bu maddeyi seçerseniz, ziyaretçi Mouse işaretçisini uzaklaştırdığı anda video durur; işaretçiyi videonun üzerine getirdiği anda video baştan başlar. Eğitim-öğretim amaçlı videoda bunu yapmak doğru olmaz.

Hover Düğmesi ile Video ve Ses

Sayfalarınıza video (veya ses) dosyalarını Hover düğmesi olarak da yerleştirebilirsiniz. İngilizce “üzerinden geçmek, üzerinden uzmak, üzerinde dolaşmak” gibi bir anlama sahip olan bu kelimele nitelenen düğme, FP tarafından Java programcığı vasıtasıyla çalıştırılan bir dinamik HTML (DHTML) uygulamasıdır. Java programını ve bu programın gerektirdiği parametreleri FP kendisi oluşturacaktır.

Web sitemizin Navigation görünümünde Yeni Teçhizat sayfasını tekrar iki kere tıklayın; açılan sayfa biraz önce koyduğunuz videoyu tıklayın ve klavyede Delete tuşuna basın. İmlecinin bulunduğu yere örneğin “Bu video ile netlik ayarı yapmak için gerekli bilgiler verilmektedir.” Yazın ve iki kere Erter’a basın. Sonra, “Netlik ayarları fotoğraf makinalarında ve objektiflerde farklı konumlarda bulunabilir” yazın. İmleci iki paragraf arasındaki boşluğa getirin ve Insert/Ekle menüsünden Active Elements (Hareketli Unsurlar) maddesini, onun alt menüsünden de Hover Button maddesini seçin. “Button Text” (Düğme metni) kutusundaki “Button text” kelimelerini silip yerine Video yazın. “Link to” kutusunun sağındaki Browse düğmesini tıklayarak, düğmenin kontrol edeceği video dosyasını bulun (Bizim örneğimizde Test.avi dosyası). Hover Button kutusunda ziyaretçinin tıklayarak videoyu açacağı ve içinde “Video” kelimesinin bulunacağı dinamik düğmnin diğre bazı özelliklerini de göreceksiniz. Düğmenin asıl rengi, ziyaretçi Mouse işaretçisini düğmenin üzerine getirdiği zaman düğmede ulaşacak etki (Effect) ve bu sırada düğmenin alacağı farklı renk gibi özellikleri buradan ayarlayabilirsiniz. FP, etki olarak düğmenin ortasında bir alanın parlaması şeklindeki Glow (Parla) etkisini seçecektir. İsterseniz bu etkiyi ve renkleri değiştirebilirsiniz. Bu kutuda işiniz bittiği zaman OK’i tıklayın. Bu suretle oluşturduğunuz düğme, ziyaretçinin Browser’ında üzerine Mouse işaretçisi geldiği zaman tıklandığında bir başka eylem olacağı veya bir başka bağlantının sağlanacağı belirtisi olarak şekil değiştirerek ziyaretçinin dikkatini çekecektir. Mouse işaretçisi bu düğmenin üzerinde olduğu sırada, Browser perceresinin alt çerçevesinde, “test.avi” dosya adı okunacaktır.

<FP00049.tif>

Bir videoyu sayfanıza bir Hover düğmesi yardımıyla koyarsanız, bu düğme tıklandığında video ziyaretçinin bilgisayarına sayfadan ayrı olarak indirilir ve Browser programının bağlı olduğu aracı program (Real Player, MS Media Player, vs.) aracılığıyla gösterilir. Bu aracı programın penceresi, Browser’dan bağımsız ve sizin videonuz yüklenmiş olarak, ziyaretçi tarafından kapatılıncaya kadar açık kalır. Eğitim-öğretim veya gösteri amacıyla ziyaretçilerinize göstermek istediğiniz videoları sayfanıza Hover düğmesi yardımıyla koymanın daha uygun olduğu bir çok durum düşünebilirsiniz.

Ders 6: Formlar

Internet’te herşey, siteden ziyaretçinin bilgisayarına doğrudur. Ya da öyle görünür. Gerçekte bir Browser, bir site ile bağlantı kurduğu anda, siteden aldığı kadar olmasa bile belirli bir miktarda, o da siteye, ya da sitenin bulunduğu Web Server’a bilgi verir. Form, Browser’dan Server’a, daha doğru ifadesiyle ziyaretçiden site sahibine bilgi akışını bir şekle bağlar; bu bilgileri kullanılır hale getirir.

Site sahibi olarak ziyaretçilerinizden bazen bir konuk defterini doldurmasını, sitenizle ilgili görüşlerini ve düşüncelerini size bildirmesini istersiniz; bazen sitenize girebilmek için ziyaretçi adını ve şifresi yazmak zorundadır. Bütün bu ziyaretçiden site sahibi olarak size doğru akacak bilgiler, form arıcılığıyla siteye ulaşır.

Form ile siteye (siteye evsahipliği yapan Web Server’a) gelen bilgilerin bir program tarafından karşılanıp, işlenmesi gerekir. FrontPage piyasaya sürülünceye kadar Web Server programları CGI işlemleri için Perl ve benzeri dillerle yazılmış, ek programları yardıma çağırırlardı. CGI ve işlevlerine daha önce değinmiştik. Şimdi bir form yapacağız ve bu formla ilgili bilgileri nasıl işlemesini istediğimizi FP’e bildireceğiz. FrontPage, sitemizi daha sonra kendisiyle uyumlu bir Server’a ev sahipliği yapması için verirken, bu talimatlarımızı Server’a aynen aktaracaktır.

Örnek sitemizde FP bizim için bir değil, bir kaç form oluşturdu. Fakat bu önemli konuyu daha iyi kavrayabilmek için, biz kendi formumuzu tamamen sıfırdan inşa edelim. Önce FP Explorer’da Navigation görünümünde, “Öneriler Tartisma Sorular ve Cevaplar” sayfasının adını kısaltıp Öneriler yapın; bu sayfanın dosya adını da Oneriler.htm olarak düzeltin. Bu sayfaya bağlı üç sayfadan Öneriler sayfasının adını Görüşleriniz; HTML dosyasının adını Gorusform.htm olarak değiştirin. Yeni Görüşler sayfasını iki kere tıklayın ve Editör’de açıldığında sayfanın içinde göreceğiniz “Use the form..” diye başlayan metni ve altındaki form unsurlarının tümünü tarayıp, klavyede Delete tuşuna basarak silin. Silemediğiniz unsur kalırsa, sayfanın altındaki HTML sekmesini tıklayarak, açılacak sayfada <FORM>...</FORM> etiketlerinin arasında kalan herşeyi, etiketler dahil, silin. Normal sekmesini tıklayarak sayfaya geri döndüğünüzde eski formdan hiç bir iz kalmayacaktır. Şimdi, sıfırdan bir form inşa edebiliriz.

Formun Unsurları

Internet’te bir çok sitede gördüğünüz gibi, formlarda genellikle metin girmeye mahsus kutular, seçme yapmaya yarayan, adına radyo düğmesi denen ve içine bir nokta konan seçenek maddeleri, yine tercih belirtmekte kullandığınız fakat içine çarpı işareti konan kutular, yanındaki seçme okunu tıkladığınızda açılan ve içinde tercih etmeniz için çeşitli seçenekler bulunan listeler, ve nihayet bu formu göndermeye veya içindeki silmeye yarayan düğmeler bulunur. Şimdi örnek formumuzda “Form Field” (Form alanı) denen bu unsurların hepsini kullanalım.

Metin imlecinin durduğu yere şu kısa sunuş paragrafını yazabilirsiniz:

“Görüşleriniz benim için çok önemli

Sitemi ziyaret ettiğiniz ve görüşlerinizi benimle paylaşmak istediğiniz için teşekkür ederim. Bu formu doldurarak eleştirilerinizi veya arzularınızı bana iletebilirsiniz. Sitemde yayınlanmasını arzu ettikleriniz dışında, vereceğiniz bilgileri hiç bir kişi veya kuruluşla paylaşmayacağımı bildirir, saygılar sunarım.”

“..sunarım.” kelimesinden sonra  klavyede Enter’a basın ve imleç yeni paragrafın başında iken Insert/Ekle menüsünden Form Field’i, onun açacağı menüden de “One-line Text Box” (Tak satırlık metin kutusu) maddesini seçin. Bu maddeyi tıkladığınız anda, boş paragrafın altında, kesik çizgili bir kutu içinde boş bir metin kutusu ile iki düğme belirecektir. Kesik çizlgili kutu, sayfanızdaki formun tümünü kapsayan alandır; bunun içinde de şimdilik üç form alanı bulunuyor. Her form, en az bir (Gönder), genellikle iki (Gönder ve Sil) komutu içermelidir. Formun içine komut düğmesi koymayabilirsiniz; ama o zaman ziyaretçi bu forma yazacağı şeyleri veya yapacağı tercihleri size (sitenize, sitenizin ev sahibi Web Server’a) ulaştıramaz. Gönder düğmesi (üzerinde ne yazarsa yazsın) formdaki bilgileri göndermeye yarar; yine üzerinde ne yazarsa yazsın Sil düğmesi ise ziyaretçinize formu yeniden doldurması için bir kolaylık sağlar. Formunuza Sil düğmesi koymazsanız, ziyaretçi yanlış yazdığı şeyler tek tek düzeltmek zorunda kalacaktır. FP, bir form alanı açtığınız ve içine bir metin kutusu koyduğunuz anda, bu formun size ulaştırılması için bir Gönder (Submit) ve bir de Sil (Reset) düğmesi koyarak, formunuza işlevsellik kazandırmış oldu.

Form alanının içini tıklar ve klavyede sağ-sol, aşağı-yukarı tuşlarına basarsanız, imlecin form alanı içinde hareket ettiğini göreceksiniz. Bu suretle imleci, metin kutusunun soluna getirin ve (tırnak işaretlerini yazmadan) “Adınız:” yazın ve bir boşluk verin. Sonra, sağ ok tuşuna basarak, imleci metin kutusunun sağına geçirin ve klavyede Shift tuşunu tutarak Enter’a basın. Böylece imleci tam bir paragraf boşluğu vermeden aşağı satıra değil, sadece bir satır aşağı geçirmiş olursunuz. Şimdi “Soyadınız:” yazın ve bir boşluk verdikten sonra, Insert menüsü yoluyla bir tek satırlık metin kutusu daha girin. Bu kutunun da sağında Shift+Enter’a basın. Fakat iki metin kutusu tam alt alta gelmedi! “Adınız:” kelimesinden sonra bir kaç boşluk vermeyi deneyin. Form tasarımının en güç tarafı kutuların etiketlerini (Adınız, Soyadınız gibi kelimeleri) ve bunların metin kutularını hizalamaktır. Siz kendi ekranınızda bu hizalamayı başarsanız bile, ziyaretçinizin Browser programının kullandığı varsayılan harflere göre, form unsurlarınızın hizası yine bozulabilir. Yol yakınken, böyle boşluklarla hiza tutturma yerine, tablodan iskelet unsuru olarak yararlanma yoluna gidelim.

Metin imlecini, “Adınız:” kelimesinin tam soluna getirin ve Table (Tablo) menüsünden Insert Table (Tablo ekle) maddesini seçin ve açılan kutuda Rows (Sıralar) hanesine 15, Columns (Sütunlar) hanesine de 2 yazın. Layout (Konum) ayarlarını değiştirmeden, Width (Genişlik) hanesindeki 100 rakamını 95 olarak değiştirin. OK’i tıkladığınızda Form’un içinde bir tablo belirecektir. Tablonun altındaki metin kutuları ile “Adınız:” ve “Soyadınız:” kelimelerini silin. Düğmeler kalsın. Şimdi sırasıyla şu işleri yapabilirsiniz (tırnak içinde gösterilen yazıları yazarken tırnak işaretini yazmayacaksınız):

1. Birinci sıra-birinci sütuna “Adınız:” yazın;

2. İkinci sıra-birinci sütuna “Soyadınız:” yazın;

3. Üçüncü sıra-birinci sütuna “E-Adresiniz:” yazın;

4. Dördüncü sıradaki iki kutuyu birleştirin (iki kutuyu birden tarayın; herhangi birini sağ-tıklayın, açılacak menüden Merge Cells (Hücreleri birleştir) maddesini seçin. Sonra bu ku ktunun içine “Amatör fotoğrafçı mısınız?” yazın;

5. Altıncı sıradaki iki kutuyu birleştirin ve bu kutuya “Sitemden yararlandınız mı?” yazın;

6. Sekizinci sıradaki iki kutuyu birleştirin ve bu kutuya “Beğendiğiniz fotoğraflar:” yazın;

7. 10’ncu sıradaki iki kutuyu birleştirin ve kutuya “Duyurmak istediğiniz bir sergi ve gösteri varsa, aşağıdaki kutuya yazabilirsiniz:” yazın;

8. 12’nci sıradaki iki kutuyu birleştirin ve bu kutuya “Fotoğraflarımla ilgili eleştirilerinizi belirtmek isterseniz, aşağadaki kutuya yazabilirsiniz:” yazın;

9. Üzerinde “Submit” yazılı düğmeyi tıklayın ve Mouse işaretçisiyle tutarak, 15’nci sırada birinci sütundaki kutunun içine bırakın. Aynı şekilde üzerinde “Reset” yazılı düğmeyi, aynı sırada ikinci sütuna taşıyın;

10. Birinci sırada ikinci sütunu tıklayın; Insert/Form Field/One-line Text Field’i seçin; aynı şekilde ikinci sırada, ikinci sütuna ve üçüncü sırada ikinci sütuna tek satırlık metin kutusu koyun;

11. Beşinci sırada ikinci sütunu tıklayın; Insert/Form Field/Check Box (İşaret kutusu) maddesini seçin. Hücrede kare şeklinde kutu belirince, bir aralık verin ve “Evet” yazın; aynı yolla ikinci bir İşaret Kutusu ekleyin ve onun yanına “Hayır” yazın.

12. Yedinci sırada ikinci sütunu tıklayın; Insert/Form Field/Radio Button (Radyo düğmesi) maddesini seçin. Hücrede içi boş küçük daire belirince, bir aralık verin ve “Evet” yazın; aynı yolla ikinci bir Radyo Düğmesi ekleyin, yanına “Hayır”; üçüncü bir radyo düğmesi ekleyin ve yarına “Kısmen” yazın;

13. Dokuzuncu sırada ikinci sütunu tıklayın; Insert/Form Field/DropDown Menu (Açılan menü) maddesini seçin. Hücrede solunda seçme oku olan bir kutu belirince, bu kutuyu sağ-tıklayın ve açılacak menüden Form Field Properties (Form Alanı Özellikleri) maddesini seçin. DropDown Menu Properties kutusunda, sağdaki Add (ekle) düğmesini tıklayın; açılacak kutuda Choice (Tercih) hanesine “Bir tercih yapın” yazın; Specify Value: (Bir değer belirt) kutusuna işaret koyun ve bu satırın altındaki haneye “Tercih yok” yazın; OK’i tıklayın. Tekrar Add’i tıklayın, Choice olarak “Hiçbirini,” yazın; Value kutusuna işaret koyduğunuzda Value hanesinde “Hiçbirini” kelimesi belirecektir. OK’i tıklayın. Aynı yöntemle Doğa, Gezi, Portre ve Diğer seçeneklerini ve değerlerini girin. Properties kutusunun Height (Yükseklik) hanesine 1 yazın. “Allow multiple selections” (Çok tercihe izin ver) sorunun karşısında No (Hayır) seçeneğinin işaretli olmasına dikkat edin; ve kutunun OK düğmesini tıklayın.

14. Önce 11’nci, sonra 13’ncü sıradaki iki hücreyi birleştirin ve bu hücrelere Insert/Form Field/Scrolling Text Box (Kaydırılan metin kutusu) ekleyin. Kutu belirince, sağ ve altındaki tutamakları kaydırarak, ebadını genişletin.

Formunuzun oluşturulması bitti; fakat görünümle ilgili bir kaç iş daha yapılabilir. Örneğin, önce tablonuzun çerçevelerini kaldırın (Herhangi bir hücreyi sağ tıklayın ve açılacak menüden Table Properties’i seçin; Border Size’ı sıfır yapın), sonra tablonun hücreleri sağ tıklayarak ve açılacak menüden Cell Properties (Hücre Özellikleri) maddesini seçerek hücrenin içindeki unsurun zevkinize göre ortada, solda veya sağda olmasını sağlayın.

<FP00050.tif>

Alanlar ve Değerler

Sıra geldi, ziyaretçilerin bu formla sitenize (sitenize ev sahipliği yapan Server’a) göndereceği bilgilerin kullanışlı hale getirilmesine. Forma koyduğunuz bütün alanların (işaret kutuları, radyo düğmeleri, seçmeli liste unsurları ve metin kutuları) bir değeri vardır, ve bu değer Server’a bir ad altında gönderilecektir. Bu ad ve değer çifti size ya bir metin dosyasına eklenerek ya da bir elektronik mektup ulaştırılacaktır; bu bilgiler elinize geldiği zaman anlamlı olması gerekir. T1=Ali veya T2=Veli pek anlamlı sayılmaz; Adı=Ali, Soyadı=Veli ise çok daha kullanışlı bilgidir. Aynı şekilde R1=V2 yerine “Yararlı=Hayır” çok daha anlamlı olur. Bunu, beğenilen fotoğraf türleri sorusunun cevabı olan seçenek listesinde kısmen yaptık; seçeneklere uygun değerler verdik, Şimdi Insert yoluyla formunuza eklediğiniz alanları sırasında sağ tıklayarak ve Form Field Properties maddesini seçerek yapalım.

1. Adınız’ın karşısındaki metin kutusunun Name/Adı hanesine “Ad” yazın. Bu kutudaki Tab Order hanesine 1 yazın. (Tab Order/Sekme sırası, ziyaretçinin formun haneleri arasında klavyesindeki sekme tuşuna basarak ilerlemesi halinde hangi kutudan hangi kutuya gideceğini belirler.) Sonra OK’i tıklayın.

2. Soyadınız’ın karşısındaki metin kutusunun Name/Adı hanesine “Soyad” yazın. Tab Order, 2 olacak.

3. E-adresiniz’in karşısındaki metin kutusunun Name/Adı hanesine “Eadres” yazın. Tab Order, 3 olacak.

4. “Amatör Fotoğrafçı mısınız?” “Sitemden yararlandınız mı?” ve “Beğendiğiniz fotoğraflar?” sorularına istediğimiz cevaplarda olduğu gibi, ziyaretçinin tercih yapacağı durumlarda bize ulaşacak bilginin adı ile tercih edilen seçeneğin değeri birleştirilecektir. Bu sebeple, bu soruların cevapları olacak seçeneklerin hepsini adı aynı olmalıdır. Buna göre, Amatör fotoğrafçı mısınız?” sorusunun cevap şıklarından olan Evet’in önündeki kutuyu sağ tıklayın; açılacak menüden Form Field Properties’i seçin ve Name/Adı hanesine “Amator” yazın. (Bu kelimeyi ne tür bir Browser’ın Server’a yollayacağını ve Server’ın ne tür bir sistemde çalışacağını bilmiyoruz. Browser ve Server’ın Türkçe’yi desteklemeyeceği ihtimalini dikkate alarak, sistem değişkeni olacak bu kelimeyi Türkçe yazmaktan kaçındık!)  Value/Değer hanesine “evet” yazın. Tab Order, 4 olacak. Hayır kutusu sağ-tıklayın; açılacak menüden Form Field Properties’i seçin ve Name/Adı hanesine yine “Amator”; Value/Değer hanesine “hayir” yazın (yine Türkçe harften kaçındık); Tab Order’ı 5 yapın. Şimdi, ziyaretçi Evet’i de işaretlese, Hayır’ı da işaretlese, Browser, Server’a aynı bu kutuların değerlerini aynı ad’la gönderecektir. (Dikkat: “Amator” kelimesini her iki kutuda da aynı şekilde yazın!)

5. Bu işlemin benzerini, “Sitemden yararlandınız mı?” sorusunun karşılıklarına da yapacağız. Burada Name/Adı hanesine “Yarar” ve Value/Değer hanesine her üçü için sırasıyla “evet,” “hayir” ve “kismen” yazacağız. (Dikkat: “Yarar” kelimesini bazı kutularda büyük harfle, bazılarında küçük harfle yazmayın!) Evet’in sekme sırası 6, Hayır’ın 7 ve Kısmen’in 8 olacak.

6. “Beğendiğiniz fotoğraflar” sorusunun cevap seçenekleri kutusunu sağ tıklayın; açılacak menüden Form Field Properties’i seçin ve Name/Adı hanesine “Begeni” yazın. Bu kutunun Valu/Değer bölümünü daha önce doldurmuştuk. Tab Order, 9 olacak.

7. Duyurulmak istenen olaylarla ilgili metin kutusunun adını “Duyuru,” sekme sırasını 10 yapın.

8. Eleştiri metin kutusunun adını “Elestiri,” sekme sırasını 11 yapın,

9. Submit düğmesinin adını “Gonder,” Value/Label (Değer/Etiket) hanesini “Gönder” ve sekme sırasını 12 yapın.

10. Reset düğmesinin adını “Sil,” Value/Label hanesini “Sil” (kelimenin önüne ve arkasına üç boşluk koyun!) ve sekme sırasını 13 yapın.

Form Bilgilerini İşleme

Formun bilgi alıp-verme işinin teknik bölümünü artık sonuçlandırabiliriz. Bunun için formun bir yerini sağ tıklayın; açılacak menüden Form Properties (Form Özellikleri) maddesini seçin:

<FP00051.tif>

FrontPage, sitenizi FrontPage Extensions yüklenmiş bir Server’da  ziyaretçilerinize açacağınızı varsayarak, formla elde edeceğiniz bilgilerin tabi tutulacağı işlemleri FP Extensions’a göre belirliyor. Ancak arzu ederseniz, FP, formunuzun sağlayacağı bilgileri, özel bir programa, CGI programına, Active Server Pages teknolojisi ile çalışan bir programa veya Netscape Server API denen bilgi işlem araçlarına da gönderebilir. Burada FP Extensions üzerinde duralım.

FrontPage Extensions (FPE) adı verilen ve Server’da çalışan programcıklar, bir ziyaretçinin Browser’ın Server’a bilgi akışı olduğu zaman (ziyaretçi formdaki Gönder düğmesini tıkladığı zaman) bir kaç iş yapabilirler. Kısaca bu işlemlere değinelim:

1. FPE, önce, ziyaretçinin formu doğru doldurup doldurmadığını denetler. Form Field Properties kutularında gördüğümüz Validation düğmesi ile açabileceğini denetleme ve doğrulama kutularında bu alana örneğin sadece harf veya sadece rakam yazılmasını, yazılacak metnin belirli bir harf toplamını, yazılacak rakamın belirli bir büyüklüğü  geçmemesini sağlayabilirsiniz. Formda boş bırakılmasını arzu etmediğiniz alan varsa, bunu belirtebilirsiniz. FPE, formun Validation/Doğrulama şartlarını uygun olup olmadığını denetledikten sonra, uygunsuzluk bulursa, ziyaretçiyi sizin vereceğiniz bir metni Browser’ına göndererek uyarır. (Bu metnin HTML koduyla yazılmış olması gerekir.) Bu denetleme işlemini sitenizin güvenliğini arttırmak için kullanabilirsiniz. Örneğin bazı kötü niyetli kişilerin elektronik posta adresi olarak bazı işletme sistemlerinde çalışan Web Serverların anlayacağı dilden komut kelimeleri gönderdikleri bilinir. Mesela içinde boşluk olan elektronik adresi reddetmek adresin doğruluğunu sağlamak için de iyi olur.

2. FPE, form doğru doldurulmuşsa, ziyaretçinize sizin belirleyeceğiniz bir teşekkür mesajı gönderebilir. (Bu metnin de HTML koduyla yazılmış olması gerekir.)

3. FPE, doğru bir form bilgisinin kendisine ulaştığını farkedince formla Server’a gelen bilgileri, ya kendisi basit kayıt işlemine tabi tutar, ya yine kendisine ait Tartışma Grubu İşlemcisine aktarır, ya da bir başka programa devreder. Bu bilgilerin FPE tarafından basit kayıt işlemine tabi tutulacaksa, başlıca iki işlem yapılır: bu bilgiler bir veya iki metin dosyasına eklenir; ve/veya  bir elektronik posta adresine gönderilir. Bu işlemlerden hangisinin yapılmasını istiyorsanız, bunu Form Properties kutusundaki ayarlarla belirtirsiniz. Bu işlemlerden hangisini seçeceğinizi bilmiyorsanız, kutudaki ayarlara dokunmayın.

Form bilgisi işlemleri göründüğü kadar karışık değildir. Bir kere FP, bu bilgileri ziyaretçilerin giremeyeceği, sadece Server’ı işletenlerle Site sahibi olarak sizin ulaşabileceğiniz “_private” adlı bir klasör oluşturacaktır. Bu klasöre, FP Editör’ü kullanarak, “Teşekkür ederim.. Formunuzu aldım.. Gerekeni yapacağız..” anlamında bir içeriği bulunan ve adı tesekkur.htm olan; “Formun doldurulmasında hata var. Lütfen tekrar doldurun” gibi bir cümle içeren, ziyaretçiye forma geri dönmesini sağlayan bir bağlantı veren ve adı hata.htm olan iki dosya kaydedin. Form Properties kutusunda Options/Seçenekler düğmesini tıklayarak açacağınız kutuda bu dosyalara bağlantı sağlayın:

<FP00052.tif>

Options kutusunda dört sekme göreceksiniz. Birinci sekmede formdan gelen bilgilerin kaydedileceği dosya ile ilgili ayrıntılar bulunur. Bu dosyanın düz yazı, Web sayfası veya herhangi bir veritabanı biçiminde olmasını buradan sağlayabilirsiniz. Ayrıca formdaki alan adlarının alan değerleri ile birlikte kaydedilip edilmeyeceği sonuçların dosyanın baş tarafına mı, sonuna mı ekleneceği gibi ayrıntıları da burada göreceksiniz. Form bilgilerini iki ayrı dosyaya kaydettirmek istiyorsanız, bunu da burada belirteceksiniz. Form sonuçlarının bir elektronik adrese elektronik posta olarak gönderilmesini de istiyorsanız, bunun ayrıntılarını ikinci sekmede belirtebilirsiniz. Alıcı elektronik posta adresi, formun oluşturacağı mesajlara verilecek ortak konu adı, mesaja nelerin dahil edileceği gibi unsurlar bu sekmededir. Üçüncü sekme olan Confirmation/Onaylama bölümünde ise hatalı ve doğru formlara gönderilecek karşılık sayfaların adlarını belirtebilirsiniz. Formunuzun herhangi bir alanında Validation kuralı yoksa, bu sekmedeki ikinci bölüm etkin olmaz. Ve nihayet dördüncü sekme olan “Saved Fields” (Kaydedilecek alanlar) bölümünde formun hangi alanlarının kayıtlara geçirilmesini istediğinizi belirtmeniz mümkündür. Bu son sekmede ikinci bölümde, formda olmayan ama her Browser’ın formla birlikte Server’a otomatik olarak gönderdiği saat, tarih, ziyaretçinin bilgisayarının adı, ziyaretçinin adı ve kullandığı Browser’ın türü gibi bilgileri de kaydettirme imkanınız vardır.

Arama Formu

FP, sadece ziyaretçilerinizin dolduracağı formlar oluşturmakla kalmaz, fakat bir de Arama Formu (Search Form) oluşturmanız için araç sağlar. Arama formu ile ziyaretçi formu arasındaki başlıca fark, arama formunun FrontPage Extensions’ın bir parçası, yani bir program arayüzü olmasıdır. Bu form ve ona bağlı program, elde edeceği sonuçları site sahibi olarak size ulaştırmaz, ziyaretçiye gönderir.

Sayfanıza koyacağınız Arama Formu’nun işleyebilmesi için sitenize evsahipliği yapan Server’da mutlaka FP Extensions’ın kurulu ve çalışır olması gerekir. FPE, arama formu ile ziyaretçinin sitenize göndereceği arama emrini icra eder ve sonuçları (hazır verilen fakat sizin istediğiniz gibi değiştirip yeniden biçimlendirebileceğiniz) bir şablona yazarak, ziyaretçiye gönderir.

Bu kitapçıktaki örnekleri birlikte yaptı isek, oluşturduğunuz sitede, Ara adlı bir sayfa ve içinde (henüz değiştirmediğimiz için) İngilizce bir metin ve arama formu var.

Sitenize, bugüne kadar çok yüksek ek ücretlerle kazanılabilen Arama Motoru imkanını iki tıklamayla kazandırmak istiyorsanız, ya bu sayfayı düzeltin, ya da yeni bir sayfa açıp, arama formu girin. Arama Formu, sayfanıza Insert menüsünde Active Elements maddesinden Search Form (Arama Fodrmu) maddesi seçilerek konulur. İster boş bir sayfaya yeni bir Arama Formu girin ve oluşacak kutuyu sağ tıklayın; isterseniz, mevcut Ara sayfasındaki arama formunu sağ tıklayın; açılacak menüden FrontPage Componet Properties (FrontPage Unsuru Özellikleri) maddesini seçin ve arama moturu bağlantınızın başlıklarını verin:

<FP00053.tif>

Bu kutunun ikinci sekmesinde değişiklik yapmak gerekmez. Tamam’ı tıkladığınızda verdiğiniz başlıkların yer aldığı Arama Moturu bağlantısını göreceksiniz. Arama moturunun üstüne, ziyaretçilerinize bu bağlantının nasıl kullanıldığını anlatan bir kaç cümlelik bir açıklama notu da yazabilirsiniz. Bu metinde anlatmak istediğiniz bilgiler, Microsoft Query Language ile aramanın nasıl yapıldığına ilişkin olmalıdır. Query Language denen arama dilinde, AND, girilen bütün kelimelerin birden bulunduğu metinlerin bulunmasını; OR, girilen kelimelerin herhangi birinin bulunmasını; NOT, kendisinden sonra gelen kelimenin bulunmamasını sağlar. “*” harfi ile baştarafı verilen karakterleri içeren bütün kelimelerin bulunmasına imkan verir:

<FP00054.tif>

Sayfanıza koyacağınız arama formunun sonuç elde edebilmesi ve bu sonuçları ziyaretçiye bildirebilmesi için sitenize ev sahipliği yapan Server’da FrontPage Extensions’ın yüklü ve çalışır durumda olması gerekir. Server’ı işleten firma veya kişi size FP Extensions’ın arama sonuçlarını yazacağı şablonu oluşturma veya düzeltme imkanı verecektir. Fakat genel olarak bu sayfada, sitenizde bulunan ve arama yapılan kelime veya kelimelerin içinde geçtiği ve ziyaretçilerden gizlenmemiş olan bütün belgelerin bir listesi bulunacak ve ziyaretçi bu listedeki bir belge adını tıkladığında belgenin içeriği ziyaretçinin bilgisayarında görüntülenecektir.

Ders 7: Sitenizi Sınayın ve Yayınlayın

İşte bu kadar.. Sitemizi, büyük ölçüde FrontPage’in yardımıyla ve oldukça kolay inşa ediverdik. Fakat Internet’te herşey her zaman planlandığı gibi yürümez. Bunun için sitemizi Internet’e koyarak, kamuoyuna açmadan önce kendi sabit diskimizde sınamamız gerekir. Sitemizin gerçek bir Server’da olması halinde işleyecek FrontPage Extensions programıyla yapılacak form bilgilerini işleme ve arama işi dışında, diğer unsurlarının işlediğini, bağlantıların gerçek hedeflerini bulduğu, ses ve video dosyalarının yerli yerinde olduğunu sınamak zorundayız.

Bu kitapçıktaki örnekleri birlikte yaptıysak, sizin siteniz de şu görünümü almış olmalı:

<FP00055.tif>

Navigation görünümünde sitenizin planını bu şekilde görebilmek için boş bir yeri sağ-tıklayın ve açılacak menüden Rotate/Döndür maddesini seçin. Sağdaki menülerle alttaki klasör ve dosya listesni çerçevelerini sağa ve alta iterek kapatabilirsiniz.

Sitenin sınanması ve yayınlanması, bir kaç aşamadan oluşur. Şimdi sırasıyla bu işleri yapabiliriz.

Bağlantıları Doğrulatma

Sitemizi oluşturan sayfaların kendi aralarında ve sayfaların içinde başka sitelere çeşitli bağlantılar bulunur. Önce bu bağlantıların geçerli ve şler vaziyette olduğunu denetmemiz gerekir. FP’in Hyperlinks görünümünü seçerseniz, sayfalarınızın kendi aralarında ve başka yerlerle bağlantılarını şema halinde görebilirsiniz:

<FP00056.tif>

Bu görünümde her sayfanın ana sayfaya göre konumu gösterilir. Sayfaların üzerindeki artı işaretini tıklarsanız, o sayfadan aşağı doğru veya başka yerlere bağlantıları da görebilirsiniz. Örneğin burada, Yeni Filmler sayfasının Yenilikler sayfasına iki bağlantısı, Yeni Teçhizat sayfasına ise bir bağlantısı bulunuyor.

Bağlantıları şema olarak görmek hangi sayfanın hangi sayfaya bağlantısı olduğunu gösterir; ama bu bağlantının  kopuk olup olmadığını göstermez. Bunu sağlamak için, FP’in Tolls/Araçlan menüsünden Verify Hyperlinsk/Bağlantıları Doğrula maddesini seçmemiz gerekir. FP, site içi bağlantıları kolayca denetleyecektir; fakat site dışı bağlantıları, başkalarının sitelerine verdiğiniz linkleri sınayabilmesi için, bulunduğu bilgisayarın Internet bağlantısı olması gerekir. Bilgisayar Internet ile bağlantı kurabiliyorsa, FP, tıpkı bir Browser gibi telefonu çevirerek, link sağladığınız bir bütün URL adreslerini kontrol edecektir. FP içinde kopuk bağlantıları nasıl onardığımızı daha önce ele almıştık.

Siteyi Internet’e Yerleştirme

Ve beklediğiniz az geldi; bütün emeklerinizin karşılığını şimdi alacaksınız. Tabiî herşeyden önce, FP’in sizin kişisel Web Server’ınızı kurduğu bilgisayarın Internet bağlantısı olması ve ISS aracılığıyla Internet ile bağlantınız olması gerektiğini belirtmemiz gerekiyor. Bu bağlantı ile sitenize Internet’te ev sahipliği yapmak üzere bulduğunuz firma ile bağlantınızı karıştırmayın.

İlk derste ele aldığımız gibi, sitenin planlama aşamasında, bulduğunuz Web Server Evsahibi firma, FrontPage uyumlu bir Server işletiyorsa, bütün yapacağınız şey, yeni sitenizin HTTP adresini Frontpage’e vermekten ibarettir. Sitenizin büyüklüğüne ve bağlantınızın hızına göre, siteniz evsahibi Server’a bir kaç dakika içinde aktarılmış olacak,

Bu ana kadar bir evsahibi firma bulmadıysanız, FP’i kapatıp; ya bilgisayar dergilerindeki ilanları karıştırmaya başlamalısınız, ya da Internet Browser programınızı açıp, kendisine bir Web Server Hosting (Evsahibi) firma bulmalısınız.

Bu konuda çeşitli seçenekleriniz var: evsahibi firma ücretsiz Web sitesi alanı veren bir kurum olabilir; sitelere belirli bir ücret karşılığı evsahipliği yapıyor olabilir. Ücretsiz site alanı verenler, sizin sitenize koymanızı zorunlu tutacakları reklamlarla para kazanırlar. Hatta evsahibi firmasının Server’ı, kendi reklamlarını sizin sayfalarınıza otomatik olarak koyar; sayfanızın bütün tasarım incelikleri, bu otomasyona bir anda kurban gider. Eğer ücretsiz site edinmekten başka çareniz yoksa, sayfalarınızı bu reklamları dikkate alarak tasarlayabilirsiniz. Bu tür evsahibi firmalar, ne kadar çok kişiye ücretsiz alan sağlarlarsa, kendi sitelerinin de o kadar çok kişi tarafından ziyaret edileceğini düşünerek kendi sitelerini iyi bir reklam aracı olarak pazarlayabilirler. Yani bu işten herkes kazançlı çıkar!

Ne var ki, bedava site alanı veren evsahipleri, sayfalarınıza zorla reklam sokmanın yanı sıra, çoğu zaman sınırlı CGI programı imkanı tanırlar, ve genellikle FP Extensions, Index Server ve hele elektronik ticaret gibi gelişmiş türde hizmetleri sunmazlar. Bu tür hizmetlerden yararlanabilmek için, ayda 30 Dolar’dan başlayan bir kira ödemek gerekebilir.

FrontPage ile site oluşturduktan sonra, ev sahibi Web Server’da bazı imkanlar yok ve özellikle evsahibi firma sayfalarınıza koyduğunu otomatik form işleme ve arama motorunu çalıştıracak FrontPage Extensions imkanı sağlamıyor diye üzülmenize gerek yok. FP, yeni sitenizin adresini arayarak Server ile ilk teması kurduğunda, Server’ın uyumlu olmadığını anlayacak ve sitenizi otomatik yüklemekten vazgeçerek, klasik FTP (File Transfer Protocol) yöntemine başvuracaktır.

Siteniz Internet’e açılmaya hazır durumda ise şimdi, daha önce sitemizden sınama maksadıyla kopya aldığımız gibi File/Dosya menüsünden Publish FrontPage Web/FrontPage Web’i Yayınla maddesini seçelim ve açılacak kutuda More Webs (Başka Web’ler) düğmesini tıklayalım. Açılacak kutuda sitenize ev sahipliği yapacak firmanın size verdiği HTTP adresini yazalım:

<FP00057.tif>

Bu adres “benim_sitem.ev_sahibi.com” şeklinde bir URL olmalı; fakat bu adres firmadan firmaya değişebilir. OK’i tıkladığınızda, FP, evsahibi Server’da FP Extensions bulunup bulunmadığını sınayacak ve varsa sitenizi kendiliğinden Server’a kopyalayacaktır. FP, FP Extensions’ı bulamazsa, kendiliğinden Microsoft Web Yayınlama Sihirbazı’nı çalıştırarak, sizden ek bilgiler isteyecektir. Bu bilgiler arasında evsahibi Server firmasının size vermiş olması gereken FTP adresi, FTP için kullanıcı adı ve şifresi ve sitenizi oluşturacak dosyaları çıkartacağınız (upload) klasörün adı bulunur.

Bundan sonrası, sitenizi “hedef kitleye” duyurmaya kalıyor!

D

W/O: 166421

W/O: 145821

W: 167316