27 Nisan 2017 Perşembe

3. TABLOLAR

   3.1. Tablolar İle Çalışmak

     Tablolar, web sayfalarını satırlara/sütunlara bölmek amacıyla ya da resimlerin veya grafiklerin sayfada sabit bir noktada durması amacıyla kullanabileceğimiz en önemli araçlardan biridir. Kısacası sayfa içindeki elemanların yerleşimi konusunda söz sahibi olmamızın en kolay yoludur.

     Tablolar satır (row) ve sütunlardan (column) oluşmaktadır. Satır ve sütunların kesiştiği nokta ise hücre (cell) olarak adlandırılmıştır.

     Tablo eklemek için Ekle menüsünden Tablo seçeneği seçilir. Açılan pencereden gerekli düzenlemeler yapılır.

Şekil 3.1: Tablo ekleme

   Şekil 3.1.’de görülen tablo özeliklerinin açıklaması aşağıdaki gibidir.

Satırlar: Tablonun kaç satırdan oluşacağını belirleriz. 
Sütunlar: Tablomuzun kaç sütundan oluşacağını belirleriz. 
Tablo genişliği: Tablonun boyutunu pixel ya da yüzde cinsinden belirleriz. 
Kenarlık kalınlığı: Tablonun kenar çizgisinin kalınlığı belirlenir. 
Hücre dolgusu: Hücrelerin boyutu belirlenir. 
Hücre boşluğu: Hücrelerin birbirinden ve tablo kenarlığından uzaklığı belirlenir.
Üstbilgi: Tablo başlığının nerede olacağı seçilir. 
Resim yazısı: Tabloya başlık bilgisi eklenir.
Özet: Tablo içeriği hakkında açıklama yazsısı eklenir

   Şekil 3.1’de görülen özellikleri uyguladığımız zaman aşağıdaki Şekil 3.2’deki gibi bir tablo oluşmaktadır. Tablonun içine veri girişi yapmak için ilgili hücrenin içine bir defa tıklandıktan sonra metin yazılır. 

Şekil 3.2: Tablo genişliği kılavuzu

   Tablo genişlikleri kılavuzunun tablonun etrafında görünmesi için, tablo seçildikten sonra sağ tıklayarak Tablo seçeneğinden Tablo genişliği özelliği seçilmelidir.

   3.2. Tablosal Veriler 

   Farklı bir programda hazırlanmış olan metin ya da tabloları Web tasarım editöründe düzenlediğimiz sayfalar içine aktarabiliriz. Bu işlem için dikkat edilecek en önemli şart, aktarılacak dosya içindeki verilerin belirli bir ayırıcı (sekme, virgül) ile ayrılmış olmasıdır.
 
   Harici dosyada bulunan verileri tablo şeklinde sayfamıza eklemek için Ekle menüsünden Tablo Nesneleri seçeneğindeki Sekmeli Verileri İçe Aktar seçilmelidir. Karşımıza Sekmeli Verileri İçe Aktar penceresi çıkar.

   Sekmeli Verileri İçe Aktar penceresinde bulunan Veri dosyası seçeneği ile web sayfamızın içine aktaracağımız tablo verilerinin olduğu dosya belirtilmelidir. Göz at seçeneğini tıklayarak dosyamızı seçebiliriz.

   Sınırlayıcı listesinden aktarımı yapılacak dosya içinde kullanılan ayırıcı türü seçilir.

   Tablo genişliği seçenekleri ile oluşturulacak tablonun genişliğinin otomatik olarak (verilere sığdır) ayarlanması ya da kullanıcı tarafından (Buna ayarla) girilmesi gerekir.

Hücre dolgusu ile hücrelerin genişliği ayarlanır.
Hücre boşluğu ile hücrelerin birbirinden ve tablo kenarlığından uzaklığı belirlenir.
En üst satırı formatla seçeneği ile en üst satırın kalın ya da italik olmasını sağlarız.
Kenarlık ile de tablonun kenar çizgisinin kalınlığı belirlenir.

   Web tasarım editöründe hazırladığımız tabloları dışa aktarmak için ise tablomuzu seçtikten sonra Dosya menüsünden Dışa aktar seçeneği seçilir. Karşımıza aşağıdaki gibi bir pencere gelecektir

   Bu pencerede sınırlayıcı seçeneği ile ayırıcı seçilir. Satır kesmeleri ile de kullanılan işletim sistemi seçilir ve Dışa Aktar düğmesi tıklanır. Yeni açılan pencerede dosyanın nereye ve hangi isimle kaydedileceği belirlendikten sonra kaydet düğmesine tıklanır.

   3.3. Sayfa Düzeninde Tablo Kullanımı 

     Sayfamızın daha düzenli ve kullanışlı olması için sayfa düzeninde tablolarla çalışmak gerekmektedir.

   3.3.1. Tablo Hücrelerini Seçme ve Kopyalama / Taşıma

     Tablolar ile ilgili yapacağımız tüm işlemlerde tablonun seçili olması gerekmektedir.

     Tablonun tümünü seçmek için fare, tablonun dışında herhangi bir noktadayken farenin sol tuşuna basılı tutularak tabloya doğru hareket ettirdiğimizde tüm tablonun seçildiğini göreceksiniz.

     Hücreyi seçmek için ise, ilgili hücrenin içine gelinir. Farenin sol tuşuna basılı tutularak seçilmek istenen yöne doğru sürüklenir.

     Tablonun belirli bölümündeki hücreleri seçmek için shift tuşu basılı tutularak seçilecek grubun başlangıç ve bitiş hücreleri tıklanır.

    Tablo içinde birbirinden farklı yerde olan hücreleri tek tek seçmek için Control tuşu kullanılır. Bunun için Control tuşu basılı tutularak, seçilecek hücrelerin üzerine fare ile tıklamak yeterlidir.

    Kopyalama işlemi yapmak için, yukarıda anlatılan seçim işlemleriyle ilgili hücreler seçildikten sonra Düzen menüsünden kopyala seçeneği seçilmelidir. Bu işlemle kopyalanacak hücreler belleğe alınır. Fare ile kopyalama yapacağımız yere gelinir. Düzen menüsünden Yapıştır seçeneği tıklanır. Seçmiş olduğumuz hücrelerin imlecin bulunduğu yere kopyalandığını göreceksiniz.

    Taşıma işlemi yapmak için ise Hücreler seçildikten sonra Düzen menüsünde bulunan Kes seçeneği tıklanır. Fare taşıma işleminin yapılacağı yere getirilir. Dosya menüsünden Yapıştır seçeneği tıklanır. Seçili olan hücreler imlecimizin bulunduğu noktaya taşınır.

    3.3.2. Tablo Hücrelerini Biçimlendirme 

     Seçilen hücreleri biçimlendirmek için Özellikler penceresinden faydalanılır.

     Seçili hücrelerin metin biçimlendirmesi (Hizalama, kalın, italik yapma) aşağıdaki düğmeler yardımıyla yapılır.

   
Şekil 3.3: Tablo hücrelerinin biçimlendirilmesi

   Hücre özellikleri yukarıdaki panel yardımıyla yapılır. Bu paneldeki araçların işlevlerini şöyle sıralayabiliriz.

Hücreleri birleştir: Seçili olan birden fazla hücrenin birleştirilip tek hücre halini almasını sağlar. Hücreleri böl: Seçili olan hücrenin birden fazla satıra ya da sütuna bölünmesini sağlar.
Yatay/ Dikey: Seçili hücrenin yatay ve dikey hizalanmasını ayarlar.
Gen/ Yük: Seçili hücrenin genişlik ve yükseklik boyutunu ayarlar.
Sarma yok: Hücre içindeki metinlerin tek satıra yerleşmesini sağlar.
Üst bilgi: Seçili olan hücrenin tablo üst bilgisi olarak ayarlanmasını sağlar.
Bg: Seçili olan hücreye arka plan rengi atar.

   3.3.3. Tabloda Değişiklik Yapma

      Sayfamızdaki tabloda bulanan satır ve sütunlar üzerinde değişiklik yapabiliriz. Tablo içinde bulunan hücreleri birleştirebilir ya da hücreleri satır/sütunlara bölebiliriz. Bunun için Özellikler penceresinde bulunan düğmelerden faydalanabiliriz.

      Hücreleri birleştirmek için ilgili hücreler seçildikten sonra Özellikler penceresinde bulunan Hücreleri böl düğmesine tıklanmalıdır.

Şekil 3.4: Hücreleri birleştirme

     Hücreyi satır/ sütuna bölmek için ilgili hücre seçildikten sonra Özellikler penceresinde bulunan Hücreleri böl düğmesine tıklanmalıdır. Karşımıza Hücreyi böl penceresi gelecektir.

     Bu pencerede ilgili düzenlemeyi yaptığımızda hücremizin satır veya sütunlara bölündüğünü göreceksiniz.

     Tabloda hücreleri birleştirip satır/sütunlara bölebildiğimiz gibi tablomuza yeni satır ya da sütun da ekleyebiliriz. Bu işlemi yapmanın birden fazla yolu vardır. Bunlar:  
  • Ekle menüsündeki Tablo nesneleri seçeneğinin altında bulunan özeliklerle satır/sütun ekleyebiliriz. 
  • Tablomuzun içinde değişiklik yapacağımız yerde fare ile sağ tıklayarak açılan menüde Tablo seçeneğinin altında bulunan özeliklerle satır/sütun ekleyebiliriz. 

   Aynı zamanda bu menüden satır ya da sütun silme işlemini de gerçekleştirebiliriz. 

   Mizanpaj menü grubu altında bulunan düğmeler yardımıyla satır/sütun ekleme işlemini gerçekleştirebiliriz.

   3.3.4. Tablolarda Resim Kullanma

   Sayfamıza resim eklerken tablolardan faydalandığımız zaman birden fazla resmi birleştirebiliriz ya da resmin konumunu istediğimiz şekilde düzenleyebiliriz.
   Tablomuza resim eklemeden önce kullanacağımız tabloyu resim eklenecek şekilde düzenlemek tasarımı kolaylaştıracaktır.
   Tablo içerisine resim eklemek için Ortak menü grubu içindeki Görüntüler açılır menüsünün altında bulunan görüntü seçeneği tıklanmalıdır. Açılan pencereden tabloya eklenecek resim seçilerek tamam düğmesi tıklanmalıdır.

   Resim, oluşturduğumuz site klasörünün içinde kayıtlı değilse resim klasörün içine kaydedilsin mi diye uyarı gelecektir. Buna izin vermemiz gerekir.

   3.3.5. Tabloları İç İçe Yerleştirme 

   Tabloları iç içe yerleştirme işlemi çok karışık tablolarda kullanılmaktadır.

   İçeride oluşturacağımız tabloyu imleç var olan tablonun içindeyken yapabileceğimiz gibi tabloyu dışarıda oluşturup daha sonra diğer tablonun içine de aktarabiliriz. Tabloyu dışarıda oluşturmak tasarım için daha kullanışlıdır.

   Küçük tablo, ana tablonun dışında hazırlandıktan sonra fare ile seçilerek ilgili noktaya sürüklenerek taşınmalıdır. Aynı işlem kes/kopyala yöntemiyle de yapılabilir.


   3.4. Expanded Modu

     Sayfamıza eklediğimiz tablolar üzerinde daha kolay işlem yapmak için Expanded görünüm modunda çalışmalıyız. Bu görünüm modunda tablomuz genişletilmiş halde görünecektir. Bu sayede küçük tablolarda bile işlem yapmak çok daha kolay olacaktır.

     Expanded görünüm moduna geçiş yapmak için mizanpaj menüsü altında bulunan genişletilmiş seçeneğine tıklamamız yeterlidir.

     Tablo içindeki gerekli düzenlemeleri yaptıktan sonra standart görünüm moduna geçerek tasarımımıza devam edebiliriz.

Hiç yorum yok:

Yorum Gönder

1. TEMEL İŞLEMLER

     Bu bölümde web tasarımı editörünün ara yüzünü inceleyerek site tanımlama işlemlerini öğreneceğiz.  1.1. Çalışma Alanı       Bilgisaya...