Web tasarımında en çok kullanılan yazılımlar arasında Macromedia Dreamweaver da bulunur. Bu yazılımın deneme sürümünü buraya tıklayarak indirebilirsiniz. İlk bölümde, bu yazılımın menülerinden bahsetmiştik. İlk bölümü okumak için tıklayın.
Şimdi de panelleri inceliyoruz.
BÖLÜM 2
MX 2004’te Paneller ve Özellikleri
Properties Paneli
Dreaweaver’de yaptığımız bütün işlemlerin özelliklerini bu panel yardımı ile
ayarlayabilmekteyiz. Eğer nesnemiz bir resim ise alternatif metnini, köprüsünü,
hizalamasını, dış kenarlığını, resmin boyutlarını, parlaklığını, hotspotunu
bu panelden düzenleyebiliriz.
Eğer nesnemiz bir metin ise fontunu, puntosunu,
fontun rengini, köprüsünü, hizalamasını bu panel ile düzenleriz. Kısaca belgemize
eklediğimiz bütün nesnelerin özelliklerini bu panel ile düzenleyeceğiz.
Insert Paneli
Bu panelimizin içeriği de adı gibi Insert menüsüyle aynıdır. Tabloları, katmanları,
Flash butonları, resimleri, form nesnelerini vb. nesneleri bu menüden ekleyebiliriz.
Macromedia bu paneli iki stilde tasarlamış. İlki, web sayfalarında gördüğümüz
drop-down menü stilinde, ikincisi ise bir araç çubuğu stilinde. Bu işlem için
Insert yazısının üzerine sağ tıklayın ve Show as Tabs komutunu tıklayın.
Bu
işlemden sonra Insert panelimiz tek satır halinde bütün nesneleri gösterecektir.
Eğer varsayılan stile geri dönmek istiyorsanız tekrar Insert panelinde sağ tıklayıp
Show as Menu komutunu tıklamanız yeterli olacaktır.
Bu panelde göze çarpan asıl özellik ise istediğiniz nesneleri seçerek bu paneli
kişiselleştirebilmenizdir. Bu işlem için panelin üzerinde sağ tıklayalım. İkinci
adımda ise Customize Favorites komutunu çalıştıralım.
Çıkan pencereden sık kullandığınız
komutları sağ tarafa ekleyin ve OK butonuna basın. Belirlediğiniz komutların
simgelerinin bu panelde Favorites başlığı altında toplandığını göreceksiniz.
Design Paneli
CSS Styles
Sayfalarımızda kullanacağımız CSS belgelerini bu panel yardımıyla tasarlayacağız.
Yeni stil tasarlamak, var olan bir stili belgemize çağırmak, var olan bir stil
üzerinde değişiklik yapmak gibi işlemleri CSS Styles panelinde yapacağız.
Layers
Belgemizde yer alan bütün katmanları bu panel üzerinde görebiliriz. Ayrıca
belgemizde birden fazla katman kullandıysak ve bu katmanların bir biri üzerine
gelmesini istemiyorsak bu panelden Prevent Overlaps sekmesini tıklamalıyız.
Code Paneli
Snippets
Dreamweaver’ın sağladığı kolaylıklardan biri de Snippets paneli. Hazır kod
arayanlar için tasarlanmış bu panelin içeriğinde Javascript kodları, navigasyon
çubuğu örnekleri, browser scritlerini ve hazır form elemenların bulabilirsiniz.
Yapmanı gereken tek şey istediğiniz kodu seçip çift tıklamak ve Snippets metin
alanından kopyalayıp scripti belgenize eklemek.
Refference
Bu panelde ise PHP, SQL, ASP.NET, HTML, JAVASCRIPT gibi programlama dillerinin
kullanım kılavuzu var. Bu dillerdeki komutların, fonksiyonların nasıl kullanıldığı
anlatılmış.
Application Paneli
Databases
Adından da anlaşılacağız gibi veritabanı ile ilgili işlemleri Application panelinden
yöneteceğiz. Databases bölümünde ise veritabanı bağlantıları için Connection
tanımlayacağız.
Tabi öncelikle bir sanal site tanımlamamız gerekecek. Veritabanı
uygulamaları bölümünde (BÖLÜM 4) bu işlemleri ayrıntılarıyla ele alacağız..
Bindings
Veritabanımız için kayıt setlerini (Recordset), değişkenleri (Session Variable,
Application Variable, Request Variable) ve veritabanımızın SQL ile işlenmesini
(Command) bu panelden yöneteceğiz.
Server Behaviors
Hiç bir programlama bilgisine sahip olmadan bu panel yardımıyla üyelik sistemleri,
veritabanına kayıt girişi, kayıt silme, bilgi güncelleme gibi işlemleri yürütebilirsiniz.
İleriki uygulamalarımızda da bu paneli sık sık ziyaret edeceğiz.
Components
Bu panelde ise ASP.NET C#, ASP.NET VB, Macromedia ColdFusion MX, JSP gibi diller
için Web Servisi bulunmaktadır.
Tag Inspector
Attributes
Bu tarz bir paneli Visual Basic 6’dan hatırlayacaksınız. Değişkenleri girerek
nesnelerinizi böyle bir menü yardımıyla işleyebiliyordunuz. Dreamweaver’de ise
bu panel yardımıyla nesnelerinizin özelliklerini düzenleyebiliyorsunuz.
Eğer
nesne bir resimse alternatif metnini, boyutları, kaynağını, nesne Flash filmi
ise boyutlarını, eğer bir stil dosyası atayacaksanız atama işlemini vb. gibi
işlemleri bu panel yardımıyla yapabilirsiniz.
Behaviors
İşte Dreamweaver’in harikalar yarattığı panele geldik. Hiç bir programlama
bilgisine sahip olmadan, drop-down menüleri swap imageları, tarayıcı işlemlerini,
tarayıcı mesajlarını, ses dosyası çalıştırmayı, katman animasyonlarını bu panelden
yöneteceğiz.
Sizinde en sık kullanacağız panelin bu olacağını görür gibiyim.
Relevant CSS
Revelant CSS paneli de işlevsel olarak Attributes paneli ile aynı mantıkta
çalışıyor. Fakat bu panel Attributes‘ten farklı olarak sadece CSS Stil Dosyaları’nın
özelliklerini değiştirebiliyor.
Eğer bir CSS dosyanız varsa Design panelinden
seçin, Revelant CSS‘nin etkinleştiğini göreceksiniz. Stiller konusunu uygulamalarımıza
daha geniş ele alacağız.
Files Paneli
Files
Daha önceden tanımlamış olduğumuz sanal sitemizi yöneteceğimiz panel ise Files
Paneli. Bu panel yardımıyla yeni bir sanal site tanımlayabileceğimiz gibi tanımlanmış
bir siteyi de yönetebiliriz.
Dallanmış görünüm sayesinde sitenizdeki dosyaların
tümüne bu panelden erişebilirsiniz. Sanal site tanımlamayı ve yönetmeyi Uygulamalar
bölümümüzde ele alacağız..
Assets
Belgelerinizin içindeki sık kullandığınız nesnelerinizi aynı Internet Explorer’daki
gibi Favorites bölümüne gönderebilirsiniz. Bu işlem için Dreamweaver’de Assets
panelini kullanacağız.
Eğer nesnelerinizden birini bu panele göndermek istiyorsanız,
nesnenin üzerinde sağ tıklayın ve (resim dosyası için geçerli) Add to Image
Favorites komutunu tıklayın.
Örneğin aynı yöntemle bir metin için Favorites
Color belirlediniz. Bu rengi tek tıklamayla herhangi bir metin içinde kullanabilirsiniz.
Bunun için ilgili metni seçelim. Assets paneline gelelim ve Colors butonunu
tıklayalım.
Son olarak Favorites‘e eklemiş olduğumuz rengin üzerinde sağ tıklayıp
Apply diyelim. Favorite Color‘ın seçili metne uygulandığını göreceksiniz.
Bölüm 3, çok yakında ShiftDelete.Net’te
SDN
{{user}} {{datetime}}
{{text}}