先日は Tarot FILES を試しに HTML5 形式にしてみた（FILES HTML5）ところ、なかなかいい感じだったので、ホームページのトップページも書き換えてみることにしました。
トップページははるか昔に Microsoft の Frontpage Express とかいう HTML エディターで作成したファイルをちょこちょことテキストエディターで修正しつつ使い続けてきたので、ソースはつぎはぎだらけでぼろぼろでした。
一応、古くは Netscape 4.x や IE4.0、テキストブラウザの Lynx、携帯（ガラケー）、ドリームキャストでの閲覧まで配慮した作りになっていて、そういった古いブラウザ向けのタグやらスタイルシートやらを取り除くことができずにいたのです。
それでもまあ、最近は IE8 以上のブラウザを想定していればほぼ問題はなさそうだったので、HTML5 対応ついでにソースの大改修を行うことにしました。
ページのデザインはほとんどがテーブルレイアウトで、文字修飾にはフォントタグを使って大きさや色を指定していた始末で、それらを排除してほぼ全てを外部スタイルシートで管理するようにしました。
今までテーブルレイアウトでデザインしていたものは DIV 要素を用いてブロックレイアウトで代用し、ほぼ完全に再現することができました。ぱっと見は、以前とどこが変わっているのかわからないくらいですが、中身は骨組みから何から全てごっそりと書き換えてあります。
ページ内の構造そのものが以前とはまったく異なるものとなっています。
一応、記念に修正直前の HTML ファイルも保存しておきました。修正が完了したファイルも一緒に保存しておいたので、興味のある方は以下の場所からダウンロードしてソースを覗いてみたりしてください。
以前のページの一部を撮影したスナップショットはこんな感じ
0 件のコメント:
コメントを投稿