「XHTMLマークアップ&スタイルシート」リフォームデザインガイドブック
生まれて初めてつくったWEBサイト、The Double Bogey。
バンド活動のPRと記録が目的でつくったんですが、やってみると、つくること自体が結構おもしろくて。
もともと中学まで得意な科目は美術、将来は絵を描く人になりたいなんて思ってたな、、、、高校で、美大進学のための予備校に通う同級生の作品を見て、その漠然とした夢は夢と散るわけですが。まぁでも三つ子の魂なんとやらで、ビジュアルな物に対する探究心をなくさなかったので、その欲求と、バンドのホームページをつくるという目的が上手くマッチしたワケです。
で、このサイトは、オーサリングソフトでテーブルを駆使してレイアウトするっていう、一昔前主流だった手法でつくりました。まだHTMLなんてさっぱりわからず、「とりあえず見た目思いどおりになればいいや」ってノリの僕には最適の手法で、ド素人が初めてつくったにしては、まぁまぁかなと思ってました。というか、友人のとってくれた写真によるところが大きいですが。
その後、勢い余って？ウェブデザインって世界を覗いてみたくなり、やめときゃいいのにその手の本を買い漁っては読みかじり、、、だんだんわかってきた、CSS。もともと文書の構造を記述するためのHTMLが、時代の要求に従ってビジュアルなページをつくるために、本来枠表をつくるためのテーブルタグをレイアウトに駆使する様になり、ソースが複雑化。そこで、HTMLは本来の文書構造だけにし、見栄えは別の方法で記述しましょう、というのがCSS.（カスケーディングスタイルシート）。
ってなウンチクならべても、やっぱり文系人間にはよくわからず、最終的に行き当たったのが上の本。テーブルタグでつくられたページを、CSSベースに「リフォーム」しましょう、っていう極めて実践的な内容で、読んでると、恐ろしい事に「できるんちゃうか？」って気になってきた（笑）。で、ついに手を付け始めました。サイトのデータを丸ごとコピーし、ソースコードを見ながら、フォントやテーブルにまつわるタグを削除、それをCSSに置き換えて行く作業。驚くのは削除するソースの量が多いこと。感覚ですが、だいたい1/3〜1/5ぐらいに減る感じ。で、その削った見栄に関する記述をCSSでするわけですが、こっちは外部ファイルにしておいて、複数ページをまとめてコントロールするので、トータルでは大幅にソースコードがダイエットできて、ページの読み込みも早くなるって寸法です。
とはいえ、まだまだわかってない事が多く、つまづきながらの作業。ホンマに公開できるまでいくんか？って感じですが（苦笑）。でも、新しい事を覚えて、それで何かが出来上がっていくというプロセスはやっぱり楽しいですよ。今時ブログをうまくカスタマイズしてホームページ代わりにする人も多い中、素人のくせにわざわざCSSを習得しようってのは「変人」の部類に入るのかもしれませんが（笑）
コメント