WDE08 Blog: ＣＳＳ，そしてコンテンツとデザインを分離することがウェブ戦略に与える影響

• 深見 嘉明
• 2008年9月1日
• 9:44 PM
• CSS コラム

前回のエントリでテレビや書籍と異なり，ウェブは多様な環境でコンテンツが表示・閲覧されることを指摘し，そのためコンテンツとデザインを分離するという技術が生まれたことを紹介しました．そのコンテンツとデザインを分離するための技術がスタイルシートであり，その標準仕様がＣＳＳ（Cascading Style Sheets）です．

では，具体的にＣＳＳとはどのようなものなのでしょうか，，，という技術的な解説は当日のカンファレンスやワークショップにお任せするとして，ここでは具体的にＣＳＳが活用されているサイトを1つ紹介しておきたいと思います．

ウェブの標準規格の策定，普及活動を担う団体Ｗ３Ｃ（World Wide Web Consortium）の３つあるホストの中の１つ，慶應義塾大学湘南藤沢キャンパス（ＳＦＣ)のウェブサイトにアクセスしてみてください．

• ＳＦＣのウェブサイト

トップページにあるＳＦＣの3文字をかたどったロゴの横に鴨の絵が描かれ，その横にdesign switchという文字と3本の直線が横に並んでいると思います．その直線のうちどれかをクリックしてみてください．すると内容＝リンクはそのままに，背景などデザインだけが変化するのが見てとれるかと思います．この直線はＣＳＳのファイル＝デザインを選択するためのリンクです．クリックするたびにＣＳＳが切り替わり，それに対応して表示が変化したというわけです．

この例をご覧になって，「なんだ，単なるギミックじゃないか」とか，「デザイン面でのアピールにしかつながらないなんて」と思ってはいけません．ＣＳＳを導入する＝コンテンツとデザインを分離することは他にもさまざまなメリットがあるとともに，それによりウェブサイトを活用した中長期的なコミュニケーション戦略立案にまで影響をもたらすのです．

1つ目のメリットは前回のエントリから繰り返し述べているように，多様なデバイスでの閲覧への対応が低コストで行えるということです．ＰＤＡやスマートフォン，iPhoneなど，次々と発売される多様なデバイスに対し，普及の都度コンテンツをまるごと造りかえるのはあまりに非効率です．デザインとコンテンツを分離することにより，対応はＣＳＳのメンテナンスのみで済むようになります．

もう1つの大きなメリットは，企業の営業施策の変化によるコンテンツの追加・変更と流行の変化にともなうサイトデザインのリフレッシュを連動させて行う必要がないということです．

昨今の企業（組織）を取り巻く環境の変化は急激です．これに対応して部署や商品ラインナップの新設・廃止・再編が実施される頻度も多くなっています．それにあわせてウェブサイトの全面的な刷新を行うのはコスト面から考えると非効率です．逆に会社概要などめったに内容が変更とならない，もしくは項目は固定されており細かなデータが入れ替わるだけといったコンテンツまで，ウェブサイトのデザイン変更にあわせて全て作り直しというのも非効率的です．ＣＳＳの導入に代表されるコンテンツとデザインの分離はこのような非効率性を排除するというメリットがあります．

ということは，ウェブサイトの維持・メンテナンスに関する中期・長期的な予算配分や機能追加を考えるとき，コンテンツ製作に対する投資とデザインのブラッシュアップに対する投資とはあらかじめ分けて検討しておかなければならないのです．もちろん，いくらコンテンツとデザインの分離を導入しても，ウェブサイト構築・運営に対する総合的な判断や戦略立案の必要性がなくなったわけではありません．しかし，こうした技術的背景を認識しておかないと，無駄なコストが発生したり，効果的なリニューアルや機能追加が難しくなる危険性も存在します．ＣＳＳ１つとっても，ウェブに介在する全ての人に技術的背景の認識が必要とされる現状をご理解いただけるかと思います．

Images:

The images are downsized due to limited space here. The original dimensions may differ.
Click on the image to open it on a new tab.