iFrames etiketine sahip kayıtlar gösteriliyor.
iFrames etiketine sahip kayıtlar gösteriliyor.

HTML Çerçeveler (Frames) ve iFrames

HTML Dersleri
HTML Çerçeveler (Frames) ve iFrames


Frame, HTML'de birden fazla belgeye tek bir sayfada görüntüleme için açılan iç pencerelerdir. 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. Klasik yapıda Menü öğelerinin bulunduğu bir pencere ve sayfa içeriğinin bulunduğu bir pencere olarak düşünebilirsiniz. Arama Motoru optimizasyonu için olumsuz etkileri olduğu için genellikle kullanılmaz. Çerçeveler sayesinde aynı tarayıcı penceresinde birden fazla HTML dökümanı görüntüleyebilirsiniz.

Özetle Frames kullanımı, sayfamızı parçalara ayırmamızı sağlar. Böylece sayfanın bir tarafı sabit kalırken, diğer tarafını, kullanıcının isteğine göre değiştirme imkanı verir. Bunun anlamı ise kullanılacak çerçeve miktarınca ek Html sayfası oluşturmak demektir.

Avantajlarının yanı sıra Web geliştiricilerin birden fazla HTML dökümanını takip etmesinin zorluğu ve istenilen sayfanın yazıcıya gönderilmesindeki problemler gibi dezavantajlarıda mevcuttur.

Framaset Etiketleri ve Kullanımı
Çerçeve oluşturmada kullanılan etiket framesettir. cols parametresi açılacak çerçevelerin yan yana sütunlar şeklinde olacağını, rows parametresi ise çerçevelerin alt alta satırlar şeklinde görüntüleneceğini belirtmekte kullanılır. Yani  <frameset> pencerenin hangi biçimde çerçevelere ayrılacağını belirlerken her frameset satır rows veya sütun cols olarak belirlenir.  

Frame Etiketi: <frame> etiketi, her bir çerçevede hangi HTML dökümanının görüntüleneceğini belirtir.
<frameset cols="35%,65%">
   <frame src="frameA.html">
   <frame src="frameB.html">
</frameset>

Örneğimizde 2 sütun çerçeveli bir döküman bulunmaktadır. İlk çerçeve için tarayıcı penceresinin genişliğinin %35'i ayrılmıştır. İkincisine ise %65'i ayrılmıştır. "frameA.html" birinci sütuna, "frameB.html" ise ikinci sütuna yerleştirilmiştir. Frameset sütun değerlerimizi yüzdelik dilimler yerine piksel olarakta belirleyebiliriz. Örneğin: (cols="300,400") verebilir ve geri kalanının da kendi kendini 100 değerine tamamlamasını sağlayabiliriz: (cols="35%,*").

NOT: Frameset etiketi html dosyasının </head>…<body> etiketleri arasında kullanılmaktadır. <body></body> etiketlerini <frameset></frameset> etiketleri ile beraber kullanamazsınız!

Örneğimizde sayfa iki sütuna ayrımıştır. Eğer sayfa iki satıra ayrılmak istenseydi, yukarıdaki <frameset cols="*,*"> etiketi, <frameset rows="*,*">şeklinde yazılmalıydı. Eğer sayfayı üç sütuna ayırmak isteseydik bu seferde <frameset cols="*,*,*"> şeklinde yazılmalıydı.