Html Frame Çerçeve oluşturmak

Frame (Çerçeve) oluşturmak

Tablolar kadar önemli ve doğru olarak kullanılamadığı zaman bir web sayfasının görüntüsü adeta korkunçlaştıran çerçevelerin yapılması çok titizlik ister. Aslında basitmiş gibi görünse de, dikkat edilmezse gerçekten bir kabusa dönüşebilen bu uygulamayı basitinden karmaşığına doğru hazırlamaya başlayalım.

Çerçeve, uygulama olarak birden fazla web sayfasının tek bir sayfa içerisinde gösterilmesi şeklidir. Haliyle çerçeve sayısı arttıkça, kullanımı da zorlaşır. Bir deyişle, çerçeve kullanarak iki sayfayı bir sayfada ziyaretçilerinize sunmak istiyorsanız üç ayrı sayfa hazırlamak zorundasınız. Yani birinci sayfanız, ikinci sayfanız ve bu iki sayfası bir arada göstereceğiniz çerçeve sayfanız. Eğer çok sayfalı bir web sitesi hazırlamayı düşünüyorsanız çerçeve kullanmak işinizi hayli kolaylaştıracaktır. Zor olmasına karşın çerçeve kullanılan sayfalar web sitesine daha bir profesyonel görünüm verirler.
Hele bir de çerçeve sistemini iyi kurguladıysanız, ana sayfanızdan, ekleyeceğiniz diğer sayfalarınıza ulaşım sağlamanız oldukça kolaylaşacaktır.
Her çerçeve sayfasının, aynı web sayfasındaki diğer çerçeve sayfalarından farklı bir adı olması zorunludur. Bir çerçeveden diğerine html komuları yollamak ve orijinal web sayfasının düzenini bozmadan, o çerçevenin içeriğini dinamik olarak değiştirmek de olasıdır.

Basit bir çerçeve yapalım

Bir üst paragrafta da değindiğim gibi en basitinden bir çerçeve sayfası hazırlamak için üç adet sayfa hazırlamamız gerekiyor. Bu ilk örneğimizde ortadan dikey olarak ikiye bölünmüş bir çerçeve sayfası hazırlayacağız. Yani bu, içinde iki ayrı sayfa barındıran bir çerçeve sayfası olacak.
İlk yapmamız gereken sol yanda görüntülemeyi düşündüğümüz web sayfasını hazırlamak.
Aşağıdaki kodu Not Defterinize yazın ve sol.html adı vererek web klasörünüze kaydedin.

<html>
<head>
<title>Çerçeve Deneme</title>
</head>
<body bgcolor="C0C0C0" text="000000">

Bu sayfa sol tarafta görüntülenecek olan sayfadır 
</body>
</html>

çerçeve 1

Şimdi alttaki kodu Not Defterinize yazarak sag.html olarak yine web klasörünüze kaydedin.

<html>
<head>
<title>Çerçeve Deneme</title>
</head>
<body bgcolor="FFFF00" text="000000">

Bu sayfa sağ tarafta görüntülenecek olan sayfadır 
</body>
</html>

çerçeve 2

Şimdi elimizde yapısı hemen hemen aynı ama arka plan renkleri ve içindeki yazıları farklı sol.html ve sag.html adında iki web sayfamız var.
Gelelim bu iki sayfayı tek bir web sayfası içinde, yani tek bir web sayfasıymış gibi görüntülemeye.

Aşağıdaki kodu yazacağımız sayfamızı da çerçeve.html adı kaydederek, diğer iki sayfamızın bulunduğu web klasörümüzün içine atalım.

<head>
<title>Çerçeve Deneme</title>
</head>
<frameset cols=*,*>
<frame name=sol src=sol1.htm>
<frame name=sag src=sag.htm>
</frameset>
</html>

Şimdi kaydettiğimiz çerçeve.html sayfamıza tarayıcımızdan bakacak olursak, aşağıdaki gibi bir görünümle karşılaşmış olmalıyız.

çerçeve 3

Web sayfalarına çerçevelerin tanıtımı <frameset> takısıyla gerçekleştiriliyor.
Bu takının içine eklenecek parametler ise sayfa düzenin nasıl olacağını (yanyana sayfalar mı, alt alta sayfalar mı?) gösteriyor. Ardından <frame> takısı kullanılıyor ve bu takının parametreleri yardımı ile de çerçeve gurubunda hangi sayfaların kullanılacağı belirleniyor.

Hazırladığımız örnek çerçeve sayfasında, görüntülenecek sayfaların dikey bir bölünmeyle yanyana görüntülenmesini istediğimiz için <frameset> takısının içinde cols parametresini kullandık. Cols parametresine vereceğimiz bir takım değerlerle, sayfanın kaça bölüneceğini ve bu bölümlerin boyutlarının ne olacağını sağlayabiliriz.
Peki, bu örnek sayfalarımızı çerçeveli sayfamızda alt alta yani yatay bir düzeyde yerleştirmek isteseydik?

Çerçeveler Sayfa : 2