Front page
Frontpage ile site yapımını örnek bir site yaparak anlatmaya çalışacağım. Yapacağımız site duvar kağıtları içeren basit bir site olacak. Sitenin anasayfasına bir kaç küçük resim ekleyeceğim ve bu resimlere tıklandığında, resmin ait olduğu kategorinin anasayfalası açılacak. Kategori anasayfalarında ise yine küçük resimler olacak ve bu resimler tıklandığında daha büyük resimler yeni pencerede açılacak. Sitemi yapmak için aşağıdaki şablonu kullanacağım.
Bu sayfada web sitesi şablonunda değişiklikler yaparak sitemizi oluşturmak için website şablonunu nasıl hazırlayacağımızı ve statik web siteleri hakkında genel bilgileri öğreneceğiz.
Öncelikle zip halindeki web şablonunu zip dosyası içerisinden çıkarıp C diskinde açtığımız bir klasörün içine kopyalıyoruz. Bu klasörün adını Websitem olarak değiştiriyoruz. Aşağıdaki resimde gördüğünüz gibi şablon dosyalarını C diskindeki Websitem klasörüne kopyaladım.
Buradaki Websitem klasörü kök klasör olarak adlandırılır. Diğer bir ifadeyle web sitemizin dosyalarını barındıran en üst seviyedeki klasöre kök klasör veya kök dizin denir. Web sitemiz için kullanacağımız resimler, videolar, müzikler ve diğer dosyalar kök klasör içinde olmalıdır. Eğer sayfalarımıza kök klasör içinde olmayan bir resmi eklersek, sitemizi yayınladığımız zaman düzgün çalışmaz. Çünkü sunucuya sadece kök klasörü göndereceğiz. Şimdi şablondaki dosyalar hakkında kısa bilgiler verelim.
index.html (veya index.htm) dosyası, .html uzantısı olduğu için web sayfasıdır. Bu web sayfasını yapacağımız sitenin ana sayfası olarak kullanacağız. Çünkü bir siteyi ziyaret ettiğimizde, tarayıcımız (Internet Explorer, Firefox gibi) bize o sitenin index.html sayfasını gösterir. Örneğin bedavasiteyapmak.com adresini ziyaret ettiğinizde bedavasiteyapmak.com/index.html sayfasını ziyaret etmiş olursunuz. O nedenle bu sayfanın adını ve yerini kesinlikle değiştirmeyeceğiz. Sitemizin ana sayfasının sorunsuz açılması için kök dizinde mutlaka bir tane index.html olmalı.
img: Bu websitesi şablonunu hazırlayan kişi, img klasörünü varsayılan resim klasörü olarak kullanılmış. Şablonda kullandığı resimleri bu klasöre eklemiş. Biz de sitemize ekleyeceğimiz resimleri önce bu klasöre, daha sonra web sayfamıza ekleyeceğiz. İlerleyen derslerde bu klasörün adını resimler olarak değiştireceğiz ama önce sitemizi Dreamweaver'e tanıtmamız gerekiyor. Nedenini ilerleyen derslerde açıklayacağız.
Source: Bu klasör, şablonda kullanılan logonun yazısız olanını içeriyor. Bu logoyu kullanarak ve üzerine kendi sitemizin adını ve sloganını yazarak web sitemiz için logo oluşturabileceğiz.
style.css: Bu dosya sitedeki yazı stillerini düzenlemek için kullanılıyor. Biz bu dosyada değişiklik yapmayacağız, bu dosyayı kullanmayacağız. Ancak şablonu hazırlayan kişi bu dosyayı kullanmış olabilir. O nedenle bu dosyayı silmeyeceğiz.
SİTE TANIMLAMAHazırladığımız şablonda yapacağımız değişikliklerin sorunsuz çalışması için şablonumuzu Frontpage'ye tanıtmamız gerekiyor. Bu sayfada sitemizi nasıl Frontpage'ye tanıtacağımıza değineceğiz.
Frontpage'yi açalım ve en sütteki menüden Dosya>Site Aç... butonlarına tıklayalım. Yeni bir pencere açılacak ve buradan sitemizin kök klasörünü seçeceğiz. Aşağıdaki resimde de gördüğünüz gibi kök klasöre kadar şablonu açın ve Aç butonuna tıklayın.
Aç butonuna tıkladıktan sonra yeni bir pencere daha açılacak. Frontpage'nin gerekli bilgileri sitenize eklemesine izin vermek için bu penceredeki Evet butonuna tıklayın.
Yukarıdaki resimde de görüldüğü gibi Frontpage sitemize iki yeni klasör ekledi. Frontpage bu klasörlerden images klasörünü varsayılan resim klasörü olarak kullanıyor. Bir önceki dersten hatırlayacağınız gibi bizim şablonumuzda kullanılan resimler img klasöründeydi. İsterseniz img klasöründeki resimleri images klasörüne taşıyabilirsiniz veya hiç bir değişiklik yapmadan her iki klasörü kullanabilirsiniz. Ancak resimleri taşımayı seçtiyseniz, taşıma işlemini Frontpage'den yapmanız gerekiyor. Eğer C diskine girerek sitemizin dosyalarını açarsak ve img klasöründeki resimleri images klasörüne taşırsak, sayfalarda yapılması gereken kod değişiklikleri yapılamaz. Ancak Frontpage ile resimleri taşırsak, sayfalardaki gerekli kod değişiklikleri yapılır ve resimler sorunsuz çalışır. Frontpage ile resimleri taşımak için sol taraftaki Klasör Listesi bölümünden img klasörünün solundaki + işaretine tıklayın. Buradaki resimlerin tamamını fare ile seçerek images klasörü üzerine sürükleyin.
Sitemizi Frontpage'ye tanıtma işlemini tamamladık. Artık biz sitemizde değişiklik yaparken veya sitemize resim video, flash eklerken, Frontpage gereken html kodlarını sayfalarımıza ekleyecek.
www.forumbilgicik.tr.gg Anlatımıdır....
