擬似フレーム


きゅーとむ探検隊 ] | [ Vector支部 ]

memo00 | memo01 | memo02 | memo03 | memo04 | memo05 | memo06 | memo07


説明

スタイルシートによる「擬似フレーム」。フレームやテーブルを使わずに、フレーム風レイアウトを目指しました。


フレームと異なり1つのHTMLファイルにまとめられること,テーブルと異なりキーワードが多い本文 (擬似フレーム右側) を先に記述できることなどから、検索サイト対策に有効と思います (検索あるいはリンクしていただけるコンテンツ作りが最大の課題ですが...)。


デメリットは、メニュー (擬似フレーム左側) の保守が面倒なことと、本文 (擬似フレーム右側) のみ選択して印刷や保存ができないこと。

前者のデメリットについては、HomuPage Writer の Hyper Navi System で解決しました。メニュー構成が変化したとき、これを展開する手間が楽になり大感謝です。

後者のデメリットについては、企業サイト等でもフレームを使用しなくなってきているため、大した問題にはならないかも知れません。


メニュー (擬似フレーム左側) の領域に、幅 140px,高さ 1px のGIF画像を埋め込むと、ウィンドウサイズが 800×600px くらいまでなら、ある程度ボタンや画像のレイアウトを確保できるようです。

背景色と同色のGIF画像を埋め込んで目立たなくしても良いし、あえて <hr> の代わりに使っても良いでしょう。


擬似フレームというからには、コンテンツ表示域くらいはスクロールしないとつまらないですねぇ。

2006年9月末に放流された久々の新魚種、アカサリュウキン (夕焼ちゃん) と、ヒトトキンギョ (一青くん) の釣り上げSS画像でも飾っときましょう〜 (^^)


アカサリュウキン Get!

アカサリュウキン Get!


ヒトトキンギョ Get!

ヒトトキンギョ Get!


#画面解像度 1,024 × 768 ピクセルよりも高解像度でご覧の方には 「全てお見通しだっ!」 ってな感じで意味無いっすね。

#左のメニュー表示域に置いた 「擬似ボタン」 をクリックすると、もう少し長いページも見られます。

#と、いうより、ブラウザ窓の高さを縮めていただいた方が早いかも (^^)ゞ