教育コンテンツの制作現場から
境祐司
教育デザイナーとして学校、企業の講座企画、講演などの活動をおこなう。著書「改訂新版 Webデザイン基礎」(技術評論社)、「XHTMLマークアップ&スタイルシート リフォームデザインガイドブック」(ソシム)など
url: admn.air-nifty.com/books/
第7回
実践！サイト制作のアセット管理
－WebデザイナーとCMS－
インターネットが商用化されてから10年以上たち、「ホームページをつくる人」だったWebデザイナーの作業も肥大化してきた。Webサイトに関連する技術は複雑高度化、クライアントからの要求も多様化しつつある。本業のWebデザインよりも「CMSの設置」のほうが収入の柱になっているデザイナーが増えている。この連載で取り上げている「デジタルアセットの管理」や「ルール化」「モジュール化」などのスキルはWebデザイナーにとって必須のものとなる可能性が高い。
デザイナーとエンジニアの狭間で
Web関連の勉強会などに参加すると、デザイナーの方々から「CMS（Contents Management System）」について聞かれることが多くなった。特にフリーランスのWebデザイナーが多く、昨年前半から「CMSの設置」依頼が増えているという。なかには、Webサイトを一から構築していく仕事よりも、CMSを設置したりテンプレートをデザインする仕事のほうが多くなってしまったというデザイナーもいる。
中小企業からの依頼は、後述する「Movable Type」と「XOOPS Cube」が圧倒的で、かなり具体的なイメージをもっているようだ。「よくわからないので、お任せします」といった丸投げではなく、どういう情報をどのようなフォーマットで公開したいか明確になっているのである。先行している中小企業の（CMS導入）事例が多いのでイメージがつかみやすいのだろう。あるいは、経営者が自らブログサービスを利用していて、利便性や効果についての高い経験値があるのかもしれない。
小規模なCMSの仕事がWebデザイナーのところに集中するのは、「リーズナブルな（もしくは無償で使用できる）CMS」を専門に扱う業者が少ないからだろう。無償のCMS設置やテンプレート提供だけでは利益が出ないので、安価でコンビニエンスなサービスは提供していない企業が多い。どうしても個人事業者（フリーランス）に仕事が集まってくるのだ。受注したデザイナーは、サーバの知識やPHPなどのスキルを短期習得するために自己学習し、CMSの仕事に取り組んでいる。はた目で見ていると、デザイナーというよりエンジニアのように映る。
定義できなくなったWebデザイナーという職業
Webデザイナーといえば「ホームページをつくる人」であった。HTMLやCSSをコーディングしたり、グラフィックを作成する作業が大半を占める。
1998年ごろからDreamweaverなどのオーサリングソフトに完全依存するデザイナーが増えてくる。ハンドコーディングが行われない作業である。中小企業のWebサイトの多くはオーサリングソフトでつくられているといっても大げさではない（もっとも使われているのはホームページビルダーではないだろうか）。企業サイトといっても「近所の大学生につくってもらったホームページ」から「制作会社が企画・制作・構築するWebサイト」まで幅広い。
ニフティの「ココログ」がスタートした2003年12月、この時期が日本のブログブームの始まりである。ココログにはタレントや文化人、スポーツ選手などのブログがあり、一般のネットユーザーを引きつけた。何といってもだれでも簡単に更新できることが普及の要因といえる。
ブログの普及によって企業サイトにも変化が見られるようになってきた。自社サイトをブログで構築したり、サイトの一部をブログ化する中小企業が出てきたのだ。見栄えに個性がなかった企業ブログもデザインテンプレートのカスタマイズ・レベルが向上し、既存サイトのデザインと違和感がなくなってきた（もちろん、メインのサイトと差別化するために、あえてブログのデフォルトを採用している企業もある）。
現在は、ブログのデザインテンプレートを専門とする会社もある。また、テンプレートのデザインを専門とするWebデザイナーもいる。モジュールとしてのAjaxやFlashを請け負うWebデザイナーも少なくない。Webデザインという概念やWebデザイナーの定義がとても難しくなってきた（特に学校でWebデザインを教えている先生にとっては悩ましいことだろう）。HTMLやCSSのスキルだけではなく、情報構築やUIポリシーなどを網羅したWebデザインの「基礎」がより重要となってきたのではないだろうか。
中小企業が導入するCMS
中小企業でよく使われているCMSおよびビジネスブログは、Six Apart社（www.sixapart.jp/）の「Movable Type」【1】や「TypePad」、オープンソースの「XOOPS Cube」【2】「Plone」「Etomite」「Jetspeed」など。TypePadはインストール不要のASP（ホスティングタイプのブログサービス）で、ニフティのココログもTypePadをベースにして構築されている。
【1】Movable Type（www.sixapart.jp/movabletype/mt3/）
【2】XOOPS Cube（jp.xoops.org/）
TypePadは個人向けだけではなく企業向けのプランも用意されており、さまざまな業態に合わせたサイト構築が可能だ。大規模なサイトでは「日経BPネット」（日経BP社） や「CNET Japan 読者ブログ」（CNET Networks Japan）などがTypePadを使用している。
「XOOPS Cube」はオープンソースライセンスに基づいて開発されているため、配布されているソフトウエアをサーバにインストールするだけで使用することができる（サーバにはMySQLおよびPHPがインストールされている必要がある）。個人でも、基礎的な知識があれば容易に導入することが可能だ。無償で使用できるため中小企業からの「設置依頼」もかなり多いようだ。
小規模なサイトを対象としたシンプルCMS（簡易CMS）もある。数ページの見出しやメニュー、本文などのテキストをブラウザ上で編集することができる。
Objective Development（www.obdev.at/index.html）の「WebYep」などを参考にしてほしい【3】。興味深いのは、Adobe Dreamweaver（オーサリングソフト）やRapidWeaver（ビジュアルエディター）などのアプリケーションと連携できることだ【4】。CMSのビジュアルエディット機能を市販の製品と連動することで実現させているのである。
【3】WebYepのデモページ。見出しやメニュー、クレジットなどのテキストをブラウザ上で編集できる
【4】RapidWeaver（www.realmacsoftware.com/rapidweaver/）でテンプレートページのレイアウトを編集
アセットのマネジメントが重要
CMSは、データベースにテキストや画像などの情報が保存されており、デザイン（見栄え）と完全に分離されている。つまり、テンプレートのデザインはプロのデザイナーに依頼し、更新作業は社内で行うという「役割分担」が明確になるのだ。役割が明確になることで自然とワークフローができあがり、各々の工程が効率化されていくのである。
そこで、重要になってくるのが「アセット（資産）」の管理である。CMSやビジネスブログの導入が増えるほど、デジタルアセット・マネジメントの重要性も増してくると予想される。
デジタルアセット・マネジメント関連のソフトには、アセットの自動登録、整理、検索、閲覧、配信、共有などの機能がある。
Webサイト構築の上流工程で扱うドキュメント（アイデアスケッチ、仕様書、設計図など）から下流工程の制作で使用するテキスト、画像、カラースキーム、XHTMLおよびCSSのモジュールなど大量のアセットを扱うことができる【5】【6】。また、「自動監視機能」が搭載されているので、削除や変更したデータを自動的に更新してくれる。複数のフォルダに入っているデータのファイル名を変更しても、同期させるだけですぐに反映される。サーバ内の指定されたディレクトリにファイルを追加したり、入れ替えた場合なども同様だ。
【5】Extensis Portfolio（www.extensis.co.jp/products/portfolio_8.asp）
【6】Portfolioのデジタルアセット管理画面
2007年からのWebデザイナー像
Webサイトは印刷物のようにつくり込んで完了するものではなく、定期的に効果測定を行いながら更新していく「完成しないツール」としてとらえることができる。CMSやビジネスブログなどの導入が増えているのは、このような運用が定着してきていることを意味する。情報を閲覧する「ページ」の集まりとしてのWebサイトからデータにアクセスする「使う」Webサイトへの移行は、想像以上に速く進行しているように思える。CMS設置が増え、実際に取り組むことは「Webサイトの役割を再考する」よいきっかけになるはずだ。
これからのWebデザイナー像は、つくり込むページからモジュラリティを意識した情報構築への対応と変化していくかもしれない。
本記事は『Web STRATEGY』2007年3-4 vol.8からの転載です
この号の特集など、ほかの記事の紹介はこちら！
『Web STRATEGY』最新号の情報はこちら！
Amazon.co.jpでの購入はこちら！
定期購読はMdN Squareで！
境祐司教育デザイナーとして学校、企業の講座企画、講演などの活動をおこなう。著書「改訂新版 Webデザイン基礎」(技術評論社)、「XHTMLマークアップ&スタイルシート リフォームデザインガイドブック」(ソシム)など
url: admn.air-nifty.com/books/
第7回
実践！サイト制作のアセット管理
－WebデザイナーとCMS－
インターネットが商用化されてから10年以上たち、「ホームページをつくる人」だったWebデザイナーの作業も肥大化してきた。Webサイトに関連する技術は複雑高度化、クライアントからの要求も多様化しつつある。本業のWebデザインよりも「CMSの設置」のほうが収入の柱になっているデザイナーが増えている。この連載で取り上げている「デジタルアセットの管理」や「ルール化」「モジュール化」などのスキルはWebデザイナーにとって必須のものとなる可能性が高い。
デザイナーとエンジニアの狭間で
Web関連の勉強会などに参加すると、デザイナーの方々から「CMS（Contents Management System）」について聞かれることが多くなった。特にフリーランスのWebデザイナーが多く、昨年前半から「CMSの設置」依頼が増えているという。なかには、Webサイトを一から構築していく仕事よりも、CMSを設置したりテンプレートをデザインする仕事のほうが多くなってしまったというデザイナーもいる。
中小企業からの依頼は、後述する「Movable Type」と「XOOPS Cube」が圧倒的で、かなり具体的なイメージをもっているようだ。「よくわからないので、お任せします」といった丸投げではなく、どういう情報をどのようなフォーマットで公開したいか明確になっているのである。先行している中小企業の（CMS導入）事例が多いのでイメージがつかみやすいのだろう。あるいは、経営者が自らブログサービスを利用していて、利便性や効果についての高い経験値があるのかもしれない。
小規模なCMSの仕事がWebデザイナーのところに集中するのは、「リーズナブルな（もしくは無償で使用できる）CMS」を専門に扱う業者が少ないからだろう。無償のCMS設置やテンプレート提供だけでは利益が出ないので、安価でコンビニエンスなサービスは提供していない企業が多い。どうしても個人事業者（フリーランス）に仕事が集まってくるのだ。受注したデザイナーは、サーバの知識やPHPなどのスキルを短期習得するために自己学習し、CMSの仕事に取り組んでいる。はた目で見ていると、デザイナーというよりエンジニアのように映る。
定義できなくなったWebデザイナーという職業
Webデザイナーといえば「ホームページをつくる人」であった。HTMLやCSSをコーディングしたり、グラフィックを作成する作業が大半を占める。
1998年ごろからDreamweaverなどのオーサリングソフトに完全依存するデザイナーが増えてくる。ハンドコーディングが行われない作業である。中小企業のWebサイトの多くはオーサリングソフトでつくられているといっても大げさではない（もっとも使われているのはホームページビルダーではないだろうか）。企業サイトといっても「近所の大学生につくってもらったホームページ」から「制作会社が企画・制作・構築するWebサイト」まで幅広い。
ニフティの「ココログ」がスタートした2003年12月、この時期が日本のブログブームの始まりである。ココログにはタレントや文化人、スポーツ選手などのブログがあり、一般のネットユーザーを引きつけた。何といってもだれでも簡単に更新できることが普及の要因といえる。
ブログの普及によって企業サイトにも変化が見られるようになってきた。自社サイトをブログで構築したり、サイトの一部をブログ化する中小企業が出てきたのだ。見栄えに個性がなかった企業ブログもデザインテンプレートのカスタマイズ・レベルが向上し、既存サイトのデザインと違和感がなくなってきた（もちろん、メインのサイトと差別化するために、あえてブログのデフォルトを採用している企業もある）。
現在は、ブログのデザインテンプレートを専門とする会社もある。また、テンプレートのデザインを専門とするWebデザイナーもいる。モジュールとしてのAjaxやFlashを請け負うWebデザイナーも少なくない。Webデザインという概念やWebデザイナーの定義がとても難しくなってきた（特に学校でWebデザインを教えている先生にとっては悩ましいことだろう）。HTMLやCSSのスキルだけではなく、情報構築やUIポリシーなどを網羅したWebデザインの「基礎」がより重要となってきたのではないだろうか。
中小企業が導入するCMS
中小企業でよく使われているCMSおよびビジネスブログは、Six Apart社（www.sixapart.jp/）の「Movable Type」【1】や「TypePad」、オープンソースの「XOOPS Cube」【2】「Plone」「Etomite」「Jetspeed」など。TypePadはインストール不要のASP（ホスティングタイプのブログサービス）で、ニフティのココログもTypePadをベースにして構築されている。
【1】Movable Type（www.sixapart.jp/movabletype/mt3/）
【2】XOOPS Cube（jp.xoops.org/）
TypePadは個人向けだけではなく企業向けのプランも用意されており、さまざまな業態に合わせたサイト構築が可能だ。大規模なサイトでは「日経BPネット」（日経BP社） や「CNET Japan 読者ブログ」（CNET Networks Japan）などがTypePadを使用している。
「XOOPS Cube」はオープンソースライセンスに基づいて開発されているため、配布されているソフトウエアをサーバにインストールするだけで使用することができる（サーバにはMySQLおよびPHPがインストールされている必要がある）。個人でも、基礎的な知識があれば容易に導入することが可能だ。無償で使用できるため中小企業からの「設置依頼」もかなり多いようだ。
小規模なサイトを対象としたシンプルCMS（簡易CMS）もある。数ページの見出しやメニュー、本文などのテキストをブラウザ上で編集することができる。
Objective Development（www.obdev.at/index.html）の「WebYep」などを参考にしてほしい【3】。興味深いのは、Adobe Dreamweaver（オーサリングソフト）やRapidWeaver（ビジュアルエディター）などのアプリケーションと連携できることだ【4】。CMSのビジュアルエディット機能を市販の製品と連動することで実現させているのである。
【3】WebYepのデモページ。見出しやメニュー、クレジットなどのテキストをブラウザ上で編集できる
【4】RapidWeaver（www.realmacsoftware.com/rapidweaver/）でテンプレートページのレイアウトを編集
アセットのマネジメントが重要
CMSは、データベースにテキストや画像などの情報が保存されており、デザイン（見栄え）と完全に分離されている。つまり、テンプレートのデザインはプロのデザイナーに依頼し、更新作業は社内で行うという「役割分担」が明確になるのだ。役割が明確になることで自然とワークフローができあがり、各々の工程が効率化されていくのである。
そこで、重要になってくるのが「アセット（資産）」の管理である。CMSやビジネスブログの導入が増えるほど、デジタルアセット・マネジメントの重要性も増してくると予想される。
デジタルアセット・マネジメント関連のソフトには、アセットの自動登録、整理、検索、閲覧、配信、共有などの機能がある。
Webサイト構築の上流工程で扱うドキュメント（アイデアスケッチ、仕様書、設計図など）から下流工程の制作で使用するテキスト、画像、カラースキーム、XHTMLおよびCSSのモジュールなど大量のアセットを扱うことができる【5】【6】。また、「自動監視機能」が搭載されているので、削除や変更したデータを自動的に更新してくれる。複数のフォルダに入っているデータのファイル名を変更しても、同期させるだけですぐに反映される。サーバ内の指定されたディレクトリにファイルを追加したり、入れ替えた場合なども同様だ。
【5】Extensis Portfolio（www.extensis.co.jp/products/portfolio_8.asp）
【6】Portfolioのデジタルアセット管理画面
2007年からのWebデザイナー像
Webサイトは印刷物のようにつくり込んで完了するものではなく、定期的に効果測定を行いながら更新していく「完成しないツール」としてとらえることができる。CMSやビジネスブログなどの導入が増えているのは、このような運用が定着してきていることを意味する。情報を閲覧する「ページ」の集まりとしてのWebサイトからデータにアクセスする「使う」Webサイトへの移行は、想像以上に速く進行しているように思える。CMS設置が増え、実際に取り組むことは「Webサイトの役割を再考する」よいきっかけになるはずだ。
これからのWebデザイナー像は、つくり込むページからモジュラリティを意識した情報構築への対応と変化していくかもしれない。
本記事は『Web STRATEGY』2007年3-4 vol.8からの転載です
この号の特集など、ほかの記事の紹介はこちら！
『Web STRATEGY』最新号の情報はこちら！
Amazon.co.jpでの購入はこちら！
定期購読はMdN Squareで！
