Fireworks Dersleri-6(Fireworks ve Dreamweaver İşbirliği)

Curse

Üye
Kayıt
30 Eylül 2007
Mesaj
315
Tepki
2
Fireworks Dersleri-6(Fireworks ve Dreamweaver İşbirliği)
Giriş yazımızda da biraz bahsetmiştik, Macromedia'nın tüm ürünleri birbirleriyle tam bir uyum içerisindedir. Fireworks'ta yaptığınız bir butonu, şekli, resmi Flash'ta kullanabilir, yine Fireworks'ta hazırladığınız web sayfalarını, butonları, menü çalışmalarını rahatlıkla Dreamweaver'de kullanabilirsiniz. Bunun için gerekli bütün kolaylıklar seferber edilmiş durumdadır. Öyleyse, haydi biz de Fireworks'ta hazırladığımız bir web sayfasını (PNG'yi) Dreamweaver'da düzenleyelim.

Bazı üyelerimiz, Fireworks'ta hazırladığımız PNG sayfalarını Dreamweaver'e nasıl aktaracaklarını soruyorlar. Bu dersi de bunun için kaleme alıyoruz.

ADIM 1:

Fireworks'ta PNG sayfamız hazır olsun. Mesela aşağıdaki gibi bir tasarım yaptık diyelim. (Bir önceki derste kullandığımız web sayfası)





Shot at 2007-07-16



ADIM 2:

Şimdi bu PNG sayfasını nasıl Dreamweaver'e aktaracağız? İlk önce sayfamızı dışarıya HTML (veya HTM) olarak ihraç etmemiz gerekiyor. PNG olarak Dreamweaver'de düzenleyemeyeceğimizi bilmelisiniz. Fireworks'da File>Export komutunu kullanacağız. Bu komutla birlikte karşımıza şu menü çıkacak:





Shot at 2007-07-16



Yukarda gördüğünüz ayarlarda olacak.

Bunları açıklaması ise şöyle:

Dosya adı: Bu kısımda düzenlemek istediğimiz bir isim veriyoruz.
Kayıt türü: HTML formatında olacak ve ayrıca resimler de kaydedilecek.
Slice: Export edilen resimler, slice'larla belirlenen şekilde olacak.
Include Areas without Slices: Slice'lar olmayan alanları da dahil et.
Put Images in Subfolder: Resimleri ayrı bir klasörde muhafaza et. Browse kısmından da resimler için yeni bir klasör belirleyebilir veya başka isimde bir klasör oluşturabiliriz.

Options bölümünden ise ufak tefek bazı değişikler yapılabilir. Export edilen resimlerin isim uzantıları, sayfanın uzantısı vs. gibi özelliklere buradan erişilebilir. Kaydedeceğimiz yeri belirleyip sayfamızı kaydediyoruz. PNG olarak hazırladığımız sayfamız şimdi index.html olarak kaydedilmiş oldu. Şimdi artık DW'de düzenlemeye geçebiliriz.

Şimdi Dreamweaver'i açalım... Dreamweaver'da File>Open komutuyla az evvel kaydettiğimiz sayfayı açalım.

Gördüğünüz gibi sayfamız tablolar içinde resimler olarak açıldı. Sanki resimleri Dreamweaver'de tablolar içine eklemiş gibi görünüyor. Yapmak istediğimiz düzenlemeleri burada gerçekleştirebiliriz.

Neleri Nasıl Düzenleyebiliriz?

Fireworks'da atadığınız linkler aynen geçerlidir. Link verdiğiniz Fireworks butonu halihazırda resim olmasına rağmen linki geçerlidir ve Properties bölümünden gerekli değişikliği yapabilirsiniz.

Bilinmesi gereken en önemli husus, Fireworks'da slice olarak belirlediğiniz her alan burada değiştirilmeye hazırdır.

Fireworks'da tayin ettiğiniz arka plan rengi Dreamweaver'de de aynen görünür.

Düzenlemek istediğimiz bir resim varsa, işaretliyor ve Properties bölümündeki Edit'e tıkladığımızda (ilk atanan editör Fireworks olduğu için) Firework açılacak ve gerekli değişikliği yapabileceksiniz. Resim Fireworks'da açıldığı zaman üstte şu görüntü belirecektir:




Shot at 2007-07-16

Gerekli düzenlemeyi yaptıktan sonra yukarıdaki şekilde Done diyoruz. Böylece PNG kapacak ve Dreamweaver gelecektir ekranlarınıza. Neticede gerekli değişikliklerin yapılmış olduğunu fark edeceksiniz.


Alintidir
 

Curse

Üye
Kayıt
30 Eylül 2007
Mesaj
315
Tepki
2
@satrol__
eee arkadaşım hep phostoshop mu:D birazda fireworks olsun değil mi:)
 
Kayıt
28 Ağustos 2007
Mesaj
623
Tepki
6
@Curse

e tabikide abi yaa bi tek ps kullanmıyo bi sürü program var tabi bütün programları öğrenmez güzel tabi bunlada derslerle öğreniliyo
 

Meman Çiçek

Altın Üye
Altın Üye
Kayıt
19 Ağustos 2007
Mesaj
1.588
Tepki
39
Teşekkürler curse dediğin gibi birazda fireworks olsun değil mi:}}
 

yengec

Üye
Kayıt
18 Aralık 2007
Mesaj
15
Tepki
0
Genel kanaat doğrultusunda katılıyorum bir parçada Firewoeks olmalı tşk ederim...
 

caRySma

Üye
Kayıt
27 Nisan 2008
Mesaj
4
Tepki
0
Bence fireworks webtasarımında çok önemli ps ile uzun zaman alıcak birçok şeyi logo banner vs. çok daha hızlı ve basit bir şekilde yapabiliyoruz bence 10 numara bi prog. Teşekkürler.
 
Yukarı Alt