2012年4月19日
Web担当者Forum ミーティング2012 Spring

わかる!Web CMS選択術-2012- + HTML5 CMS - Web Meister

Web Meister

株式会社サイズ 代表取締役 糟谷 博陸

わかる!Web CMS選択術-2012- + HTML5 CMS - Web Meister 概要

ウェブマスター進化論 コーポレートサイトに未来をもたらす仕事術

自己紹介 : 株式会社サイズ

xyz corporation

株式会社サイズ / xyz corporation

HTML5 CMS - Web Meister (コンテンツ管理システム)による PC・携帯・スマートフォンへワンソースマルチデバイス化した Web サイトを制作する Webインテグレーターです。
レスポンシブ Web デザインやjQuery Mobileなどを活用したスマートフォンサイト制作にも積極的に取り組んでおります。

Web制作とCMS導入のご依頼お待ちしております。

facebookページ : よければ「いいね」してくれると嬉しいです。

自己紹介 : 経歴

糟谷 博陸 / Hiromichi Kasuya

ロゴ:SEGA
ロゴ:INTER MEDIA JAPAN
ロゴ:Web Meister
ロゴ:xyz corporation

1994年、セガ入社。主に電波メディアを担当。

2000年、IMJに入社。事業本部長として大規模サイトを多数構築する

2005年、CMS - Web Meisterを完成。

2007年、アジア→ヨーロッパ→中東→アフリカ→アメリ大陸世界40ヵ国を旅する。世界遺産検定2級。

2008年、IMJよりWeb Meister事業を譲受し、株式会社サイズ設立。単なるCMSベンダーではできないWebインテグレーションを提供中。

慶應義塾大学経済学部卒業
法政大学大学院経営学専攻マーケティングコース修了
2004~6年、慶大SFC外部講師

自己紹介 : 経歴(セガ)

参考:セガサターン ポスター

セガサターン ポスター

参考:Dreamcast ポスター

Dreamcast ポスター

自己紹介 : 経歴(IMJ)

2006年:DESIGN IT 「Web 2.0 ≒ Web Meister 2.0 その理由」

参考:製品コンセプト資料

自己紹介 : 経歴(世界一周のルート)

糟谷博陸
世界一周のルート

2007年、アジア、ヨーロッパ、中東、アフリカ、アメリカ大陸の世界40ヵ国を旅する。世界遺産検定2級

自己紹介 : 経歴(株式会社サイズ)

書籍・刊行物

【web creators特別号 Webサイト制作 最新トレンドの傾向と対策】

【Web Site Expert】

講義・講演・セミナー

講演・執筆のご依頼お待ちしております。

現在のWeb環境

従来環境のイメージ

言葉があふれかえって意味不明です。
マルチデバイス対応ではレスポンシブWebデザイン、モバイルファースト。
リッチクライアントもFlashだけでなくJava Script、HTML5。
ソーシャルメディア連携ってどうするの?
HTML 5、プログレッシブエンハンスメントって?
もちろんSEO対策や多言語対応も求められます。

マルチデバイス対応

マルチデバイス対応のイメージ

過去のWeb環境

過去のWeb環境のイメージ

現在のデバイス環境

現在のデバイス環境のイメージ

そもそもデジタルデバイスって?

コンテンツ制作に関わるデジタルデバイスの3要素

  1. 画面解像度
  2. 入力インタフェース
  3. ユーザインタフェース・テクノロジー

デバイスの要素

ユーザインタフェーステクノロジー

HTML、Flash、Ajax、HTML5、スマートフォンネイティブアプリ、電子書籍フォーマットなど

マルチデバイス対応の本質

Webサイトには
汎用と専用
しか存在しない

専用とは?

専用デバイスのイメージ

専用 : デバイス毎にWebサイトを用意

汎用とは?

デバイスの汎用イメージ

汎用 : 1つのWebサイトで全てのデバイスに対応

マルチデバイス対応(汎用:コンテントネゴシエーション)

コンテントネゴシエーションとは、
クライアント(ブラウザ)からのリクエストに応じてサーバが最適なファイルを自動的に判断してレスポンスを返す仕組みのことである。

動的CMSの多くはこのタイプ

事例:慶應義塾大学SFC
事例:慶應義塾大学SFC

マルチデバイス対応(汎用:レスポンシブWebデザイン)

マルチデバイスのイメージ

「Responsive Web Design:レスポンシブ・ウェブ・デザイン」
過去においてはリキッドデザイン(サイズ可変デザイン)と呼ばれ、主にPCの画面幅に応じて横幅が拡大・縮小するHTMLレイアウトのこと。

過去のリキッドデザインとの違いは全ての横幅で同一のレイアウトではなく、CSS3 Media Queries によって横幅指定でレイアウトが変更できるようになったこと。

マルチデバイス対応(汎用:レスポンシブWebデザイン事例)

事例:Web担当者Forum

http://web-tan.forum.impressrd.jp/e/2012/02/24/12201

マルチデバイス対応(汎用:レスポンシブWebデザイン事例)

事例:speckyboy

http://speckyboy.com/2012/02/29/40-examples-of-brilliant-responsive-website-layouts/

事例:inspirationfeed

http://inspirationfeed.com/inspiration/websites-inspiration/60-examples-of-responsive-website-design/

マルチデバイス対応(汎用:レスポンシブWebデザイン事例)

マルチデバイス対応(汎用:Apple)

サイズの拡大・縮小を考慮に入れて制作する手法。手法の名前はありません。

考察:Appleはスマホサイトを作らない。
http://www.pxt.jp/ja/diary/
article/257/index.html

マルチデバイス対応(汎用手法のメリット・デメリット)

完全一致はメリットでもあり、デメリットでもある。

マルチデバイス対応(汎用手法のデメリット)

構造が完全一致のため、
ターゲットユーザや利用シーン、サイトの目的をデバイスごとに設定できない
(ユーザ中心設計ができない)

マルチデバイスのイメージ

スマートフォン対応において汎用手法は専用に劣る
(レスポンシブWebデザイン、コンテントネゴシエーション、Appleの手法)

固定幅PCサイト<汎用手法<モバイル専用サイト

モバイルファーストとは?

「モバイル・ファースト」というのは、
ウェブサイトの設計をするときにモバイル版のウェブサイトの設計から始めるという手法です。 すこし噛み砕くと、デスクトップ版を作成し、その情報をそぎ落としてモバイル版を作成する「デスクトップファースト」ではなく、 本当に必要な情報や機能を最初に決定してモバイル版を作成してから、デスクトップ版では他に必要だとおもわれる情報を慎重に付け加えていく手法です。

事例:allWebクリエイター塾

http://all-web-blog.blogspot.jp/2011/03/blog-post_18.html

モバイルファーストとは?

「モバイルファースト」は、まずモバイルからユーザーを考えてコンテンツを企画し、制作していくという考え方であり、 決して「スマートフォン向けサイトを先に作る」という作業手順ではない。

モバイルファーストの実践基本ステップ

  • モバイルユーザーのゴール設計
  • サイトの情報・UI設計
  • コンテンツにフォーカスする

モバイル専用サイトの制作フローとどこが違うのか?
デスクトップ版では他に必要だとおもわれる情報を慎重に付け加えていく手法はどこにいった?

モバイルファーストとは?

事例:Web担当者Forum

「モバイルファースト」を採用する企業達

「モバイルファースト」ですが、すでに企業として手法として取り入れています。 欧米では新しいコンセプトではありません。「モバイルファースト」を手法として取り入れている企業を紹介します。

GoogleやAdobeやFacebookのトップがWeb制作手法について語るでしょうか?
欧米の「Mobile First」とは事業戦略において急拡大しているモバイル市場を優先するということであり、Web制作手法ではありません。
例:GoogleによるAndroid、AdobeによるPhoneGap、FacebookによるInstagramの買収など

モバイルファーストとは?

モバイルファーストという
Web制作手法は現在存在しない

モバイルファーストの課題

欧米の「Mobile First」と日本の「モバイルファースト」は別のものです。
日本の「モバイルファースト」に関して3つの視点で検討する必要性があります。

  1. 事業戦略
    Google、Adobe、FacebookのようなWeb企業の事業戦略において「モバイルファースト」は存在します。 日本でも新しいコンセプトではありません。
    グリー、モバゲー、ミクシィなどモバイルに事業の中心を移行している企業は多数存在します。
  2. マーケティング戦略
    Webをマーケティング・プロモーションの場として活用している企業の場合、モバイルが多数のターゲットが存在する最優先メディアであり、最優先メディアと位置づけた場合、「モバイルファースト」になります。 ターゲットがいない場合、そのようなことをする必要は全くありません。例えばシルバー向け商材など。
    これまでのプロモーションミックスの検討と変わりはありません。
  3. Web制作手法
    「デスクトップ版では他に必要だとおもわれる情報を慎重に付け加えていく手法」が明らかになっていません。ディレクション、実装方法を明らかにすべきです。
    ※注意:Web制作会社にモバイルファーストでWeb制作を行うと言われた場合、モバイルサイトを汎用化する手法を必ず確認してください。

それではどうするのか?

マルチデバイス対応

  1. デバイスの汎用イメージ
    専用 : デバイス毎にWebサイトを用意
    1. PC
    2. 携帯
    3. スマートフォン
    (バラバラなので高コスト、デバイスごとのユーザ中心設計は可能)
    ユーザファースト
  2. 専用デバイスのイメージ
    汎用 : 1つのWebサイトで全てのデバイスに対応
    1. 全てのデバイス
    (1つで済むので低コスト、デバイスごとのユーザ中心設計は不可能)
    コストファースト

汎用+専用

デバイスの汎用+専用イメージ

  1. 汎用+専用
    A → A' → 全てのデバイス
    A → A" → モバイル
    (コストは中間、デバイスごとのユーザ中心設計は可能)
    インポータントユーザファースト

マルチデバイス対応(汎用+専用のメリット)

構造を一致しなくても良いため、ターゲットユーザや利用シーン、サイトの目的をデバイスごとに設定できる(ユーザ中心設計ができる)

マルチデバイスのイメージ

サイト構造は汎用と専用サイトで同じである必要はなく自由度があります。 また、モバイルから考えるWebサイト制作も可能です。 しかも、モバイルファーストのように制作したモバイル専用サイトを汎用化する必要はありません。

レスポンシブWebデザイン+モバイル専用サイト

マルチデバイス対応(汎用+専用の制作手法)

ワンソース・マルチデバイス

ワンソース・マルチデバイスサイトの制作ステップ

構造と関係なくページをコピーできるCMSがあればPCサイトから必要なページを複製するだけで、 運用管理が可能。逆にモバイルからPCサイトに再利用することも可能

マルチデバイス対応(汎用+専用の制作事例)

国立音楽大学 + Web Meister

事例:国立音楽大学

ユーザ、デバイスに合わせたコンテンツ管理を実現 PC⇔モバイルでコンテンツを再利用。
ユーザはモバイルとしての機能を重視したい時にはモバイル専用サイトを、 PCと同じ情報を閲覧したい時は汎用サイトを、ユーザ側で選択可能。

汎用+専用 決定しなければならないこと

デバイスの汎用+専用イメージ

決定しなければならないこと

  1. どのように汎用化するのか?
  2. 何を専用化するのか?

現在のWeb環境(リッチクライアント)

現在のWeb環境(リッチクライアント)のイメージ

プログレッシブ・エンハンスメント

ブラウザのイメージ


IE6 IE7 IE8 IE9 Firefox Safari Chrome
情報
デザイン・インタラクション × ×

プログレッシブ・エンハンスメント事例

事例:明治大学

http://www.meiji.ac.jp/cip/english/sports/

プログレッシブ・エンハンスメント 決定しなければならないこと

ブラウザのイメージ


IE6 IE7 IE8 IE9 Firefox Safari Chrome
情報
デザイン・インタラクション × ×

決定しなければならないこと

IE6~8に関して

リッチクライアント対応

リッチクライアント対応のイメージ

ユーザインタフェースとコンテンツを分離できる場合、コンテンツをXMLで持つことによりUIテクノロジーや仕様に関係なくリッチクライアントをCMS化できます。

XMLコンテンツをFlash、Ajax、HTML5などの異なったUIテクノロジーに配信し、ワンソース・マルチユース化することも可能です。

リッチクライアントのCMS化

リッチクライアントのイメージ

HTML5、Flash、AjaxのXMLデータ管理

事例:国立音楽大学
事例:国立音楽大学

HTML5、FlashやAjaxなどの外部XMLを管理できるCMSを選択
これまで難しかった追加・更新が誰でもCMS上から行えるようになります。

リッチクライアントのCMS化事例

事例:法政大学

法政大学

事例:国立音楽大学

国立音楽大学

事例:ウシオ電機

ウシオ電機

リッチクライアント対応CMSの将来像

リッチクライアント対応CMSの将来像のイメージ

http://jsdo.it/event/svggirl

SVGで制作され色やテキストをカスタマイズできることでも話題になったSVG Girl
このようなWebサイトもユーザインタフェースとコンテンツを分離することでCMSで更新することが可能です。

リッチクライアント対応CMSの将来像

リッチクライアント対応CMSの将来像のイメージ

今後、冷蔵庫や車にWebが繋がったとしてもユーザインタフェースとコンテンツを分離しておけば、CMSで更新できるはず?

リッチクライアントのCMS化 決定しなければならないこと

リッチクライアントのイメージ

HTML5、Flash、AjaxのXMLデータ管理

事例:国立音楽大学
事例:国立音楽大学

決定しなければならないこと

HTML5、FlashやAjaxなどの外部XMLを管理できるCMSを選択すること

現在のWeb環境(ソーシャルメディア連携)

現在のWeb環境(ソーシャルメディア連携)のイメージ

CMSでできるソーシャルメディア連携

自社サイト内で

自社サイト

ソーシャルメディア内で

ソーシャルメディアのイメージ

Web CMSでできるソーシャルメディア連携は2種類

CMSでできるソーシャルメディア連携(自社サイト内)

CMSでできるソーシャルメディア連携(自社サイト内)

参考:法政大学

http://www.hosei.ac.jp/

CMSでできるソーシャルメディア連携(SNS内)

Facebookページ上で

参考:xyz Facebook

CMSでできるソーシャルメディア連携(SNS内)

参考:武雄市Facebookページ
参考:レイアウト変更後の武雄市Facebookページ

横幅が固定だった為にFacebookページのタイムライン化に伴いレイアウト変更を行なっている。

CMSでできるソーシャルメディア連携(SNS内)

固定幅のイメージ

固定幅の場合、オーバーした分は横スクロールしないと表示されない

幅可変のイメージ

レスポンシブWebデザインの場合、横幅にあったサイズに自動的に縮小される

レスポンシブWebデザインでWebサイトを制作した場合、Facebookページでも横幅が自動的に縮小されてそのまま使用できます。 今後、mixi、google、Yahoo、twitterで同様のiframe企業サイト制作が可能になった場合もそのまま使用できます。

CMSでできるソーシャルメディア連携

参考:ユニクロWebサイト

CMSを導入してもこのようなことができるわけではありません。

CMSでできるソーシャルメディア連携 決定しなければならないこと

自社サイト内で

自社サイト

ソーシャルメディア内で

各ソーシャルメディア

決定しなければならないこと

実はCMSより圧倒的に重要です。但し、自社サイト内でできるソーシャルメディア連携が可能かどうかはしっかり確認しましょう。

現在のWeb環境(SEO対策)

Web Meister

SEO対策の基本

SEOmoz - 検索マーケティングのニュース&テクニック
SEOに関するきわめて重要な4つのインフォグラフィック

SEO戦略の位置づけ

http://web-tan.forum.impressrd.jp/e/2009/09/10/6473

SEO対策の項目は全て明らかになっています。

SEO対策の基本

SEOmoz - 検索マーケティングのニュース&テクニック
SEOに関するきわめて重要な4つのインフォグラフィック

サイトをSEOフレンドリーにする作業手順

http://web-tan.forum.impressrd.jp/e/2009/09/10/6473

SEO対策の基本

More Access,More Fun!

http://www.landerblue.co.jp/blog/?p=2481

Googleの考える「いいサイト」は、

  1. きちんと更新されていて、
  2. ページが増えていて、しかも内容がオリジナルで、
  3. アクセスも増えていて、
  4. みんなが凄いといって紹介してくれていて
  5. 小ずるいことしていない

CMSでできるSEO対策 決定しなければならないこと

SEOmoz - 検索マーケティングのニュース&テクニック
SEOに関するきわめて重要な4つのインフォグラフィック

SEO戦略の位置づけ

http://web-tan.forum.impressrd.jp/e/2009/09/10/6473

決定しなければならないこと

SEO対策の内容が公開されているCMSを選ぶこと
CMS独自の秘密の対応策は存在しません。SEO対策の実施内容は確認することができます。
ブラックなことをしていないか、ホワイト高品質のものでCMSが行うべきものが抜けていないか確認しましょう。

Web Meister の SEO対策

SEOmoz - 検索マーケティングのニュース&テクニック

重要度 内容 対策
1 検索エンジンに特化したプロトコル(robot.txt、XMLサイトマップ、ウェブマスターツール) sitemap.xmlを自動生成
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url><loc>http://www.web-meister.jp/NEWS/press/20081001.html</loc>
<lastmod>2009-06-04T17:45:28+09:00</lastmod></url><url>・・・繰り返し・・・</url></urlset>

最終更新時間が記述される仕様になっていますので検索エンジンにインデックスされる時間が短縮されることになります。
2 垂直検索向けSEO(フィード作成、垂直検索サイトへの登録など)
RSS
RSS 1.0 RDF Site Summary
RSS 2.0 Really Simple Syndication
Atom
上記規格に対応。ニュースを自動的に配信
3 正規化(リダイレクト、URL正規化タグなど)
正規化イメージ
googleやYahoo!、MSNなど検索エンジン各社も、URL正規化タグをサポートすることを発表
URL正規化タグ「rel="canonical"」を正規バージョンと複製バージョンに自動生成
4 メタデータ(meta directionタグ、meta keywordタグ、ジオタグ) 共通部分をXMLで一括管理。1か所変更すれば全ページに反映
<variable value=":XML CMS(コンテンツ管理システム)-Web Meister(ウェブマイスター)" name="site_label" />
<variable value="W3C の理想を体現するXML CMS「Web Meister」は、コンテンツの再利用ができるWeb CMS(コンテンツ管理システム)です。" name="site_description" />
<variable value="Web CMS,XML CMS,CMS 制作,CMS 導入,コンテンツ管理システム,ウェブマイスター,Web Meister,株式会社サイズ" name="site_keywords" />

現在のWeb環境(多言語対応)

Web Meister

多言語対応のポイント

決定しなければならないこと

Webサイト構造が同一で多言語展開する場合、次の手法が使えます。

多言語サイトの制作方法

多言語サイト制作フロー

日本語版を元に環境を構築、翻訳したテキストを取り込むことで完成。
デザイントーンの統一、制作時間の短縮が可能

多言語対応事例

事例:ウシオ電機

ウシオ電機

事例:THK

THK

Web CMS選択術-2012 まとめ

マルチデバイス対応 汎用+専用

  1. どのように汎用化するのか?
  2. 何を専用化するのか?

プログレッシブ・エンハンスメント

IE6~8に関して

リッチクライアントのCMS化

HTML5、FlashやAjaxなどの外部XMLを管理できるCMSを選択すること

Web CMS選択術-2012 まとめ

CMSでできるソーシャルメディア連携

実はCMSより圧倒的に重要です。但し、自社サイト内でできるソーシャルメディア連携が可能かどうかはしっかり確認しましょう。

CMSでできるSEO対策

SEO対策の内容が公開されているCMSを選ぶこと
CMS独自の秘密の対応策は存在しません。SEO対策の実施内容は確認することができます。
ブラックなことをしていないか、ホワイト高品質のものでCMSが行うべきものが抜けていないか確認しましょう。

多言語対応のポイント

たくさんあるのでご相談ください。

Web Meister の特長

Web Meister

ここまでの話は「Web Meister」で実現可能です。
さらにHTML5対応が可能な理由をお話しします。

製品コンセプト

W3C の理想を体現する HTML5 CMS - Web Meister

W3Cのホスト機関である慶應義塾大学湘南藤沢キャンパスに導入するために開発。 W3Cが提唱するXMLに基づくアーキテクチャーで開発を行い、ユーザインターフェースとコンテンツの分離、コンテンツの構造化を実現。そのため、HTML5対応の条件となるHTML5リッチインタフェース対応、HTML5セマンティクス対応が可能です。

高度な知識がなくても、今後のWeb環境の変化にも柔軟に対応できるCMSです。

Web Meisterのコンセプト

HTML5対応CMSの条件

HTML5

HTML5の利用もいよいよ本格化してきました。それに伴ってHTML5で制作したコンテンツ管理がこれから重要になってくると思われます。それではHTML5を管理できるCMSとはどのようなCMSでしょうか?

  1. HTML5リッチインタフェース対応
  2. HTML5セマンティクス対応

がその条件となります。

HTML5リッチインタフェース対応

リッチクライアント対応のイメージ

HTML5関連技術ではcanvasタグ+JavaScript、SVGなどによってFlashのような動きのユーザインタフェースを実装することが可能です。 これらのHTML5によるリッチインターフェースをCMS化にする為には更新に関わる部分を外部ファイルとしてXMLなどで持つことが有効です。 特にSVGはSVG自体がXMLでできています。 つまり、ユーザインタフェースとコンテンツを分離し、コンテンツをXMLで管理し更新できるCMSである必要があるということになります。

HTML5セマンティクス対応

HTML5ではHTML4の文書構造やコンテンツの意味づけとは違うタグを設置する必要があります。 文書構造では記事全体 article タグとその一部分 section タグが存在します。 コンテンツの粒度がページ単位から記事内の一部分 section にまで細分化されることになりました。 そのため、CMSにおいてもコンテンツの粒度がページ単位ではなく section 単位で扱える必要があります。
Web Meister は元々コンテンツの粒度がページ単位ではなく section 単位となっています。 見出し・本文・画像という1セットがコンテンツの最小単位となっており、これが集合することで記事を構成します。 動的テンプレートによって header footer nav aside が自動生成されページとなります。

Web Meisterインターフェース

リニューアルのポイント

CMSのイメージ

単なるCMSベンダーではできないWebインテグレーションを提供。
御社にふさわしいデザイン、情報設計を元にコンテンツを継続的に発展させていくWeb環境を提供します

Web Meister のユーザインターフェース

マニュアルを必要としない操作性

『Web Meister』のインターフェースは、「マニュアルを必要としない使いやすさ」を目指して開発されています。 メールソフトと同じ3ペイン構造から成り、コンテンツの編集や変更は簡単に行なうことができます。

また、公開されているページデザイン上でコンテンツの編集が行えるWYSIWYG エディタ(見たままのものが反映される)や、 リッチテキストエディタによって HTML の知識がなくてもオフィスが扱えればどなたでも利用可能

3ペイン構造のインターフェース

情報設計を自動生成する動的テンプレート(Webページ)

一般的な下層(記事)ページレイアウト

レイアウトテンプレートイメージ

情報設計を自動生成する動的テンプレート(Webページ)

情報設計テンプレートイメージ

情報設計を自動生成する動的テンプレート :事例

メニュー、パンくずリスト、ニュースの自動生成

パンくずリスト、ローカルメニュー、バックナンバーを自動生成

設定したルールに従って自動生成
サイト構造を気にすることなくページを作成できる

情報設計を自動生成する動的テンプレート :事例

ページ(ディレクトリ・XMLモジュール)の共有・一元管理

自動生成の例1
自動生成の例2

コピーペーストで同一ページを違うカテゴリ(導線)で表示・共有管理
目的やターゲットに合わせたユーザビリティと一元管理を実現

HTML5 CMS - Web Meister 主な実績

大学サイトの制作実績 : 慶應義塾大学湘南藤沢キャンパス

慶應義塾大学湘南藤沢キャンパスはMIT、ERCIMと共にW3Cのホスト機関として、世界のWebサイトをリードしていく立場にあるキャンパス。

事例:慶應義塾大学SFC
事例:慶應義塾大学SFC

XMLで全てのコンテンツを管理するCMS(Web Meister)を構築
スタイルシートでデザインパターンを3つに分けて表示することが可能であり、ユーザーの好みに合わせたクリエィティブを表現。

W3C仕様への準拠

大学サイトの制作実績 : 慶應義塾大学湘南藤沢キャンパス

Web Designing

Web Designing 2011年6月号
毎日コミュニケーションズ

特集1 : Webクリエイティブの10年 ?記憶に刻むべき21世紀最初のディケード? 誌面を彩ったサイトで振り返る10年「あらためて振り返る、“新しさ”を作りだしたサイト」

弊社、糟谷・山本が2004年に制作した慶應義塾大学 湘南藤沢キャンパスが掲載「CSSを実装し、スイッチでデザインを切り替えられる仕組みを採用して話題となった。 CSSレイアウトの利点を目で見える形で示した日本で最初の試みだと言ってもいい。」

大学サイトの制作実績 : 国立音楽大学

各時代における音楽文化を担う人材を多数世に送り出してきた音楽大学

事例:国立音楽大学

  • Flash、AjaxのファイルデータをCMS上で管理、自動生成
  • PCサイト→モバイルサイトのワンソース・マルチデバイス
  • 目的別(カテゴリ)とユーザー別に導線を確保、一元管理
  • キーワード・ディスクリプション、ファイルアイコンなど自動生成
  • CMS(Web Meister)の導入

大学サイトの制作実績 : 法政大学

「自由と進歩」を基礎に、15学部を擁する日本有数の総合大学

事例:法政大学

  • ソーシャルメディア連携
  • Flash、AjaxのファイルデータをCMS上で管理、自動生成
  • 目的別(カテゴリ)とユーザー別に導線を確保、一元管理
  • キーワード・ディスクリプション、ファイルアイコンなど自動生成
  • CMS(Web Meister)の導入

大学サイトの制作実績 : 法政大学

Web担当者Forum

Web担当者Forum
震災時でも休むことなく情報発信を続けられた、スキルを問わずだれでも使えるCMS/法政大学+Web Meister
http://web-tan.forum.impressrd.jp/e/2011/09/08/10699
CMS関連の人気記事1位になりました!(2011/09/09~23)

企業サイトの制作実績 : ウシオ電気株式会社

事例:ウシオ電気株式会社

企業サイトの制作実績 : THK株式会社

事例:THK株式会社

本日はありがとうございました。

xyz corporation

株式会社サイズ xyz corporation

糟谷博陸

代表取締役 糟谷博陸