Bu derste frameset ve frame’ler oluşturacak, bunların özelliklerini değiştirecek, frame’leri yeniden boyutlandıracak ve bunların içeriğini kontrol etmek için bağlantıları kullanacaksınız.
Frame
Oluşturmak
Standart bir HTML sayfası, tarayıcı penceresinin tamamını kaplayan tek bir bölgeden oluşur. Frame’ler tarayıcı penceresini iki ya da daha fazla panele böler. Panellerin her birinde bağımsız bir HTML içeriği yer alır. Bu bağımsız bölgelerin her biri, kendilerini içeren büyük tarayıcı penceresinin bir alt kümesidir. Frame’ler, sayfaların gezinti ve içerik alanlarını tanımlamak için sıkça kullanılır. Genellikle gezinti alanı sabit kalır, içerik alanı ise bir gezinti bağlantısına her tıklandığında değişir. Frame’lerin bu şekilde kullanımı, sitede dolaşan ziyaretçiler açısından çok faydalı olabilir. Frame’lerin kullanılması sitede değişiklik yapılmasını da kolaylaştırabilir, çünkü güncellenecek sadece tek bir gezinti sayfası vardır. Diğer yandan, başarısız bir şekilde uygulanmış olan frame’ler Web sitesinin kalitesini düşürebilir. Net bir site yapısı oluşturmuyorlarsa ziyaretçilerin kafasını karıştırabilir ve onları yanlış yönlendirebilirler, ziyaretçilerin daha önceki bir sayfaya tekrar gitmelerini ya da sık kullanılanlara ekleme işlemini zorlaştırabilirler ya da
10
A-PDF Split DEMO : Purchase from www.A-PDF.com to remove the watermark
uygun şekilde boyutlandırılmamış ve biçimlendirilmemişlerse içeriğin görüntülenmesini zorlaştırabilirler.
Bir ziyaretçi iki frame’le oluşturulmuş bir Web sayfasını görüntülediğinde, aslında tarayıcı bu sayfayı görüntülemek için üç ayrı dosya kullanır: frameset dosyası ve iki frame’in her birinde görünen içeriği taşıyan iki dosya. Frameset, ziyaretçi tarafından görülmeyen ve bir Web sayfasının yapısını frame’lerle tanımlayan bir HTML dosyasıdır.
Bir frameset, frame’lerin her birinin içeriğini sağlayan dosyaların isimleriyle birlikte her bir frame’in büyüklüğü ve konumu hakkındaki bilgileri de saklar. Her bir frame ayrı bir HTML dosyasıdır. Frame’lerin kenarlıklarını kaldırdığınızda ziyaretçiler bunların frame olduğunu kolayca anlayamaz. Ya da kenarlıkları görüntüleyerek pencereyi açık bir şekilde farklı panellere bölebilirsiniz. Diğer seçeneklerin arasında, kaydırma çubukları ve ziyaretçilere kenarlıkları sürükleyerek frame’leri yeniden boyutlandırma imkânını sağlamak da sayılabilir.
Bu derste frame’lerle çalışarak, bir gezinti alanının ve bir de içerik alanının yer aldığı bir Web sayfası oluşturacaksınız. Ziyaretçi gezinti frame’indeki bir bağlantıyı seçtiğinde hepsi içerik frame’inde belirecek olan bir dizi sayfa oluşturacak ve bağlantıları farklı frame’lere gidecek şekilde nasıl atayacağınızı öğreneceksiniz. Bu derste ayrıca, frame’leri desteklemeyen tarayıcılarda görüntülenecek olan içerikleri nasıl ekleyeceğinizi de öğreneceksiniz.
Bu derste elde edilen sonucu görmek isterseniz, Lesson_10_Frames/Completed/
Community klasöründeki community.html dosyasını açın.
Neler Öğreneceksiniz?
Bu derste şunları öğreneceksiniz:
• Bir frameset oluşturacaksınız.
• Bir frameset’i kaydedeceksiniz.
• Frame’ler ve yuvalanmış frame’ler oluşturacaksınız.
• Frame’leri yeniden boyutlandıracaksınız.
• Frameset ve frame özelliklerini değiştireceksiniz.
• Frame’lerin içinde belgeler oluşturacaksınız.
• Frame içeriğini yönlendireceksiniz.
• NoFrames içeriği oluşturacaksınız.
Yaklaşık Süre
Bu dersin tamamlanması yaklaşık 1 saat sürecektir.
Ders Dosyaları
Ortam Dosyaları:
Lesson_10_Frames/Images/…(bütün dosyalar) Başlangıç Dosyaları:
Lesson_10_Frames/Text/…(bütün dosyalar) Lesson_10_Frames/Community/sidebar.html Lesson_10_Frames/Community/ys_nav.html Lesson_10_Frames/sangha.css
Tamamlanmış Proje:
Lesson_10_Frames/Completed/Community/AboutGreen.html Lesson_10_Frames/Completed/Community/BeginningGreen.html Lesson_10_Frames/Completed/Community/community.html Lesson_10_Frames/Completed/Community/community_intro.html Lesson_10_Frames/Completed/Community/sidebar.html
Lesson_10_Frames/Completed/Community/top.html Lesson_10_Frames/Completed/Community/ys_nav.html
Bir Frameset Oluşturmak
Bir frameset, frame’lerin kullanıldığı bir sayfanın genel görünümünü tanımlar (sayfadaki frame alanlarının sayısı, frame’lerin her birinin büyüklüğü ve kenarlık nitelikleri).
Frameset’in kendisinde herhangi bir içerik bulunmaz; frameset sadece her bir frame’de hangi HTML belgesinin kullanılacağını belirtir. Frameset belgesi, frame tabanlı bir Web sayfasını çağırırken bağlantı kurduğunuz dosyadır. Bu derste, üç frame’den meydana gelen bir Web sayfası oluşturacaksınız. Soldaki frame’de sabit kalan gezinti elemanları yer alacak, sağdakinde gezinti frame’inde tıklanan bağlantılarla ilgili içeriklerin bulunduğu sayfalar görüntülenecek, üstteki frame’de ise sitenin başlığı yer alacaktır.
Macromedia Dreamweaver’da bir frameset oluşturmanın iki yolu vardır: Frame’leri elle ekleyebilir ya da önceden tanımlanmış çeşitli frameset’ler arasından seçim yapabilirsiniz.
Önceden tanımlanmış bir frameset’i seçtiğiniz takdirde, frameset ve frame’ler sizin için otomatik olarak ayarlanır. Bu seçenek, frame’leri kullanarak bir yerleşim düzeni oluşturmak için en hızlı yollardan biridir, çünkü işin büyük kısmını siz yapmazsınız.
Sadece sayfaları adlandırmanız gerekir.
Bu uygulamada, frame kullanan bir Web sayfası oluşturmak için önceden tanımlanmış bir frameset’ten faydalanacaksınız.
1. File > New komutunu seçin. New Document iletişim kutusunun General bölümündeki Category listesinden Framesets’i seçin.
New Document iletişim kutusunun Framesets bölümüne, başlangıç sayfasındaki “Create from Samples” listesinde yer alan Framesets seçeneğine tıklayarak da erişebilirsiniz.
New Document iletişim kutusu, yeni bir frameset oluştururken kullanabileceğiniz önceden tanımlanmış çeşitli seçenekler içerir. Framesets listesine baktığınızda, sağdaki önizleme alanında bir açıklamayla (Description) birlikte temel frame yapısını gösteren örnekleri görebilirsiniz.
Standart bir HTML belgesinden bir frameset oluşturmak için
kullanabileceğiniz bir yöntem daha vardır: Insert araç çubuğunda Layout menüsüne geçtikten sonra Frames menüsünden önceden tanımlanmış bir frameset seçebilirsiniz.
2. Framesets listesinden Fixed Right, Nested Top’u seçin ve Create düğmesine tıklayın.
Bir frameset ya satırlardan ya da sütunlardan oluşabilir, ama her ikisinden birden
oluşamaz. Seçtiğiniz gibi birden fazla satır ve sütun içeren bir yerleşim düzeni oluşturmak için frameset’ler iç içe yerleştirilebilir.
Insert araç çubuğunun Layout kategorisindeki Frames menüsü
3. Frame Tag Accessibility Attributes iletişim kutusunda Frame menüsünü kullanarak frame’leri seçin ve Title metin alanını kullanarak başlıkları aşağıda belirtilen şekilde ayarlayın:
rightFrame’e ait başlığı Right Navigation topFrame’e ait başlığı Title and Navigation mainframe’e ait başlığı Main Content
Frame Tag Accessibility Attributes iletişim kutusu açılmazsa, Frame’lerin erişilebilirlik özelliğini Dreamweaver > Preferences (Macintosh’ta) ya da Edit >
Preferences (Windows’ta) komutunu seçip Category listesinden Accessibility’yi işaretleyerek etkinleştirebilirsiniz. Bu işlemi yaptıktan sonra Show attributes when inserting alanında Frames seçeneğinin işaretli olduğundan emin olun.
Frame Tag Accessibility Attributes iletişim kutusu, her frame için uygun bir başlık seçmenizi sağlar.
Başlık (Title) özelliği, her frame’in içeriği için bir bağlam oluşturur, böylece kullanıcılar aradıkları bilginin hangi frame’de olduğunu belirleyebilir. Frame başlığı, title niteliğiyle tanımlanır. Bu niteliğe, frame’leri Frame Tag Accessibility Attributes iletişim kutusunun yardımıyla kullanarak oluştururken kolayca erişebilirsiniz. Bununla birlikte, daha sonra da bir frame’i seçip Tag panelinin Attributes sekmesindeki CSS/Accessibility alanı aracılığıyla title niteliğinde değişiklik yaparak mevcut bir frame başlığını düzenlemeniz ya da bir frame başlığı uygulamanız mümkündür.
title (başlık) niteliği name (isim) niteliğinin yerine kullanılamaz. title niteliği frame’i kullanıcılar için, name niteliği ise script ve pencere hedefleme için etiketler. Kullanıcılar sadece başlığı (title) görür. Frame isimlerini bu derste daha sonra göreceğiz.
Erişilebilirlik ve Frame’ler
Frame kullanmanın dezavantajları arasında tam erişilebilirliğin sağlanamaması ve ekran okuyucularda ve PDA ya da cep telefonu gibi mobil cihazlarda sayfaların kullanılamamasını sayabiliriz. Web tarayıcısındaki Back (Geri) düğmesinin çalışmaması, yazdırmayla, devamlılığı sağlamayla ilgili sorunlar ve kullanım zorluğu da diğer sorunlardan bazılarıdır.
Frame’ler sayfayı görsel olarak farklı bölmeler içinde düzenlemek için kullanılır. Görsel öğeleri kullanamayan ziyaretçiler için frame’lerdeki içeriklerin arasındaki ilişkilerin görsel olmayan bir şekilde iletilmesi gerekir. Bu yüzden Dreamweaver’ın frame oluştururken sizden istediği erişilebilirlik özelliklerini kullanmak, daha erişilebilir belgeler oluşturmak için önemli bir adımdır.
Erişilebilirlik niteliklerini uyguladıktan sonra frameset’in belge penceresinde belirdiğini göreceksiniz. Frameset’te sayfa kenarlarının etrafında noktalı bir kenarlık bulunur ve çizgiler frame yapısını gösterir.
Frame yapısını gösteren çizgiler Frameset kenarlığı
Sayfa, iki frameset kullanılarak üç frame’e bölünmüş durumdadır. Frameset’ler sadece yatay veya sadece düşey frame’ler içerebilirler (aynı anda hem düşey, hem de yatay frame’ler içeremezler). Düşey ve yatay frame kombinasyonları elde etmek için frameset’lerin birbirlerinin içine yerleştirilmeleri yani yuvalanmaları gerekir. Daha eski bir frameset tarafından tanımlanmış bir frame’in içinde yer alan frameset, “yuvalanmış bir frameset” (nested frameset) olarak adlandırılır. Belgenizin başlangıçtaki frameset’i iki düşey frame (biri solda, diğeri de sağda) içermektedir. Soldaki frame, iki yatay frame’e bölünmüş bir yuvalanmış frameset içermektedir (üstte kısa bir frame ve altta daha uzun bir frame). Dreamweaver’ın önceden tanımlanmış bazı frameset’leri, yuvalanmış (iç içe yerleştirilmiş) frameset’ler kullanır. İstediğiniz frame yerleşim düzenini elde etmek için, önceden tanımlanmış bu frameset’lerden oluşan kombinasyonlar kullanabilirsiniz. İnce gri çizgiler, frame’ler arasındaki bölümleri gösterir.
Frame’leri elle girmek için, yeni bir HTML belgesi açın ve View > Visual Aids >
Frame Borders komutunu seçerek belge penceresinin sayfa kenarlarının etrafında noktalı bir frame kenarlığının görüntülenmesini sağlayın. Kenarlığa tıklayın ve belge penceresine sürükleyin. Kenarlığı en üstünden ya da en altından tutup sürüklerseniz belge yatay olarak, kenarlığı sol ya da sağ
tarafından tutup sürüklerseniz düşey olarak bölünecektir. Kenarlığı köşesinden tutup sürüklerseniz, belge dört frame’e bölünür. Aynı işlemi Modify > Frameset
> Split Frame Left, Right, Up ya da Down komutlarını seçerek de yapabilirsiniz.
Yanlış frame konfigürasyonunu seçtiyseniz ya da frameset’inizdeki frame sayısını azaltmanız gerekiyorsa, istemediğiniz frame’lerin kenarlığını sayfanın kenarına ya da başka bir frame’in üzerine sürükleyerek bunları silebilirsiniz. Siz bu işlemi yaptıktan sonra fazla frame’ler kaybolacaktır.
Bu dosyayı bir sonraki uygulamada kullanmak üzere açık bırakın.
Bir Frameset’i Kaydetmek
İstediğiniz sayıda frame’i elde etikten sonra frameset’i kaydetmeniz gerekir. frameset dosyası, bu Web sayfasına bağlanırken göndermede bulunduğunuz dosyadır. Sayfayı Web tarayıcısında önizleyebilmeniz için, frameset’in ve her bir frame’e ait dosyaların kaydedilmesi gerekir. Kaydetmeden önce sayfayı tarayıcıda önizleme girişiminde
bulunursanız, Dreamweaver önizleme için frameset’in ve frame dosyalarının kaydedilmesi gerektiğini belirten bir mesaj görüntüler. Her bir dosyayı tek tek kaydedebileceğiniz gibi, bütün açık dosyaları tek bir seferde de kaydedebilirsiniz. Bu uygulamada, sadece frameset’i kaydedeceksiniz.
1. Belge penceresinde, Etiket Seçici’ye bakarak frameset’in seçili olduğundan emin olun. Burada <frameset> etiketinin vurgulu olarak görünmesi gerekir.
Bir frameset oluşturduğunuzda, bu frameset otomatik olarak seçili hale gelir. Belge penceresinde herhangi bir yere tıkladığınızda frameset’in seçimi kaldırılır, çünkü bu durumda bir frame’in içine tıklamış olursunuz. Bir frame’in içine tıklamak bir tablo hücresinin içine tıklamaya benzer. Ekleme noktasını bir hücrenin içine yerleştirdiğinizde ilgili hücre etkin hale gelir, ama tablonun tamamının seçili olduğu durumda
düzenleyebileceğiniz özelliklere erişemezsiniz. Benzer şekilde, bir frameset’te değişiklik yapmak için frameset’in kendisini seçmeniz gerekir.
Frameset seçili durumda değilse, belge penceresinin kenarlarının etrafındaki kenarlığa tıklayarak bunu seçebilirsiniz. Frameset’i, Window > Frames komutunu seçtikten sonra Frames panelindeki frame’leri çevreleyen en dış kenarlığa tıklayarak da seçebilirsiniz.
Frames paneli, belgedeki frame yapısının basit bir versiyonunu gösterir.
Belge penceresinde frameset seçili durumda
Frameset’in noktalı kenarlığı Etiket Seçici, frameset’in
seçildiğini gösteriyor
Frames panelinde seçili durumdaki frameset’in düz kenarlığı
Frameset seçili durumdayken, belge penceresinin etrafında noktalı bir çizgi belirir ve pencerenin en alt kısmında yer alan Etiket Seçici’de <frameset> etiketi görünür. Belgenin başlık çubuğunda “UntitledFrameset-1” ifadesi görünür, Properties denetçisinde
de frameset özellikleri görüntülenir. Başlıksız belgenizin numarası (-1, -2, vb.),
Dreamweaver’ı açtıktan sonra kaç tane yeni belge oluşturduğunuza bağlı olarak değişebilir.
Frameset seçili değilse, bunun yerine tek bir frame seçili durumdadır ve belge penceresinin etrafındaki frame kenarlığı düz siyah bir çizgi olarak görünür. Yuvalanmış bir frameset seçili durumdaysa, bunun bulunduğu frame’in kenarlığı noktalı bir çizgiyle çevrilir.
Frames panelinde, seçili bir frameset panelin etrafında kalın bir kenarlıkla gösterilir ve frame’ler gri renkli, seçilemez durumdaki bir kenarlıkla görüntülenir.
2. File > Save Frameset As komutunu seçin ve dosyayı Lesson_10_Frames/
Community klasörüne community.html adıyla kaydedin.
Belgenin başlık çubuğunda dosyanın adı görüntülenecektir.
3. Frameset seçili durumdayken, sayfa başlığını Yoga Sangha: Community olarak ayarlayın. Frameset’i kaydedin.
Siz sayfa başlığını yazarken frameset seçili durumda değilse, asıl frameset dosyasına değil, tek bir frame’e karşılık gelen bir sayfaya başlık atıyor olabilirsiniz. Neyin seçili durumda olduğunu anlamak için Frames paneline bakın. Bu panel, frame’in içinde mi, yoksa düzenlemek istediğiniz frameset’in içinde mi çalışıyor olduğunuzu anlamanıza yardımcı olacaktır.
Bir sonraki uygulamada kullanmak üzere community.html dosyasını açık bırakın.
Bir Frameset’te Bulunan Frame’leri Yeniden Boyutlandırmak
Frame’lerinizin büyüklüğünü belirlemek için Properties denetçisini kullanabilir ya da aynı işlemi belge penceresindeki kenarlıkları sürükleyerek yapabilirsiniz. Properties denetçisinde boyutları ayarlamaya ek olarak, bütün frame’lerin tam büyüklükte gösterilmesi için yeterli yerin olmadığı durumlarda Web tarayıcılarının frame’lere nasıl yer ayıracağını belirlemek de mümkündür.
1. Belge penceresinde, imleci üst ve alt frame’lerin arasındaki yatay kenarlığın üzerine getirerek yuvalanmış durumdaki frameset’in seçili durumda olduğunu doğrulayın. İmleç çift uçlu bir oka dönüştüğünde kenarlığa bir kez tıklayarak frameset’i seçin.
Yuvalanmış frameset seçili hale gelecek ve Properties denetçisinde frameset özellikleri görüntülenecektir. Properties denetçisindeki seçenekler, bir frameset’i ya da frame’i seçmenize bağlı olarak değişir. Frame’lerin büyüklüklerini değiştirmek için, frameset’i seçtiğinizden emin olmanız gerekir.
Frameset özellikleri görünmüyorsa, Properties denetçisindeki genişletme okuna tıklayarak bunların hepsini görüntüleyebilirsiniz.
Ana frameset’in yatay kenarlığı
Çift uçlu ok
Properties denetçisinde yuvalanmış frameset’e
ait frameset özellikleri görüntüleniyor Üstteki satır seçili durumda
Satır değeri birim menüsü (Row Units) Satır değeri
(Row Value)
RowCol Selection
Genişletme oku
2. Üstteki ve alttaki frame’lerin arasında yer alan kenarlığı, üstteki frame’in yüksekliği 112 piksel oluncaya kadar sürükleyin.
Properties denetçisindeki Row Value alanını kullanarak yükseklik değerini kontrol edin ya da RowCol Selection alanında üst satır seçili durumdayken Row Value metin alanına 112 değerini girip yüksekliği tam olarak ayarlayın. Units menüsünde Pixels’in seçili durumda olduğundan emin olun. RowCol Selection alanındaki üst satır, etkin durumda olduğunu gösterecek şekilde koyu renkte görünecektir.
3. Frameset seçili durumdayken, Properties denetçisinde yer alan RowCol Selection alanındaki alt satıra tıklayarak yuvalanmış frameset’teki alt satırı seçin. Row Value metin alanının yanındaki Units menüsünde Relative’in seçili durumda olduğundan emin olun.
Bir satırı ya da sütunu seçmek için Properties denetçisindeki RowCol Selection alanını kullandığınızda, frameset’in içinde ilgili satırı ya da sütunu seçmiş olursunuz. Bu da, frameset’in özelliklerini bu satır ya da sütuna uygulanırken değiştirmenize imkân sağlar.
Burada bir frame seçmiş olmazsınız.
Alt satırın birim (Units) seçeneğini Relative olarak ayarlamanız, alt satırın, ziyaretçinin Web tarayıcısının büyüklüğüne ve üstteki satıra atamış olduğunuz 112 piksellik yer ayrıldıktan sonra ne kadar yer kaldığına bağlı olarak genişlemesini ya da daralmasını sağlar. Varsayılan durumda Dreamweaver, Relative olarak tanımlanan satırların Row Value metin alanına otomatik olarak 1 değerini yerleştirir.
Frameset’in büyüklüğüyle ilgili HTML kodunu görüntülerseniz, frameset rows=”112,*” ifadesini görürsünüz. Row Value metin alanındaki 1 değeri ve Units menüsünde Relative’in seçilmesi, kodda yıldız (*) karakteri
kullanılmasıyla aynı anlama gelir. Bu karakter; frameset’teki diğer satırlara göre orantılı ya da göreceli bir büyüklüğü temsil eder.
4. Frames panelinde, frameset’i üzerine tıklayarak tümüyle seçin. Frame’in Properties denetçisindeki görsel temsili olan RowCol Selection alanında solda yer alan sütuna tıklayarak soldaki yuvalanmış frame sütununu seçin.
Frames panelinde yuvalanmış frameset seçili durumda
Belgenizde, dıştaki frameset sütunlardan, yuvalanmış frameset ise satırlardan oluşmaktadır.
Properties denetçisinde solda yer alan sütunun rengi kararacaktır. Bu, onun seçildiğini gösterir.
5. Properties denetçisindeki Column Value metin alanına 484 yazın ve Return (Macintosh’ta) ya da Enter (Windows’ta) tuşuna basın. Units menüsünde Pixels’in seçili durumda olduğundan emin olun.
Soldaki sütunun genişliği 484 piksel olarak ayarlanacaktır.
Sütunun büyüklüğünü nasıl ayarlayacağınıza karar verirken aşağıdaki ölçüm birimlerini göz önünde bulundurun.
• Pixels (Piksel): Bu seçenek, seçili sütun ya da satırın mutlak büyüklüğünü girdiğiniz piksel sayısına ayarlar. Belirli bir büyüklüğe sahip olması gereken frame’ler için en iyi seçenek budur. Eğer diğer sütunlar ya da satırlar farklı bir birimle tanımlanırsa, bu sütun ya da satırlara ancak Pixels olarak ayarlanmış satırlar ya da sütunlar tam boyutlarında görüntülendikten sonra yer ayrılır.
• Percent (Yüzde): Bu seçenek, geçerli sütunun ya da satırın kendi frameset’inde
kaplayacağı alanı yüzde olarak belirtir. Units menüsünde Percent seçeneğiyle tanımlanan sütun ya da satırlara, Pixels olarak tanımlanmış olan sütun ya da satırlardan sonra ve Relative olarak tanımlanan sütun ya da satırlardan da önce yer ayrılır.
• Relative (Göreceli): Bu seçenek, geçerli sütun ya da satıra diğer sütun ve satırlara göre geçerli orantılar kullanılarak yer ayrılacağını belirtir. Birimleri Relative olarak ayarlanmış sütun ya da satırlara, Pixels ve Percent olarak ayarlanmış sütun ya da satırlardan sonra yer ayrılır, ama bunlar kalan boşluğun tamamını kaplar. Alttaki ya da sağdaki frame’i Relative olarak ayarlarsanız, frame’in büyüklüğü tarayıcı penceresinin kalan genişliğinin ya da yüksekliğinin tamamını kaplayacak şekilde değişir.
6. Properties denetçisinde, RowCol Selection alanında sağda yer alan sütuna tıklayarak yuvalanmış frameset’in sağ sütununu seçin. Column Value metin alanının yanındaki Units menüsünde Relative’in seçili olduğundan emin olun.
Bu işlemler, sağdaki sütunun, ziyaretçinin tarayıcısının büyüklüğüne ve soldaki sütuna atanmış olan 484 piksellik yer ayrıldıktan sonra ne kadar boşluk kaldığına bağlı olarak genişlemesini ya da daralmasını sağlar.
Sütun değeri birim menüsü (Column Units) Sütun değeri
(Column Value)
Soldaki sütun seçili durumda
7. File > Save Frameset komutunu seçerek frameset’i kaydedin.
Bu komut kullanılabilir durumda değilse, önce üstteki ve alttaki frame’lerin arasındaki kenarlığa tıklayarak dıştaki frameset’i seçin.
Frameset seçili durumdaysa, Cmd+S (Macintosh’ta) ya da Ctrl+S (Windows’ta) tuşuna bastığınızda sadece frameset kaydedilir.
community.html dosyasını bir sonraki uygulamada kullanmak üzere açık bırakın.
Frame Özelliklerini Ayarlamak
Bir frameset oluştururken frame’lerin her birini adlandırma alışkanlığını edinin. Bir frame’e atadığınız isim, o frame’e karşılık gelen belgenin dosya adı ya da başlığı veya frame’in kendi başlığı değildir. frame’in ismini, belgenin frame’li alanını tanımlamak için referans olarak kullanabilirsiniz ve bu yaklaşım genelde script’ler için kullanılır. Frame’leri adlandırmanız, frame’li bir alandaki sayfaları görüntülemek üzere bağlantı oluşturduğunuz durumlarda önemlidir. Frame’leri adlandırmak erişilebilirlik açısından da önemlidir, özellikle de frame başlığı sayfayı görüntülemek için kullanılan teknoloji tarafından desteklenmiyorsa.
Bir önceki uygulamada, önceden tanımlanmış frameset’leri kullanmıştınız. Frame’lerin her birine önceden varsayılan bir isim verilmişti. Bu uygulamada bu isimleri, frame’lerin kullanım amaçlarını yansıtacak şekilde değiştireceksiniz.
1. Frames panelinde sol üstte yer alan frame’e tıklayarak sol üst frame’i seçin.
Frames paneli açık değilse, Window > Frames komutunu seçin.
Frames panelinde sol üstte yer alan frame’in seçilmesi, belge penceresine tıklayarak ekleme noktasını sol üstteki frame’e yerleştirmekle aynı şey değildir. Bir frame’i seçtiğinizde, bu frame’e ait özellikler Properties denetçisinde kullanılır hale gelir. Belge penceresindeki frame’in içine tıkladığınızda, ilgili frame’in bulunduğu belgeye ait standart metin özellikleri görüntülenir. Ekleme noktası sol üstteki frame’deyse, bu frame etkin durumdadır, ama frame özelliklerinde değişiklik yapamazsınız. Frame’in kendisine ait özelliklerin değiştirilebilmesi için bu frame’in seçili olması gerekir.
Sol üstte yer alan frame’i, Shift+Option tuşlarını (Macintosh’ta) ya da Alt tuşunu (Windows’ta) basılı tutup belge penceresinde üzerine tıklayarak seçmeniz de mümkündür.
Frames panelinde sol üstteki frame seçili durumda
Frames panelinde, sol üstteki frame’in etrafında ince, siyah renkli bir kenarlık, ortada da “topFrame” ismi görüntülenecektir. Properties denetçisinde topFrame adlı frame’e ait özelliklerin görüntülendiğinde dikkat edin.
2. Properties denetçisindeki Frame name metin alanına, varsayılan isim olan topFrame’in yerine titleNav yazın. Yaptığınız değişikliği uygulamak için, Return (Macintosh’ta) ya da Enter (Windows’ta) tuşuna basın.
Frames panelinde, sol üstteki frame’de “titleNav” sözcüğü görünecektir. Belirli bir frame’in ismini öğrenmek için istediğiniz zaman Frames paneline başvurabilirsiniz. Frame isimleri genellikle bağlantıları belirli frame’lere yüklemek üzere yönlendirmek amacıyla kullanılır.
Bağlantıların hedef ayarını Ders 3’te öğrenmiştiniz
Frame’leri adlandırırken boşluk, tire, nokta ya da özel karakterler kullanmayın ve frame ismini alt çizgiyle başlatmayın. Bu karakterlerin herhangi birini kullandığınızda kod ya da script’lerle ilgili sorun çıkabilir.
Ayrıca çoğu kod dili BÜYÜK/küçük harf yazımına duyarlıdır. Bu yüzden frame isimlerinizde tutarlılığı koruduğunuzdan emin olun.
3. Properties denetçisindeki Scroll menüsünde No seçeneğinin işaretli olduğundan ve No resize kutusunun da işaretli olduğundan emin olun.
Kaydırma çubuklarının ne zaman görüneceğini belirleyen Scroll seçeneği, hem düşey, hem de yatay kaydırma çubuklarına uygulanır. Auto ayarı, kaydırma çubuklarını frame’de sayfanın içeriğinin görüntülenmesi için yeterince yer kalmadığı durumlarda görüntüler.
Default, tarayıcının varsayılan ayarıdır (bu ayar genellikle Auto’dur). Bu seçeneği ayarlarken dikkatli olun. Eğer No olarak ayarlanmışsa ve frame içeriğin tamamını görüntüleyecek kadar büyük değilse ziyaretçi kaydırma çubuklarını kullanarak içeriğin geri kalanını görüntüleyemez; Yes olarak ayarlanmışsa ve içerik frame’in içine sığıyorsa, kaydırma mümkün olmasa bile gri renkte ve seçilemez durumda olan kaydırma çubukları sayfada yer kaplamaya devam eder.
No resize seçeneği, tarayıcıda görüntülenen frame’in büyüklüğünün değiştirilmesini engeller. Bu seçeneğin işareti kaldırılırsa, ziyaretçiler tarayıcı pencerelerinde
Scroll menüsü Ziyaretçilerin frame’i yeniden boyutlandırmasını sağlayan seçenek
Properties denetçisindeki Frame name metin alanı
frame kenarlıklarını tutup sürükleyebilirler. Bu seçenek, işaretli olsa da olmasa da, Dreamweaver’da frame’leri yeniden boyutlandırmanızı engellemez.
Web sitenizi ziyaret eden kişilerin monitörlerinin büyüklüklerinin ve çözünürlük ayarlarının çeşitlilik gösterdiğini unutmayın. Frame’ler söz konusu olduğunda, siteleri büyük ve yüksek çözünürlüklü ekranlarda tasarlarken daha küçük ekranları da dikkate almak çok önemlidir.
Frame tabanlı sayfalar kullanılırken, bunlar tasarlandıkları ekranlardan daha büyük ya da daha küçük ekranlarda görüntülendiğinde sorunlarla karşılaşılabilir. Örneğin daha küçük ekranlar, sayfalarınızın çok fazla kaydırma işlemi gerektirmek gibi sorunlar yaratmasına neden olabilir; bu da ziyaretçilerin işini çok zorlaştırabilir. Sayfalarınızı çeşitli ortamlarda test ederek, bunların farklı büyüklükteki ve çözünürlükteki ekranlara uyum sağlayacağından emin olabilirsiniz. Büyüklükle ilgili böyle sorunların yazdırma konusunda da sorunlara yol açabileceğini unutmayın. Sitenizde frame’ler kullanıyorsanız, yazıcı dostu sayfalar gibi alternatifler sunmayı düşünebilirsiniz.
Yazıcı dostu sayfalar 530 piksel genişliğindedir (yazdırılabilir genişlik) ve bu sayfalarda minimum sayıda resim kullanılır. Böyle sayfalarda gezinti öğeleri de (örneğin sayfanın alt kısmındaki metin bağlantıları) minimum sayıda olmalıdır. Beyaz arka plan rengi ve siyah metinlerin kullanılması, beyaz kâğıt üzerinde okunabilirlik açısından en iyi seçimdir. Serif fontlar da özellikle yazdırılmak üzere hazırlanan sayfalar için iyi bir seçimdir. Metinlerinizi kolayca okunabilecek bir büyüklüğe (örneğin 12 punto ya da daha büyük olacak şekilde) ayarlayın.
4. Sol alt kısımdaki frame’i seçin ve bunu content olarak adlandırın. Scroll seçeneği Auto olarak ayarlanmalı ve No resize kutusu da işaretli olmalıdır.
Properties denetçisinde Borders menüsünde Default ayarının seçili olduğuna dikkat edin.
Sayfanın yerleşim düzenini oluşturmak için kullandığınız önceden tanımlanmış frameset’ler, frame’lerin kenarlıkları olmayacak şekilde otomatik olarak ayarlanmıştır. Belirli bir frame için Borders seçeneği Default olarak ayarlandığında, bu frame ebeveyn frameset’in ayarını kullanır. Eğer başka bir ayar (Yes ya da No) seçilirse, frame’de ebeveyn frameset’in ayarını dikkate alınmaz.
Frames panelinde, sol alt frame’de “content” ismi görünecektir.
Frames panelinde frame’ler için ayarladığınız isimler görüntülenir.
5. Sağdaki kısımdaki frame’i seçin ve bunu moreContent olarak adlandırın. Scroll seçeneği No olarak ayarlanmalı ve No resize kutusu işaretli olmalıdır.
Properties denetçisinde Margin width (kenar boşluğu genişliği) ve Margin height (kenar boşluğu yüksekliği) metin alanlarının boş olduğuna dikkat edin. Bu, sayfanızın yerleşim düzenini oluşturmak için kullandığınız, önceden tanımlanmış frameset’lerin varsayılan ayarıdır. Margin width, frame’in sol ve sağ tarafındaki kenar boşluklarını piksel kullanarak ayarlar. Margin height ise frame’in üst ve alt kısmındaki kenar boşluklarını piksel kullanarak ayarlar. Bu seçenekleri boş olarak bıraktığınızda tarayıcının varsayılan ayarı kullanılır; bu da tarayıcının sürümüne ve tipine bağlı olarak farklılık gösterebilir.
Frames panelinde, sağ frame’de “moreContent” ismi görünecektir.
6. File > Save Frameset komutunu seçin.
Frame özelliklerini değiştirdiğinizde, aslında community.html frameset’ini değiştirmiş olursunuz. Frameset’te hem frame, hem de frameset özellikleri tanımlanır.
community.html dosyasını bir sonraki uygulamada kullanmak üzere açık bırakın.
Frame İçeriğini Oluşturmak ve Düzenlemek
Bir frame’in içeriğinin frameset’te değil, ayrı bir HTML sayfasında bulunduğunu unutmayın.
Frame sayfalarını ayrı olarak ya da bir frame’in sınırları içinde oluşturabilirsiniz. Her bir frame’de yer alacak olan sayfaları tasarlamak için frameset’lerden faydalanmak her zaman için iyi bir fikirdir. Böylece frame için çok geniş ya da çok dar olan bir sayfa oluşturmamış olursunuz. İçeriğin tamamını görmek için sayfaları birden fazla yönde kaydırmak zorunda kalan ziyaretçilerin işi bir hayli zor olacaktır.
Bu uygulamada, frameset’teki sayfaların her birine içerik ekleyeceksiniz.
1. Ekleme noktasını belge penceresinde başlık (title) frame’ine (üstteki frame) yerleştirin.
Belge başlık çubuğu (Macintosh’ta) ya da Dreamweaver programının başlık çubuğu (Windows’ta), bunun başlıksız bir belge olduğunu gösterecek şekilde değişecektir.
2. File > Save Frame komutunu seçin. Dosyayı Lesson_10_Frames/Community klasörüne top.html adıyla kaydedin ve başlığını Yoga Sangha: Title yapın.
Lesson_10_Frames klasöründeki sangha.css stil sayfasını ekleyin.
Belge başlık çubuğu (Macintosh’ta) ya da Dreamweaver programının başlık çubuğu
(Windows’ta) bu frame’deki belgenin başlığını ve dosya adını gösterecek şekilde değişecektir.
Sitenin ziyaretçileri muhtemelen bu sayfanın başlığını göremeyecektir, çünkü Web tarayıcısı, tarayıcı penceresinde frameset’in başlığını kullanır. Yine de, her zaman belgelere başlık atamak iyi bir alışkanlıktır. Böylece sayfa herhangi bir sebeple bir pencerede kendi başına açılırsa başlıksız kalmamış olur.
3. Lesson_10_Frames/Images klasöründeki ys_header.jpg resmini title frame‘ine ekleyin ve Alt metin alanına Yoga Sangha yazın. Frame’i kaydedin.
Sayfalarınızı düzenlerken, bunları sık sık kaydetmeyi ihmal etmeyin. Save klavye kısayolunu, yani Cmd+S (Macintosh’ta) ya da Ctrl+S (Windows’ta) kullandığınızda, sadece (eğer seçiliyse) geçerli durumda seçili frame’e ya da frameset’e karşılık gelen dosyayı kaydetmiş olursunuz. Save komutu belgelerin her birini kaydetmez; bunları ayrı ayrı kaydetmeniz ya da File > Save All komutunu kullanmanız gerekir.
Başka bir frame’de görüntülenen dosyayı kaydetmek istiyorsanız, belge penceresinde bu frame’in içine tıklayın, sonra da Save düğmesine tıklayın. Kaydetme işlemini yaparken, hangi frame’in seçili olduğunu anlamak için Frames paneline bakabilirsiniz. Frames panelinde, ekleme noktasının bulunduğu frame’in ismi hariç, bütün frame’ler soluk gri renkle görüntülenir.
4. Ekleme noktasını content frame’ine (sol alt kısımdaki frame) yerleştirin. Dosyayı community_intro.html adıyla Lesson_10_Frames/Community klasörüne kaydedin ve buna Yoga Sangha Community: Introduction to Green Yoga başlığını atayın.
Lesson_10_Frames klasöründeki sangha.css stil sayfasını ekleyin.
Belgenin başlık çubuğu (Macintosh’ta) ya da Dreamweaver programının başlık çubuğu (Windows’ta), bu frame’deki belgenin başlığını ve dosya adını gösterecek şekilde değişecektir.
5. Lesson_10_Frames/Community/ys_nav.html dosyasını açın, araç çubuğunu kopyalayın ve content sayfasına yapıştırın.
Ana gezinti araç çubuğu içerik (content) sayfalarında bulunacaktır, dolayısıyla bu frame’deki bütün sayfalara dahil edilecektir.
6. Return (Macintosh’ta) ya da Enter (Windows’ta) tuşuna basarak araç çubuğunun altında yeni bir paragraf oluşturun. Lesson_10_Frames/Text/green_page1.txt dosyasını açın, metni kopyalayın ve sayfaya yapıştırın. Green Yoga at Yoga Sangha metnini bir paragraf olarak değiştirin ve Properties denetçisindeki Style menüsünü kullanarak tagline-style stilini uygulayın. Sayfayı kaydedin.
Bu sayfa, bu derste daha sonra navigation frame’inde oluşturacağınız Community bağlantısına karşılık gelen içerik sayfasıdır.
İçerik (content) frame’iniz burada yer alan örnekteki gibi görünecektir.
Frame tabanlı sayfalarda, ziyaretçilerin sayfaları dolaşırken görsel bir geribildirim almalarını sağlamak için, gezinti çubuğu (navigation bar) adında etkileşimli bir eleman kullanabilirsiniz. Gezinti çubuğunu kendiniz
oluşturabilirsiniz, bununla birlikte Dreamweaver’da bunu oluşturmak için kullanabileceğiniz bir araç da mevcuttur. Gezinti çubuğu, çeşitli sayfalara bağlı olan bir dizi resimden oluşur. Gezinti çubukları JavaScript kullanır (bu konu Ders 8’de ele alınmıştır). Bu da her bir resim için kullanıcı etkileşimine göre dört durum eklemenize imkân sağlar. Bir resmin ilk durumu sayfa yüklenirken, ikinci durum da ziyaretçi fare imlecini resmin üzerine getirdiğinde ortaya çıkar.
Ziyaretçi resme tıkladığında üçüncü durum gösterilir, dördüncü durum ise resme tıklandıktan sonra ziyaretçi fare imlecini resmin üzerine getirdiğinde kullanılır. Gezinti çubuğu, ziyaretçilerin gerçekleştirdikleri eylemlere cevap verilmesi konusunda etkilidir. Böylece ziyaretçileriniz, gezinti resimleriyle gösterilen duruma göre hangi sayfalara baktığını kolayca anlayabilir.
Diğer İçerik Belgelerini Oluşturmak
Şimdi de content frame’inde görüntülenecek olan diğer belgeleri oluşturmanız gerekiyor.
1. New Document iletişim kutusunun Basic Page kategorisini kullanarak yeni bir HTML belgesi oluşturun. Dosyayı AboutGreen.html adıyla Lesson_10_Frames/
Community klasörüne kaydedin ve buna Yoga Sangha: Community: About Green başlığını verin. Lesson_10_Frames klasöründeki sangha.css stil sayfasını ekleyin.
Belgenin başlık çubuğu, belgenin başlığını ve dosya adını yansıtacak şekilde değişecektir.
2. Lesson_10_Frames/ys_nav.html dosyasını açın, araç çubuğunu kopyalayın ve AboutGreen.html sayfasına yapıştırın.
Ana gezinti araç çubuğu her bir içerik (content) sayfasında bulunacaktır.
3. Return (Macintosh’ta) ya da Enter (Windows’ta) tuşuna basarak araç
çubuğunun altında yeni bir paragraf oluşturun. Lesson_10_Frames/Text/green_
page2.txt dosyasını açın, metni kopyalayın ve sayfaya yapıştırın. About Green Yoga metnini bir paragraf olarak değiştirin ve Properties denetçisindeki Style menüsünü kullanarak tagline-style stilini uygulayın.
Bu sayfa, About Green bağlantısına karşılık gelecek olan içerik sayfasıdır. Bu derste daha sonra rightNav frame’inden bu sayfaya giden bir bağlantı oluşturacaksınız.
4. 1’den 3’e kadar olan adımları tekrar ederek Lesson_10_Frames/Community klasöründe BeginningGreen.html adında bir dosya oluşturun. Bu dosyaya green_page3.txt dosyasındaki metni ekleyerek Yoga Sangha: Community:
Beginning Green Yoga başlığını atayın.
Bu sayfa, bu derste daha sonra rightNav frame’inde oluşturacağınız Begin bağlantısına karşılık gelen içerik sayfasıdır.
AboutGreen.html ve BeginningGreen.html dosyalarını kapatabilirsiniz. Bir sonraki uygulamada kullanmak üzere community.html dosyasını açık bırakın.
Mevcut Bir Sayfayı Bir Frame’de Açmak
moreContent frame’inin içeriği daha önceden sizin yerinize oluşturulmuştur. Bu sayfayı frame’e atamak istiyoruz. Ayrıca daha önce birkaç tane içerik sayfası oluşturmaya
başlamıştınız. Bu yüzden, şimdi bunların content frame’ine sığacaklarından emin olmanız gerekiyor. Kontrol etmek ya da düzenlemek üzere, bu dosyaları doğrudan frame’de açabilirsiniz.
1. community.html dosyasının belge penceresinde moreContent frame’inin içine tıklayın.
Bu, sidebar sayfasının görünmesini istediğiniz frame’dir.
2. File > Open in Frame komutunu seçin. Açılan iletişim kutusunda sidebar.html’i seçin. Frameset’i kaydedin.
Sayfa content frame’ine yüklenecek ve düzenlenmeye hazır hale gelecektir. İkincil gezinti öğelerinin henüz kendileriyle ilişkilendirilmiş bağlantılarının olmadığına dikkat edin.
3. content frame’inin içinde AboutGreen.html dosyasını açın. Sayfanın frame’e tam olarak sığdığından emin olun.
File menüsündeki Save All Frames komutunu kullanırken ve frame’lerinizi kaydederken dikkatli olun. Bu komut, frame’lerinizde ve frameset’inizde yer alan bütün açık sayfaları kaydeder. Her bir frame’de ilk başta görünen dosyalar frameset’te tanımlanır. Frame’lerde bulunan diğer sayfaları düzenlerken File > Save All Frames komutunu seçerseniz, (File > Open in Frame komutunu kullanarak), frameset’i yeniden tanımlamış olursunuz.
4. BeginningGreen.html dosyasını content frame’inde açın.
Sayfanızın şu anki görünümü sıradaki örneğe benzeyecektir. Sayfanın frame’e sığdığından emin olun.
Frame İçeriğini Kontrol Etmek
Frame’lerde sayfalar oluşturup bunları düzenlerken, bir frame’e kazara yanlış içeriği yerleştirebilirsiniz. Web sayfanızın başlangıçtaki görünümünde frame’lerin her birine doğru sayfaların yüklendiğinden emin olmak için Properties denetçisini kullanabilirsiniz.
1. Frames panelinde en üstteki frame’e tıklayarak titleNav frame’ini seçin.
Properties denetçisindeki Src metin alanında top.html’in seçili olduğundan emin olun. Eğer seçili değilse, buradaki klasör simgesine tıklayarak bu dosyayı bulun ve seçin.
Properties denetçisinde titleNav frame’ine ait frame özellikleri görüntülenecektir.
Seçilen frame’de görünen dosyanın kaynağı
2. Frames panelinde sağda yer alan frame’e tıklayarak moreContent frame’ini seçin.
Properties denetçisindeki Src metin alanında sidebar.html dosyasının seçili durumda olduğundan emin olun. Eğer seçili değilse, klasör simgesine tıklayarak bu dosyayı bulun ve seçin.
Properties denetçisinde, moreContent frame’ine ait frame özellikleri görüntülenecektir.
3. Frames panelinde sol alt kısımdaki frame’e tıklayarak content frame’ini seçin.
Properties denetçisinde yer alan Src metin alanının yanındaki klasör simgesine tıklayarak community_intro.html dosyasını bulun ve seçin. Frameset’i kaydedin.
BeginningGreen.html dosyası seçili durumdaydı, çünkü bu frame’de en son çalıştığınız belge buydu. Bir frame’de yer alan bir sayfayı düzenlemek üzere açtığınızda, frameset’in kaydedilmesi, frameset belgesi yüklendiğinde bu dosyanın söz konusu frame için varsayılan sayfa haline gelmesine neden olur. community_intro.html dosyası, en sonda kullanılacak olan frameset’in content frame’inde ilk görünmesini istediğiniz belgedir.
Properties denetçisinde, content frame’ine ait frame özellikleri görüntülenecektir.
Properties denetçisindeki Src metin alanına istediğiniz sayfanın URL’ini yazarak, çeşitli
kaynaklardaki Web sayfalarını belirli bir frame’de açabilirsiniz. Çağırdığınız sayfanın frameset ile aynı sunucuda yer alması gerekmez. Başka sunucularda yer alan sayfaların açılabilmesi, içeriğin ahlakî olarak kullanımı açısından olumsuz bir durum yaratabilir. Bazı frame tabanlı sayfalar, başkaları tarafından geliştirilen içeriklerin onların izni olmadan açılması için kullanılır. Kendinize ait olmayan içeriklerin telif haklarına saygı göstermeyi ihmal etmeyin ve belirli materyaller sizin Web sitenize ait değilse, ziyaretçilerin öyleymiş gibi bir izlenim edinmelerine engel olun.
Sayfalarınızın başka birine ait bir frame’den çağrılması konusunda endişeleniyorsanız, JavaScript kullanarak sayfanız başka bir frame’den
çağrıldığında tarayıcının sayfanızı kendi penceresinde açmasını sağlayabilirsiniz.
Site günlük kayıtlarını gözden geçirerek ve daha fazla bilgi için sistem yöneticinize danışarak böyle bir sorun olup olmadığını tespit edebilirsiniz.
Frame İçeriğini Bağlantılarla Kontrol Etmek
İçerik belge sayfalarını oluşturduktan sonra gezinti elemanlarını, Web sayfanızın içerik alanında görüntülenmesi gereken sayfalara bağlamanız gerekir. İçeriğin doğru konumda görünmesini sağlamak için, bağlantıyı ilgili frame’e atamanız gerekir.
1. Ekleme noktasını moreContent frame’indeki (sağdaki frame) Introduction metin bağlantısının içine yerleştirin. Properties denetçisinde Link metin alanının yanındaki Browse for File simgesine tıklayarak boş bağlantıyı (#) değiştirin. Aynı dizindeki community_intro.html sayfasını seçin. Bağlantıyı uygulamak için Return (Macintosh’ta) ya da Enter (Windows’ta) tuşuna basın. Bağlantı seçili durumdayken Target menüsünden content’i seçin.
Varsayılan durumda, bağlantılar bulundukları frame’e ya da pencereye atanır. Ama bu bağlantıların, kendilerine karşılık gelen belgeleri moreContent frame’inde değil, content frame’inde açması gerekiyor.
Link metin alanı
Target menüsü Oluşturduğunuz her yeni frame’in ismi Target menüsüne otomatik olarak eklenir.
Kolay anlaşılır, kısa ve açıklayıcı isimler kullanmak en iyisidir. Dreamweaver’ın verdiği varsayılan isim frame’in konumu hakkında fikir verir. Ama bir belgenin belirli bir frame’de açılmasını sağlamaya çalışıyorsanız, bu genel tipteki isimler yine de zor ve kafa karıştırıcı görünebilir.
Bir frame’e yüklenecek olan bir belge üzerinde çalışıyorsanız ve bu belgeyle frameset içinde çalışmıyorsanız (bu derste olduğu gibi), Target menüsünde frame’lerin ismini seçme gibi bir şansınız olmaz. Dreamweaver, Target menüsünde sadece geçerli belgede kullanılabilir durumda olan frame’lerin isimlerini görüntüler. Böyle durumlarda, sayfanın açılmasını istediğiniz frame’in tam ismini Target metin alanına yazmanız gerekir.
2. Birinci adımı tekrarlayarak, About metnini AboutGreen.html belgesine, Begin metnini de BeginningGreen.html belgesine, bağlayın. Bu bağlantıların her birinin content frame’ine atanması gerekir.
Target menüsünde, aşağıda görüldüğü gibi başka seçenekler de yer alır.
• _blank, bağlı belgeyi yeni, isimsiz bir tarayıcı penceresine yükler.
• _parent, bağlı belgeyi, bağlantıyı içeren frame’in ebeveyn frameset’ine yükler.
Bağlantıyı içeren frame başka bir frame’in içinde değilse, bağlı belge tarayıcı penceresinde tam ekran olarak açılır.
• _self, bağlı belgeyi, bağlantıyla aynı frame ya da pencerede açar. Bu hedef seçeneği açıkça anlaşıldığı için, genelde bunu belirtmeniz gerekmez.
• _top, bağlı belgeyi tarayıcı penceresinde tam ekran olarak açar, böylece bütün frame’leri siler.
3. Dosyayı kaydedin ve Web tarayıcınızda önizleyin.
Frame sayfalarınızı Web tarayıcısında önizlerken, bütün frame’lerin kaydedilmesi
gerektiğini bildiren bir iletişim kutusuyla karşılaşabilirsiniz. Bütün frame’leri ve frameset’i kaydetmek için OK düğmesine tıklayın.
About bağlantısına tıkladığınızda, content frame’inde AboutGreen.html belgesi görüntülenecektir.
Eğer sayfalarınız beklediğiniz frame’lerde görünmüyorsa, Properties denetçisindeki Target açılır menüsünde her bir bağlantı için doğru frame’i seçip seçmediğinizi kontrol edin.
Bağlantıların, bütün sayfaları content frame’inde açması gerekir. Eğer böyle olmuyorsa, Target menüsünü kullanarak, sayfaları bu frame’de açmayan bütün bağlantılar için hedef ayarını düzeltmeniz gerekir.
NoFrames İçeriğini Oluşturmak
Dreamweaver’da, frame’leri görüntüleyebilen tarayıcılar tarafından göz ardı edilen ve eski tipteki ve metin tabanlı tarayıcılarda ya da frame’leri desteklemeyen diğer tarayıcılarda görüntülenen içerikler oluşturabilirsiniz. NoFrames içeriği adı verilen bu bilgiler, frame’leri desteklemeyen taşınabilir Internet aygıtları, arama motorları ve ekran okuyucular tarafından da kullanılır. Oluşturduğunuz NoFrames içeriği, frameset dosyasına yerleştirilir. Frame’leri desteklemeyen bir Web tarayıcısı frameset dosyasını yüklediğinde, bu tarayıcı sadece NoFrames içeriğini görüntüler.
1. community.html belgesinde frameset’i seçin.
community.html belgesi tarayıcının ilk yüklediği sayfa olduğu için, NoFrames içeriği burada gösterilir.
2. Modify > Frameset > Edit NoFrames Content komutunu seçin.
Modify menüsündeki Frameset seçeneği kullanılamaz durumdaysa (gri olarak gösterilir ve seçilemez) bir frame seçmiş olabilirsiniz.
Belge penceresi, NoFrames sayfasını gösterecek şekilde değişecek ve en üst kısımda
“NoFrames Content” sözcükleri görünecektir. Bu hâlâ community.html belgesidir; sizin gördüğünüz, sadece sayfa içeriğinin farklı bir görünümüdür.
3. green_page1.txt belgesini açın, sonra da metnin tamamını seçin ve kopyalayın.
green_page1.txt metin dosyasından kopyaladığınız bu metni yapıştırarak belge penceresinde NoFrames içeriğini oluşturun.
Alternatif içerik, standart bir html sayfasından alınan elemanları içerebilir. Bu içerik, <noframes> ve </noframes> etiketlerinin arasına yerleştirilir. Sadece frame’leri desteklemeyen Web tarayıcıları bu içeriği görebilir. Bu içerik nispeten basit olmalıdır.
Frame’leri desteklemeyen tarayıcılar muhtemelen JavaScript’i, resim haritalarını ve diğer karmaşık eleman tiplerini desteklemez. Bazı Web siteleri NoFrames içeriğini, basit alternatif sayfalar sağlamak ya da ziyaretçileri Web sitesinin metin tabanlı bir versiyonuna yönlendirmek için kullanır. Bazı siteler de NoFrames içeriğini, sitenin sadece frame’leri görüntüleyebilen tarayıcılarda kullanılabileceğini belirten bir mesajı görüntülemek için kullanır.
4. Modify > Frameset > Edit NoFrames Content komutunun yanında onay işareti olduğundan emin olun.
Belge penceresi, NoFrames içeriğini gizleyecek şekilde değişecek ve frameset belgesinin normal görünümüne geri dönecektir.
NoFrames içeriğini düzenlemeyi tamamladıktan sonra pencereyi kapatmak isteyebilirsiniz, çünkü orijinal belgeyi göremezsiniz. Pencereyi kapatırsanız, frameset’i ve bütün frame sayfalarını kapatmış olursunuz. Bu durumda, eğer düzenlemeye devam etmek istiyorsanız bunları tekrar açmanız gerekir.
5. File > Save All komutunu seçin ve bütün belgelerinizi kapatın.
Frame’lerle Tek Başınıza Çalışın
Frame’ler uygun şekilde kullanıldığında bir Web geliştirme aracı olarak çok faydalı olabilirler.
Sitenizi gözden geçirin ve frame kullanmanın gerekip gerekmeyeceğini ya da kütüphane öğeleri (Ders 12’de göreceğiz) ya da şablonlar (Ders 13’te göreceğiz) gibi diğer elemanların sağladığı işlevleri elde edip edemeyeceğinizi düşünün. İlave uygulama yapmak isterseniz sitenizin belirli bir bölümünün iki versiyonunu (biri frame’li, diğeri de frame’siz olmak üzere) oluşturabilir ve bunları karşılaştırabilirsiniz.
Frame’lerle sayfa geliştirirken, Dreamweaver’ın sizden dahil etmenizi istediği erişilebilirlik seçeneklerini kullanmayı unutmayın ve frame tabanlı Web sayfalarını görüntüleyemeyen tarayıcılar ya da cihazlar için NoFrames içeriğini oluşturmayı asla ihmal etmeyin. Eğer sayfalarınızın iki versiyonunu hazırlıyorsanız, şu noktaları dikkate alarak bu versiyonların her birinin kullanılabilirlik düzeyini karşılaştırın:
• Gezinti kolaylığı
• Devamlılığı sağlama
• Web tarayıcısının işlevselliği
Ne Öğrendiniz?
Bu derste şunları öğrendiniz:
• Belgenizdeki frame’lerin yerleşim düzenini tanımlamak için bir frameset oluşturdunuz (Sayfa 353–357).
• Bir frameset’i kaydettiniz ve diğer frame’leri tek tek kaydetmeye ek olarak, bunların hepsini tek bir seferde nasıl kaydedeceğinizi öğrendiniz (Sayfa 357–359).
• Önceden tanımlanmış frameset’leri kullanarak frame’ler ve yuvalanmış frame’ler oluşturup sayfanızın yerleşim düzenini değiştirdiniz (Sayfa 357–361).
• Properties denetçisini kullanarak frame’leri yeniden boyutlandırdınız (Sayfa 359–363).
• Frames panelini ve Properties denetçisini kullanarak, frameset ve frame özelliklerini değiştirdiniz (Sayfa 363–366).
• Elemanları doğrudan frame’lere ekleyerek ve mevcut belgeleri frame’lerde açarak frame’lerin içinde belgeler oluşturdunuz (Sayfa 369–371).
• Sayfaların nerede görüneceğini belirleyerek frame içeriğini başka frame’lere yönlendirdiniz (Sayfa 371–374).
• Frame’leri görüntüleyemeyen tarayıcılar için NoFrames içeriği oluşturdunuz (Sayfa 374–376).
