Frame Kullanmak

Frame, HTML'de birden fazla belgeye tek bir sayfada yer vermek amacıyla açılan pencereler. Bu şekilde sağda farklı bir pencere ve içerik, solda farklı bir pencere ve içerik olacaktır. Genellikle bir pencere linklerin bulunduğu alan, diğer pencere ise asıl içeriğin bulunacağı alan olarak kullanılır. Arama Motoru optimizasyonu için olumsuz etkileri olduğu için genellikle kullanılmaz. Biz yine de en önemli kısımlarıyla ele alalım:

Pencereleri bölmeye <frameset> koduyla başlarız. Dikkat etmemiz gereken <body></body> arasında yazılamaması gerektiğidir. Bu kısım frame tekniği desteklemeyen tarayıcılar için <noframes></noframes> arasında kullanılacaktır.

HTML Kodu

   <frameset cols="25%,75%">
      <frame src="frame_a.htm">
      <frame src="frame_b.htm">
   </frameset>
Burada cols="deger1,deger2" şeklinde bir kullanım dikkatinizi çekmiştir. Burada belirteceğimiz değerler pencere sütunlarının oranlarını belirtmektedir. yatay pencereler kullanacaksak bu kez rows="deger1,deger2" şeklinde kullanmalıyız.

Bahsi geçen değerler yüzde (%) olarak ifade edilebileceği gibi piksel olarak da yazılabilir. Eğer bir pencerenin boyutu, diğeri için belirtilen dışındaki alan olacaksa (*) kullanırız. Bir örnek: cols="200,*" yazarsak. İlk pencere (frame_a.htm) 200 piksel genişliğinde olacaktır, diğer pencere ise (frame_b.htm) geriye kalan tüm alanı kaplayacaktır.

Son olarak şunu ekleyelim, değerler pencere sayısı kadar yazılacaktır. Eğer 3 pencere kullansaydık. Bu kez 3 pencere için sırasıyla ayarlama yapacaktık: cols="200,25%,*" gibi.

HTML Kodu

   <frameset cols="25%,25%,*">
      <noframes>
         <body>Eger tarayıcı frame desteklemiyorsa...</body>
      </noframes>
      <frame src ="venus.htm" />
      <frame src ="mars.htm" />
      <frame src ="jupiter.htm" />
   </frameset>
Frame Desteklemeyen Tarayıcılar - noframes

Bunun için frameset açılış ve kapanış etiketleri arasında <noframes>(tarayıcınız frame desteklemiyor mesajı)</noframes> şeklinde bir bölüm koyuyoruz. Burası html sayfamızın devamıymış gibi <body></body> tagları arasına almalıyız.

Yatay ve Dikey Pencereleri Bir Arada Kullanmak

Bunun için frame içinde frame kullanmalıyız. Üst tarafta yatay bir pencere ve hemen altında sağ ve sol olarak ikiye bölünmüş bir pencere örneği verecek olursak:

HTML Kodu

   <frameset rows="50%,50%">
   <frame src="frame_a.htm">
      <frameset cols="25%,75%">
         <frame src="frame_b.htm">
         <frame src="frame_c.htm">
      </frameset>
   </frameset>
Frame Kenarlığı ve Pencere Boyutlarını Sabitleme

Frameleri birbirinden ayıran çizgiyi yok etmek için <frame src="#"> koduna frameborder="0" özelliği eklememiz yeterlidir.

Pencere boyutları sizin belirttiğiniz gibi başlangıçta çalışmakta fakat kullanıcı tarafından değiştirilebilmektedir. Bunu engellemek için <frame src="#"> koduna noresize="noresize" özelliği eklememiz yeterlidir.

IFRAME Kullanmak

Bunun yukarıda anlatılandan farklı yanı normal bir HTML belgesinde farklı bir sayfa ya da site için pencere açmanıza yaramaktadır. Pencere içerisinde boyutu belirttiğiniz boyutlarda olmak üzere belirttiğiniz site görünecektir:

HTML Kodu

<iframe src="http://html.sitesi.web.tr/" width="100%" frameborder="0" scrolling="yes"></iframe>

HTML Görünümü

Yukarıda görüldüğü gibi http://kod.anime.web.tr/google.htm adresini sayfamızda kullandık. iframe kodu içerisinde geçen:

frameborder="0" - Kenarlık kullanılmayacağını belirtir.
width="184" - 184 piksel genişlikte olacağını belirtir.
height="94" - 94 piksel yükseklikte olacağını belirtir.
scrolling="no" - Kaydırma çubuğunu gösterme demek.