Merhaba arkadaşlar ;

Websitenin tasarımına başlamadan arayüzüne kafamızda karar vermek enazından kağıda çizmek çok önemlidir. Tasarıma başlamadan kullanacabileceğiniz o kadar çok teknik ve program varki.

Mesela yukarıda sitenizin logosu,sloganı ve görsellerini tutan tanıtıcı bir flash tabanlı bannerınız var. Bu banner içinde de linkleriniz var,anasayfa,galeri,ürünler,iletişim gibi.. Bu linklere tıklandığında tüm bir sayfanın değil sadece alttaki kısımda linkle ilgili içeriğin gelmesini istiyorsunuz. Flash animasyonunuzun giriş animasyonu olduğunu düşünün ve her linke tıklandığında sayfa baştan yüklenirse o animasyonun baştan oynaması hoş olmaz. Bu sorunun birçok çözümü olabilir. Frame ile bir yapı oluşturabilirsiniz,veya master sayfalarında dwt şablon sayfalarından faydalanabilirsiniz ancak master ve dwt dosyaları flashı desteklemez,flash tekrardan yüklenir,frameset ile yaparsanız size frameset çok sayıda htm verecektir güncellemelerde zorluk olacaktır.
Profesyonel anlamda yukardaki flash banner içerisindeki linklere tıklandığında altta bir iframe penceresinde başka bir sayfayı açabiliyoruz ve bu çok ta zor değil. Altta göstermeye çalıştığım gibi bir iframe kodunu sayfamıza kopyalıyoruz.Kodu tarayıp sağ tıklayıp copy ile kopyalayıp editörünüze kopyalayabilirsiniz.



src="iletisim.htm" kısmında bu iframe içinde açılacak html dosyasının adı yer alır.

width=450 height=400 ile bu pencerenin büyüklüğünü belirtiriz.

scrolling="no" ile eğer açılacak sayfa pencereden büyükse bir scrollbar çıkarmamızı sağlar.

frameborder="0" ile iframe penceremizin köşelik kalınlığını belirtebiliriz.

id="main" ile de bu pencerenin link ile çağıralacak target adını belirtiriz.Bu çok önemli.


Mesela bu pencerede iletisim.htm dosyasını açmak istersek id="main"tanımlandığından flashta link verilirken :

şeklinde çağırabilinir.


İlla Flash içinden değil full html tasarımlarınızda da aynı mantıkla bir iframe açıp
ona id verip bu id adını verdiğiniz linklerin targetına yazarak o sayfada sadece
güncelleme yapılmasını sağlayabilirsiniz.

Microsoft özellikle efsanevi Frontpage ile iframe temellerini atıp ve Ajax ile Silverlight projelerinde iframe uygulamalarını çok kullanarak sektörde yaygınlaşmasını sağladı. Dreamweaver 8 versiyonun da
iframe eklecenk menümüz yokken CS3 ile layout kısmından en sağda iframe ekleyebileceğimiz panelimizde eklendi.

Ayrıca çağırdığınız websitesinin arkaplanı ile sizin çağırdığınız background ile uyuşumsuzluk
var ise çağırdığınız iframe penceresini transparanlığa izin verebiliyorsunuz,
böylelikle boş kısımlarda arkaplan olarak çağırılan sayfanın arkaplanı gözüküyor.

Bu özelliği denemek için iframe tanımlamalarınıza :

allowtransparency="true" ekleyin.

Ayrıca çağırdığınız htm dosyasının da head kısmına alttaki transparan background kullanımı
sağlayan CSS kodunu yazın.


< type="text/css">
Body { Background: transparent; }


Sadece Flash içerisinden değil html sayfalarında da iframe kullanabilirsiniz. Yukarıdaki örnekte sol üstteki iframe'e dışardan bu pencere içeriğinden büyük bir sayfa çağırılmış ve scrolling="yes" denerek scrollbar çıkmasına izin verilmiş.

I-frame'ler özellikle Microsoft'un da sıkça kullanmasıyla Adobe'yi de
Dreamweaver CS3 te iframe paneli eklemesini sağladı. Şuanda tüm browserlarda
sorunsuz bir şekilde çalışmaktadır. Gözüken o ki Ajax ve Silverlight
uygulamalarının da vazgeçilmezi iframe artık Dreamweavercılar tarafından da sevilecek.


Faydalı olması dileğiyle ...