「Web標準化時代のWeb制作ワークフロー」を編集中

Blogの流行やアクセシビリティ配慮への意識の高まりなどの後押しもあり、現在、Web構築に関する流れは、Web標準に向かっています。

Web標準とは、その名前のとおり、Webサイトの制作、運用に変わる技術の標準化を行ったもので、主な策定組織としては、W3C（World Wide Web Consortium） やISO（International Organization for Standardization） が挙げられます（参考：Web標準の策定組織）。
最近、Webに関わる人たちの間で話題になっているのは、大きくWeb標準と呼ばれるものの内、Webコンテンツの実装に必要とされるマークアップ言語（=(X)HTML）とスタイルシート（=CSS)を主として扱った狭義のWeb標準だと思います。

Web標準に関しての詳しい情報は、弊社、木達が担当しているWeb標準Blogをご参考にしていただくとして、ここでは、Web標準化時代におけるWeb制作現場でのワークフローの変化について、考えてみたいと思います。

(X)HTMLとCSSによって「文書構造と視覚表現の分離」を可能にする狭義のWeb標準技術は、Web制作現場におけるワークフローの上で、これまで以上に、情報デザインを担当するインフォメーション・アーキテクト（IA)とビジュアル・デザインを担当するデザイナーの役割分担とそれぞれの責任の分担を明確にします。

HTMLに代表されるマークアップ言語は、文書の一部を「タグ」と呼ばれる特別な文字列で囲うことにより、文章の構造(見出しやハイパーリンクなど)を、文章中に記述していく記述言語で、CSSとは、Cascading Style Sheetの省略表記で、Webコンテンツの視覚的な表現を指定するための仕組みのことです。
つまり、狭義のWeb標準技術における「文書構造と視覚表現の分離」は、(X)HTMLとCSSのそれぞれをより本来的な目的に応じた使用を行うことにより、文書構造、視覚表現のそれぞれを記述するファイルそのものが物理的に分離されることを意味します。

ファイルそのものが物理的に分離されていれば、作業分担やその責任の所在を明確に分けることは非常に簡単なことです。
文書構造の物理的な設計である(x)HTML側をIAが、視覚表現の物理的な設計であるCSS側をデザイナーが、同時並行的に作業を進めるということが可能になるでのす（もちろん、分担して作業を進める前に、最終的に結合された段階を想定した事前の設計コンセプトの共有などは必要ですが）。

これは非常に画期的なことです。

これまでのWebサイト構築というと、どうしてもビジュアル（視覚表現）先行で評価されがちでした。
それは純粋なビジュアルイメージだけの問題としてではなく、ユーザビリティ設計においても、レイアウトやボタンをわかりやすさなど、ユーザーインターフェイスの見栄えに関する問題に焦点が集中しがちで、Web全体の構造（階層構造やリンク構造）やドキュメント単位での文書構造の問題（情報設計の問題）が疎かにされがちでした。
その結果、もたらされたのは、数年に一度行われデザイン・リニューアル時の必要以上のコスト高、デザイン重視のWebサイトにおける検索エンジン非最適化（Dis-SEO!）、見栄え以外のユーザビリティ設計の欠如によるアクセス数の伸び悩みといった問題です。

現在、SEO対策やユーザビリティの改善などがもてはやされていますが、むしろ、それはビジュアル先行型の非Web標準的な設計・実装を行ってきたツケであり、実は、Web標準的な設計コンセプトで「文書構造と視覚表現の分離」して、双方が同等に重要なものであることを理解した上で、Webサイト構築のワークフローを実践すれば、後付け的なSEO対策やユーザビリティ改善などが必要になることはまったくないはずなのです。

Webサイトの設計は、間違いなくエディトリアル・デザインに類別されるものです。
にもかかわらず、これまでのWebサイトのデザインにおいては、文書構造のエディット（編集）面での設計が異常と言ってよいほど、疎かにされがちでした。
普通の書籍や雑誌において章立てや台割が考えられずに編集が行われることはないと思いますが、Webサイトの設計（＝編集）作業過程では、平気でこうした情報デザインの要素が疎かにされる面が多かったと思います。

もちろん、これまでのWebサイトの設計段階においても、サイト構成図や画面構成書などのドキュメントを通じて、情報設計を行っていました。
しかしながら、こうした論理設計にあたる設計作業も、(X)HTMLとCSSが明確に文書構造と視覚表現を分離した形で使用されていなかったため、物理設計段階で論理設計で決めた要件が正確に引き継がれなかったり、そもそも、そうした論理設計から物理設計にいたる設計コンセプトと実装の技術的なコミュニケーション言語の不在（設計における仕様を実装に引き継ぐ現実的な手段の不在）が論理設計においても視覚表現の設計が重視されがちで、文書構造面の設計を疎かにしてしまっていたりもしました。

しかし、こうした問題も、(X)HTMLとCSSを明確に分離するWeb標準的な実装を前提として、それにあわせた作業役割の分担、ワークフローを確立すれば、問題ではなくなります。
つまりは、文書構造側の設計を担うIAと、視覚表現側の設計を担うデザイナーがそれぞれ同じ要件～設計コンセプトに基づき、協力し合いながらもそれぞれ自身に与えられた責務を同時に行い、最終的な結合状態でのアウトプットを目指すのであれば、これまでのように視覚表現ばかりが先行されがちで、SEO対策やユーザビリティ面で課題を抱えがちなWebサイトができてしまうということも大幅に減らすことができます。

Web標準を単なる標準化ととらえるのは非常にもったいなことです。
それは標準化であると同時に、これまでのWeb構築における問題点の多くを一気に解決してくれる標準技術です。

以前（売れるお店とWebサイト、そして、ブランディング）にも書きましたが、Webサイトはプル型のマーケティングツールです。
しかし、現在のところ、プル型のマーケティングツールとしてきちんと設計されていない（つまりはサイト全体のSEO対策やユーザビリティ配慮が行われた設計がされていない）ため、Webマーケティング面において、リスティング広告（Adwords、Overture）やバナー広告、メール広告などの外部手段に多くを頼らなければいけないという大きな矛盾を抱えています。

こうした矛盾さえ、Web標準技術をベースにしたきちんとした設計、実装を行いさえすれば、そのほとんどが解決されます。
広告費のコスト面の改善、Webマーケティングの本来的な目的でもある、Webサイトへのより多くの訪問者の誘導、Webサイトの訪問者の顧客化といった面での改善、など。
もはや、Web標準化をためらう理由はどこにもないように思うのですが、いかがでしょうか？