サイトマップ
編集後記 | メンバー | 方針 | 技術解説 | 動作確認ブラウザ |

編集後記

 このページには、以下のことを記載しています。
メンバー このサイトの作成を担当したメンバーを記載しています。
方針 このサイトを作成するにあたっての方針を記載しています。
技術解説 このサイトを作成するために使用した 技術解説 しています。 以下の2項目についてはページを分けて詳しく解説しています
「擬似フレーム(=疑似フレーム)」の作り方
「自動生成メニュー」の作り方
動作確認ブラウザ このサイトの動作確認ブラウザを行ったブラウザとその結果の一覧表です。



メンバー

八上 全弘(HTML, CSS, JavaScript作成)、 森澤 信子(配色決定、画像作成)、 藤本 晃司(CSS 作成)、 三木 幸雄(統括、写真撮影・処理)

メンバー写真



方針

 このサイトの作成を開始する前の話し合いで、以下のようなことを決めました。



技術解説

 このサイトを作り始めた時は、メニューの利用のしやすさや、 メニューの内容のメンテナンスのしやすさやを考えて、 フレームを使用していましたが、サイト内の個々のページを URL で紹介するわけにはいかないなどの問題がありました。
 そこで、フレームを使わずに、フレームを使ったサイトの良さを、 スタイルシートと JavaScript を駆使して実現することにしました。 フレームを使って作っていた時と比べ、見た目も動作も殆ど同じです。 「疑似フレーム」や「フレーム風サイト」とでも呼ぶべきサイトを 実現している方法をこれから書いていきます。
 主要なブラウザの最近のバージョンには全て対応出来るようにしました。 IE6 は、 { position: fixed } が使えませんが、 「IE6でもスクロールしても動かないボックス」というページに 良い解説と例があったので、参考にさせていただき、対応できるようにしました。


動作確認ブラウザ

ブラウザ名 動作
Internet Explorer 6
Internet Explorer 7
FireFox 1.5 - 2.0
Netscape 7.2
Mozilla 1.6
Safari 2.0.4
Opera 9.02
Sleipnir 2.64-2.66
lynx
IE 5.0-5.5
Mac IE 5
Netscape 4.x
対応状況が ◯ のものは、スタイルシートを読み込まないで動作します。 このサイトは、サイトマップを用意して全ページの上下にそこへのリンクを表示するなどし、 スタイルシートや JavaScript を読み込まなくても支障なく閲覧できるように作ってあります。


最後に

 このサイトでは、 JavaScript や CSS を多用してページを作っていますが、 技術先行のページにありがちな、ごてごてした印象や、 いかにも技術を使っていますという印象を与えない すっきりとしたデザインのページに仕上がって良かったと思います。

八上全弘
email address

更新履歴:
2006年10月15日 初回作成
2006年10月26日 文章、メールアドレスを追加
2006年10月28日 技術解説の概要を追加
2006年11月02日 対象とするブラウザについての記載を追加
2006年11月03日 動作確認したブラウザの一覧を追加
2006年11月07日 「疑似フレーム」の作り方と自動生成メニューの作り方を別ページに分離。

サイトマップ