3. Tabloları Kullanmak

Daha önce de belirttiğim gibi hazırladığımız sayfalar html formatındadır. Html dilinde her satıra sadece bir içerik ekleyebilirsiniz. Ekleyeceğiniz iki farklı içerik hataya sebep olabilir. Örneğin bir satıra hem yazı hem resim ekleyemezsiniz. Eklemek istediğinizde aşağıdaki resimde görülen problem ile karşılaşırsınız.

Bu problemi aşmak için bir bir satıra resim ve yazı eklemek yerine, bir tane tablo ekleyeceğim. Ama bu tablonun iki tane sütunu olacak. Tablonun sol sütununa resmi, sağ sütununa ise yazıyı ekleyeceğim. Bu yöntemle bir satıra sadece bir tablo ekleyerek hem resim hem yazıyı yanyana koyabileceğim.

Yukarıda gördüğünüz gibi tablo kullanarak resim ile yazıyı yanyana ekleyebildim. Bu örnekte tablonun görülebilmesi için çerçevelerin kalınlığını artırdım ve rengini beyaz yaptım. Siz çerçeve kalınlığını sıfır yaparak tabloları gizleyebilirsiniz. Sayfaların sorunsuz çalışması için tabloları kullanmalısınız. Çoğu web sitesi tablolar üzerine kuruludur. Bu sitelerde sayfa görünümü ile ilgili hatalar en az seviyededir. Örneğin tablolar üzerine kurulmamış bir site, farklı çözünürlük ayarlarına sahip bilgisayarlarda sorun yaratabilir. Örn: resimlerle yazıların iç içe geçmesi gibi..

Ekleme menüsünü (veya Insert>Table yolunu) kullanarak tablo ekleyebilirsiniz. Tablo eklemek istediğinizde açılan sayfadan tablodaki satır sayısını, sütun sayısını ve benzeri diğer özellikleri ekleyebilirsiniz.

Fare yardımı ile eklediğiniz tablonun uzunluk ve genişliğini ayarlayabilirsiniz. Ayrıca eklediğiniz tablonun üzerine tıkladığınızda özellikler panelinde tablonun özellikleri çıkacaktır. Buradan da değişikler yapabilir, tabloyu yeniden düzenleyebilirsiniz.

4. İçerik Ekleyelim

index.html sayfasını yani sitemizin anasayfasını açtık. Şimdi şablondaki yazıları silelim ve yerine bir tane fıkra ekleyelim. Fare ile yazıları seçerek ve klavyenizdeki Delete tuşunu kullanarak yazıları silebilirsiniz. Yazarak veya kopyala yapıştır yöntemi ile fıkrayı anasayfaya yazıyorum. (Resmi orjinal boyutunda görmek için üzerine tıklayın.)

5. Resim Ekleyelim

Fıkranın hemen altına bir tane komik resim ekleyelim. Ekleyeceğimiz resmi sitemizin kök klasörü içindeki images klasörüne koymamız gerekiyor. Aksi halde bilgisayarımızda sitemizi açtığımızda resim görünür ama sunucuya gönderdiğimizde görünmez. Sitemizin sorunsuz çalışması için eklediğimiz her video, resim flash vb. kök klasör içerisinde olması gerekir.

Şimdi resim eklemek istediğimiz yere fare ile tıklayalım. Insert>Image yolunu izleyelim (Aynı işlemi aşağıdaki resimde işaretli olan butona tıklayarak veya Ctrl+Alt+ I tuşlarına basarak da yapabilirsiniz.) ve eklemek istediğimiz resmi seçip OK butonuna tıklayalım. (Resmin üstüne tıklayarak orjinal boyutuna ve detaylı anlatımıyla ulaşabilirsiniz.)

6. Farklı Sayfalar Oluşturup Bağlantılarını Yapalım

Anasayfamızı oluşturduk. Şimdi farklı sayfalar oluşturalım ve ziyaretçilerin bir sayfadan diğerine gidebilmeleri için bağlantılar (linkler) ekleyelim. Fıkralar ve resimler ekleyeceğimiz sayfalar oluşturalım. Kolaylık olması amacıyla index.html dosyasını farklı bir isimle kaydedip tekrar düzenleyeceğiz. index.html dosyası açıkken File>Save as.. yolunu izleyerek fikralar.html yazıp Save butonuna basalım. Böylece görünümü index.html ile aynı ancak adı fikralar.html olan ikinci bir sayfa elde ettik. (Aynı işlemi kök klasörünüzdeki index.html dosyasını kopyalayıp tekrar aynı yere yapıştırarak ve adını fikralar.html olarak değiştirerek de yapabilirsiniz.)

Şimdi fikralar.html sayfasını açalım ve anasayfamız için yazdıklarımızı silip yerine yayınlayacağımız fıkraları ekleyelim. Böylece sayfayı baştan inşa etmek yerine index.html dosyasında birkaç değişiklik yaparak Fıkralar sayfasını oluşturmuş olacağız.

Sayfamıza fıkraları ekleyip kaydediyoruz. Aynı yöntemle komik resimler sayfasını da oluşturdum. Bunun gibi komik haberler, komik olaylar gibi sayfalar oluşturarak da sitemi zenginleştirebiliriz. Şimdi sayfalarımızı birbirine bağlayalım. index.html yi açıp soldaki link menüsüne sayfa isimlerimizi yazıp link (bağlantı, köprü) ekleyelim. Hazırladığımız sitede üç tane sayfa var. Anasayfa, Fıkralar ve Komik Resimler. Bu üç sayfayı şablonun sol bölümündeki Menü yazısının hemen altına yazıyorum ve fazlalıkları siliyorum.

Sitemiz için menü oluşturduk. Şimdi bu menüye link ekleyelim. Yapmamız gerekenler sırasıyla:
1. Soldaki menüden link vermek istediğiniz sayfanın adına çift tıklıyoruz.
2. Klasör simgesine tıklıyoruz ve sayfalarımızın listesi açılıyor.
3. Açılan pencereden link vermek istediğiniz sayfayı seçiyoruz.
4. Ok'a basıyoruz ve çalışmanızı kaydediyoruz. Bu işlemi tekrarlayarak Fıkralar ve Resimler sayfaları için de link ekledim. Böylece Anasayfadan Fıkralar ve Komik Resimler sayfasına açılan bir kapımız oldu.

Yalnız Fıkralar veya Komik Resimler sayfasına giden bir ziyaretçinin tekrar anasayfaya dönmesi mümkün değil. Çünkü diğer sayfalarda link eklemedik. Aynı yöntemle diğer sayfalarda da link eklememiz gerekiyor. Daha kısa olan yöntem ise oluşturduğumuz menünün tamamını kopyalayıp diğer sayfalarda aynı bölüme yapıştırmak. index.html yi açalım ve menüdeki Anasayfa yazısı üzerine seri şekilde üç defa tıklayalım. Tüm yazılar seçili haldeyken fare ile üzerine sağ tıklayıp Copy seçeneğine tıklayalım. Şimdi Fıkralar sayfasını açıp sol bölümdeki Menu ve link yazılarını temizleyelim. Sağ tıklayarak Paste seçeneğine tıklayalım. Böylece daha önce index.html için oluşturduğumuz menüyü Fıkralar sayfasına kopyalamış olduk ve tek tek link eklememize gerek kalmadı. Aynı işlemi Komik Resimler sayfası için de tekrarlayarak sayfaların birbiri ile bağlantısını tamamlıyoruz ve sitemiz yayına hazır hale geliyor.

Dreamweaver bölümünün son sözleri:

Tabiki Dreamweaver'in yapabilecekleri bunlarla sınırlı değil. Programın içinde yüzlerce sayfalık yardım kitabı var ancak tamamına burada veya başka bir sitede değinilmesi mümkün değil. Zamanla programların yeteneklerini keşfederek veya kullanmayı bilenlerden yardım alarak seviyenizi ilerletebilir daha iyi siteler kurabilirsiniz. bedavasiteyapmak.com'u oluşturmak için bu bilgiler dışında sadece bir resim düzenleyici program ve bir flash programı kullanmak yeterli oldu.

Artık site açmak için yapmamız gereken tek şey sitemizi internetteki bir sunucuya (hosting hesabına) göndermek. Böylece siteniz ziyarete açılmış olacak. Sayfalarınızda yaptığınız değişikliklerin ziyaretçilere yansıması için değişiklik yaptığınız sayfayı tekrar sunucuya göndermeniz gerektiğini hatırlatırım. Şimdi bedava hosting veren firmalardan birine üye olalım ve sitemizi sunucuya yollayalım.. Bedava Hosting