フレームレスなwebページとは?
最近のwebページの構成の主流な考え方の一つとして、「フレームを使わない」というものがあります。これには様々な理由がありますが、閲覧者にとって使い勝手が悪いというのが最大の理由のようです。
また、文書と文書をハイパーリンクで繋げて意味のあるwebページ群(サイト)を作るというHTMLの観点から言うとフレームを構成するためのHTMLファイルは「意味のない空HTML文書」であり、あまりよろしくないと考えられます。
上記のような理由から、次期バージョンの(X)HTMLではフレーム廃止が決定されています(HTML 5、XHTML 1.1)。
ただしすぐにフレームが使えなくなるわけではありません。フレームを使いたい場合は旧いDTDに従って正しくHTMLを書けばOKです。次期バージョンの(X)HTMLが勧告されたからと言って、ブラウザが現行の(X)HTMLをサポートしなくなるのはまだまだ先だと思われます。
ここではフレームを使わないwebページ作りについて考えて行きたいと思います。
フレームの利点と欠点
- 利点
- メニュー部分とコンテンツ部分を1ページで見せたい場合、コンテンツ部分のHTML文書だけを作っていけばよい
- メニューが増えた時もメニュー部分のHTML文書一枚を書き換えるだけでよい
- 欠点
- 閲覧できないブラウザがある(携帯やテキストブラウザ・古いブラウザ)
- ページの遷移とURLの動きが連動しない
- 検索エンジンにはフレームの中身のページが単体で捕捉される
- 上記のようなところから単体ページに訪れた閲覧者は他のページに移動するのが困難になる
- 紹介リンクをはりたい場合に中のページを遷移した状態を保持できない
- target属性値を間違え他サイトをフレーム内に表示させてしまった場合著作権侵害になる
考えようによっては上記の欠点も利点になりえます(簡易閲覧制限…とか?逆SEO…とか?リンクやお気に入りをトップページのみにしろ…とか?)が、サイトを訪れる人に優しい・見やすいサイトを目指すならやはりフレームは使わないほうがいいかもしれません。
フレームサイトからフレームレスなサイトへ移行する際に頭を悩ませるのはフレームでの共通部分(メニューなど)をどうするか、という点ではないかと思います。
フレームなしで複数ページに共通部分を表示する
フレームなしでサイト内の複数ページに共通部分を表示するには色々な方法があります。
- ひたすら手打ちで共通部分をHTML文書に書いていく
- javascriptで共通部分を書き出す
- PHPやSSIを使って共通部分を挿入する
- オーサリングソフトのテンプレート機能を使う
- いっそのことCMSにする
それぞれの説明についてはおいおい追加していきます。