More Related Content
Similar to MTDDC Meetup FUKUSHIM 2010プレゼン資料
Similar to MTDDC Meetup FUKUSHIM 2010プレゼン資料 (20)
MTDDC Meetup FUKUSHIM 2010プレゼン資料
- 1. 僕が Movable Type を
使うようになった理由
MTDDC Meetup FUKUSHIMA 2010
2010 年 11 月 6 日土曜日
蒲生トシヒロ
- 2. 2
本日の Agenda
1. 自己紹介
2. すべてはユーザーのために
3. インターネットの進化と共に歩む、
Movable Type
4. Movable Type 5.0 VS WordPress 3.0
5. その他お勧め CMS
6. HTML5 への対応
7. 僕が Movable Type を使う理由
8. 明日の主役はあなた
- 3. 3
自己紹介
蒲生トシヒロ( Dakiny )
岐阜県岐阜市生まれ
職種: Web プロデューサー、プランナー
15 年間広告代理店に勤務、でディレクター、プランナー
を行い、 1995 年マルチメディア事業部を立ち上げイン
ターネットの世界に入る。 1999 年独立。 2001 年より有
限会社 IT プロフェッショナルを設立、主に Web 制作を営
み今日に至る。
最近は書籍の企画編集に力を入れてます。
MT 歴は 3.15 から。以来 Movable Type の布教活動になる
ことを公私を問わずやってます。
- 4. 4
関わった書籍
Movable Type 5
実践テクニック(共著)
監修:シックス・アパート株式会社
ソフトバンククリエイティブ
2010 年 3 月 26 日発売
インターネット &Web の
必須常識 100 (共著)
ワークスコーポレーション
2009 年 10 月 20 日発売
Movable Type プロフェッ
ショナル・スタイル
MT4.1 対応(共著)
毎日コミュニケーションズ
2008 年 4 月 8 日発売
- 5. 5
ブログ& SNS
世界中の 1% の人々へ
http://www.dakiny.com
Twitter
http://twitter.com/Dakiny
DM※ か @Dakiny でリプライいた
だけでばもれなくフォローします。
Facebook
http://www.facebook.com/
toshihiro.gamo
E-mail
gamo@it-pro.co.jp
- 8. 8
1997 年 Dremwever 登場。
1997 年 12 月、マクロメディア(現 Adobe )から、
高機能 HTML エディター、 Dremaweaver 販売開始
。
それ以前は、テキストエディタで手打ちするしかな
かった、 Valid な HTML なサイトが制作可能になる
。
使い物になったのは 1998 年 12 月に出た、 Ver2 か
ら、 GoLive とならんで Web 制作のスタンダード
ツールに。
それでも、 Web の更新作業は HTML エディタが使え
ない人々にはできる作業ではなく、更新は Web 制作
会社に頼むしかなかった。
- 11. 11
2004 年 XOOPS を知る
XOOPS は誰もが無償で利用できる OpenSource なの
で、
…制作コストは一気に下がったが
デザインされた HTML をそのまま出力するのが困難
SEO は考慮されてない
肝心の必要な機能がとぼしく、その部分は PHP で
制作するしかなく、外部に依存
更新管理がわかりづらくマニュアルを製作するも、
担当者が交代するごとに質問が来る
結局、外注コストが若干下がっただけで機能的には、
まったく満足できるものではなかった
- 12. 12
2005 年 3 月
Movable Type と出会う
最初にさわった Movable Type は 3.15
デザインが自由。 HTML にタグを入れるだけでシス
テムが完成
価格は約 3 万円と妥当なもの
システムを知らない僕にも出来た!
更新が簡単(ブログが使える人なら誰でも)
これは Dreamweaver のように、 Web クリエイター
のスタイルを変えると確信した
※もっとも、当時は誰にも信じてもらえなかった ^^;;
- 13. 13
リッチテキストエディタ
TinyMCE for MT の開発
以後、 Movable Type を使うようになったが、
リッチテキストエディタがなかったので、
ブログ記事の更新は HTML がわかる人にはできない
。
そこで、まずは Movable Type で利用できる
リッチテキストエディタを探した。
TinyMCE を Movable Type で利用するプラグインが
見つかったが日本語環境での利用はうまくいかず、
改造して公開。
オリジナルコードによる TinyMCE for Movable Type
へと発展する。
- 14. 14
リッチテキストエディタは
、 CKEdditor へと続く
TinyMCE for Movable Type は、大ヒットとな
り、 25000 本のダウンロードを記録したが、
Movable Type 4.0 で大きく構造が変わったため、
自社ではスキル不足で開発を断念。
MT4.1 時に、米シックス・アパートの中の人が
FCKeditor のプラグインをリリースしたので、
日本語ローカライズして公開。
MT5 では、 ToI 企画の天野さんの協力で
FCKeditor の後継である CKEditor を利用して
CKeditor for Movable Type を公開。
今日に至る。
- 15. 15
Movable Type お勧め理由
1. プログラム言語を知らなくても、カタログサイト等の高機能
な Web サイトが作れる。
2. HTML とシステムの分離によりデザインが自由。
3. 更新が簡単。ブログ感覚で更新ができる。
4. ファイルの静的生成と動的生成 2 種類が選べる。
5. 出力ファイル形式が豊富。
6. 仕事に役立つプラグインが多い。
7. たいていのサーバーが対応している。
8. Web や書籍等の情報が豊富。
9. コミュニティが充実している。
10. 管理は簡単なので納品後のサポートが楽。
- 18. 18
2001 年
Movable Type はアメリカで 2001 年 10 月にトロッ
ト夫妻 ( ミナ&ベン・トロット)によって作られた。
それまでのブログシステムに満足できなかった二人
は自分達で満足のいくブログシステムを作ろうとし
たのが Movable Type の歴史の 始まり。
この年、 PHP-Nuke を元に日本人により開発した
XOOPS も発表された。
8 月 27 日 Internet Explorer 6 リリース
10 月 8 日 Movable Type 1.0 リリース
- 19. 19
2002 年
Movable Type2.5 で日本語版を含め国際化対応し
ブロガーや先進的なユーザーが利用し出す。
MySQL や PostgresSQL を利用したオリジナル CMS
による Web が増えてくる。
3 月 20 日 Movable Type 2.0 リリース
8 月 1 日 W3C より XHML1.0Second Edition 勧告
発表
10 月 8 日 Movable Type 2.5 リリース
- 21. 21
2004 年
Web JIS が発表され、
アクセシビリティが話題となった年。
3 月 3 日 mixi オープン
5 月 13 日 Movable Type 3.0 発表
6 月 21 日 Web アクセシビリティを規定した日本
工業規格 (JIS) が交付
9 月 15 日 アメーバーブログ、サービス開始
11 月 9 日 Mozilla Firefox 公開
- 22. 22
2005 年
Web JIS が発表され、アクセシビリティが話題と
なった年。首都圏では XOOPS 人気が高まる。
7 月 4 日 『 Web 標準の教科書(益子 貴寛著)』発
売
10 月 20 日 CSS Nite 誕生
12 月 3 日 アドビシステムズが約 34 億ドルでマク
ロメディアを買収完了
12 月 5 日 韓国最大の SNS 、 Cyworld 日本語サー
ビス開始
※日本中を制覇すると勢いはよかった
- 23. 23
2006 年
mixi ブレイク!利用者が 700 万人に増える。
Web 標準の高まりにつれて XOOPS 人気下降、
W3C 準拠のテンプレートを持つ Movable Type のコ
ンテンツが一気に増えた年でもある。
7 月 Twitter スタート
7 月 26 日 『 Web 担当者フォーラム』スタート
9 月 25 日 TinyMCE for Movable Type 公開
※ OpenSource で公開したため、 Movabele Type で利用できる
リッチテキストエディタのスタンダードになった。
11 月 2 日 Internet Explorer 7 リリース
- 24. 24
2007 年 7 月まで
Movable Type 4.0 が誕生した年。
知識人の間にマイクロ・ブログブームが起こり
「ブログの時代は終わった」という言葉が流行る。
※発言が間違いであることはその後の歴史が証明する。
3 月 1 日 米国 Davidville.inc により Tumblr (タン
ブラー)スタート
5 月 20 日 mixi 利用者 1000 万人
6 月 22 日 Adobe Creative Suite 3 発売
- 25. 25
2007 年 8 月以降
7 月 28 日 第 14 回 WebSig24/7 会議開催(特集
Movable Type )
8 月 8 日 Movable Type 4.0 公開
9 月 29 日 第 16 回 WebSig 会議開催(大阪)
10 月 1 日 mixi リニューアルし CSS に対応
IE5.5 以前のブラウザに見切りをつける
11 月 Power CMS for MT 発売開始
12 月 12 日 Movable Type Open Source 公開
- 26. 26
2008 年 4 月まで
Movable Type 4.1 リリース。
商用 CMS としてブレイクした年!
国内の開発者が一気に増え、
主要プラグインも出そろった。
1 月 22 日 W3C より HTML5 の草案発表
1 月 24 日 Movable Type 4.1 公開
4 月 5 日 CSS Nite MT4LP5 開催
ベルサール原宿に 400 名の人間を集めて開催された大イベント
4 月 8 日 マイコミより『 Movable Type プロフェッ
ショナル・スタイル MT4.1 対応』発売
- 27. 27
2008 年 5 月以降
5 月 30 日 Movable Type 4.2 公開
※大幅にテンプレート構成が変わり現在に継承される
6 月 29 日 Movable Type のリッチテキストエディ
タ、 TinyMCE-MTPlugin 0.1.9 公開
※ ToI 企画の天野さんの手によるもの
http://tec.toi-planning.net/mt/tinymce/
7 月 11 日 iPhone 3G 発売
12 月 12 日 Google Chrome 正規版リリース
12 月 19 日 Adobe Creative Suite 4 日本語版発売
- 28. 28
2009 年 6 月まで
シックス・アパート日本法人がイニシアチブを持ち
開発した Movable Type 5.0 発表。
日本中に Twitter がブレイク。
3 月 18 日 Movable Type 4.25 リリース
※ Motion テンプレートが登場
3 月 20 日 Internet Explorer 8 リリース
4 月 29 日 Twitter 日本語版サービス開始
6 月 19 日 iPhone 3GS 発売
6 月 27 日 CSS Nite LP, Disk 6 「 CMS リベンジ
編」開催
- 29. 29
2009 年 7 月以降
8 月 21 日 Twitter ブームの中、韓国最大の SNS 、
Cyworld ひっそりと撤退
11 月 9 日 CKEditor for MT 公開
11 月 26 日 Movable Type 5.0 公開
ブログ系 CMS から汎用 CMS へ大きく進化
高機能から誰でもできるがコンセプトに。
11 月 MTQ ( Movable Type 5 ユーザーコミュニ
ティ)公開
12 月 12 日 MTDDC Osaka 開催
MTDDC ( Movable Type Developers & Designers
Conference )のはじまり。
- 30. 30
20010 年 6 月まで
クラウド、 ePub 、 jQuery 、 HTML5 + CSS3 、
WordPress 、 Facebook が話題になった。
2 月 5 日 MTDDC Tokyo 開催
3 月 29 日 雑誌としての『 web creators 』休刊
4 月 14 日 mixi 利用者 2000 万人
5 月 8 日 日本で iPad 発売
5 月 28 日 Adobe Creative Suite 5 発売
5 月 29 日 WordCamp Yokohama 2010 開催※ 400
人を集め話題になる
- 31. 31
20010 年 6 月以降
6 月 9 日 MT コンテスト 2010 開催
6 月 9 日 スマートフォンの所有率、全国平均の
12.7 %に対し首都圏では 33.9 %
6 月 15 日 WordPress テーマコンテスト開催
6 月 22 日 WordPress 3.0 発表
6 月 24 日 iPhone 4 発売
7 月 31 日 MTDDC TOKYO テーマ編開催
8 月 20 日 『 JIS 規格ウェブコンテンツ( JIS X
8341-3:2010 )』改正
- 32. 32
20010 年 10 月以降
10 月 25 日 SOY CMS2 ベータ公開
10 月 30 日 WordCamp Nagoya 2010 開催
11 月 6 日 福島件郡山市にて『 MTDDC Meetup
FUKUSHIMA 2010 』開催
※ユーザー主体初の MTDDC として、ビッグパレットふくしま
に約 80 名の参加者を集め、成功に終わる。
- 33. 33
さて 20011 年は?
あくまでも予測ですが、 XHTML に代わり
HTML5 + CSS3 + jQuery が Web のトレンドになる。
CMS はさらに混戦が進み、勝ち組負け組が明確に。
消える CMS も多いが Movable Type は安泰。
3 月(推測) Movable Type 5.1 公開
3 月(推測) 『 Movable Type 5.1 プロの現場の仕
事術 ( 仮題 ) 』毎日コミュニケーションズ発売
5 月 22 日 HTML5 ラストコール
草案から勧告候補へ。正式勧告は 2012 年 3 月の予定。
- 34. 34
Movable Type 5. 0 VS
WordPress 3.0
いずれもブログから進化した CMS である
いずれも大きなシェアを持つ
出来ることはほぼ同様
使いやすさもほぼ同じ
どちらが優れているかという判断はしない
以下では客観的に比較をしてみます
- 35. 35
WordPress との比較 1
Movable Type WordPress
ライセンス 商用ライセンス OpenSource
GPL
価格 63,000 円 無料
システムの管理団体 シックス・アパート
株式会社
WordPress
Foundation
Automatic※ 社が中
心に設立
日本語化対応 ◎ ◎
- 36. 36
WordPress との比較 2
Movable Type WordPress
データベース MySQL
PostgreSQL
MySQL
SQLite
※ プラグイン導入による
HTML と
システム分離
◎100% ○ 一部未対応
ブログ機能 △
※ ウェブサイトではブロ
グ制作不可
○
複数ブログ機能 ○ 比較的簡単 △ やや面倒
- 37. 37
WordPress との比較 3
Movable Type WordPress
SEO ○ 標準機能 ○ 標準機能
カテゴリー機能 ○ ○
フォルダ機能 ○ ○
タグ ○
カテゴリ、フォルダと同
一名称が利用でき
る。 URL はシステムによ
る自動生成
◎
カテゴリ名、フォルダ名
と同一名称は利用できな
い。 URL は /tag/ で表示さ
れる
ファイル名の自由度 ○ 英数字のみ ◎ 日本語ファイル名
対応
- 38. 38
WordPress との比較 4
Movable Type WordPress
テーマの数 × 数十種類 ◎ 約 2 万種類
公式サイトには約 1000 種
類
テーマの作り方 ◎ △ やや困難
プラグインの数 ○ ◎ 約 2 万 5 千
公式サイトには約 1400 種
類
プラグインの作り方 ○Movable Type はオ
ブジェクト指向
◎WordPress は非オ
ブジェクト指向
※セキュリティはプラグ
インに異存する
- 39. 39
WordPress との比較 5
Movable Type WordPress
静的生成と動的生成 ○ いずれも対応 △ 動的生成のみ
出力形式 ◎
HTML 、 PHP 、 XML 、 R
SS 以外に
も、 SVG 、 EPS 、 ePub
等多種対応
×
基本は PHP ( PHP の機
能で XML 、 RSS 等を出
力)
- 41. 41
WordPress との比較 7
Movable Type WordPress
対応サーバー ◎
ほとんどのサーバーが対
応
◎
ほとんどのサーバーが対
応
サーバー負荷 ○
静的出力の場合
△
表示速度 ◎
静的出力の場合
△
他の PHP 系 CMS に比べ
ても遅い
再構築 有 無
- 42. 42
WordPress との比較 8
Movable Type WordPress
公式ドキュメント ◎
日本語によりもっとも充
実したドキュメントがあ
る
○
日本語化は進んでいるが
、完全ではなく英語力を
必要とする
フォーラム ◎
MTQ (公式)、 mixi
◎
WordPress.org (公式)
WordBench
Web 情報 ◎ 日本が世界一 ○ 海外が充実
書籍 ◎
初心者向から上級者向ま
で揃っている
○
本当の意味で制作現場向
けの本がない
- 43. 43
Movable Type 5. 0 VS
WordPress 3.0 結論!
どちらでもいい!
指定がない限り、どちらを使うかは人次第。 PHP に慣れてる
人は WordPress が使いやすいと思うだろう。
Movable Type はオブジェクト指向、 WordPress は非オブジェ
クト指向なので、小さなサイトは作りやすいが、大きなサイト
を作る時には苦労する。
WordPress は PHP を知らない人でもそこそこはできるが、カ
テゴリーサイト等の中規模(予算規模 100 万円)以上のサイト
を作る場合はかなりの PHP スキルを必要とする。
※ MT はプラグインで対応できる。
Movable Type はプログラム言語を知らない人でも中規模サイ
トまでは構築可能。ということでプログラム言語を知らない僕
は Movable Type を使ってます。
- 44. 44
その他お勧め CMS
海外での評価が圧倒的に高い Drupal 等、
CMS はいろいろあるが、日本語情報が少ないとか、
高度なプログラミング知識が必要であるとか、
一般的にお勧めできるものは少ない。
Movable Type や WordPress 以外でお勧めで
き、 Web 業界で SOHO に評価が高いのは純国産下
記 2 点。
SOY CMS
a-blog cms
- 45. 45
SOY CMS
オープンソース( GPL )
開発者:株式会社日本情報化農業研究所
Movable Type 同様、オブジェクト指向で作
られ HTML とシステムが完全分離されており
、 HTML のバージョンは問わない。
HTML がわかる人なら、もっとも簡単にス
タートできる CMS 。
URL : http://www.soycms.net/
- 46. 46
a-blog cms
商用ライセンス 52,500 円
開発者:株式会社アップルプル
プログラミング知識不要で、中規模サイト作
成を対象にしている。
管理画面の出来が素晴らしい。
セミナーを定期的に開催している。
URL : http://www.a-blogcms.jp/
- 50. 50
HTML5 対応について
HTML5 が話題です。
Movable Type は、
HTML とシステムの完全分離により、
より簡単に HTML5 に対応できる
数少ない CMS のひとつです。
※解説した( WordPress 、 SOY CMS 、 a-blog cms )も対応
可。
- 51. 51
HTML5 とは?
XHTML1.0 の規格に不満をもっ
た、 WHATWG ( Google 、 Apple 、 Mozilla 、 Ope
ra の中の人達が集まって作られた)によって提案さ
れた、 HTML4.01 の発展系である、より現実的な
HTML の規格。
WHATWG より W3C に提案があり、 W3C より
2008 年 1 月 22 日にドラフト(草案)が発表された。
来年にも準勧告になる。
※ WHATWG と W3C は連携して勧告に向けて動いています。
認識してほしいのは、下位互換であること。つまり
古いブラウザでも誤動作ません。 IE6 でも新しいタ
グは認識しませんが誤動作はしません。
- 52. 52
HTML5 のメリット
1. セマンテック!
SEO とアクセシビリティに効果が高くなる。
2. マルチブラウズ!
HTML5 は Microsoft や Adobe も巻き込み、新たな Web 標準
の規格となります。ブラウザを問いません。
3. スタイリッシュ!
CSS3 により Web はスタイリッシュに。
4. インタラクティブ!
Canvas 、 API 等、 JavaScript でよりインタラクティブに。
5. マネタイズ!
HTML5 は現在買い手市場。クリエイターに利益を生みます。
- 53. 53
HTML5 現在のステータス
Apple 、 Google 、 Twitter 等、
HTML5 で作られたサイトは日々増えています。
HTML5 Gallery
http://html5gallery.com/
Internet Explorer 9 は現在断トツの対応率
http://samples.msdn.microsoft.com/ietestcenter/
Dremweaver CS5 は HTML5 に対応
HTML5/CSS3 特設サイト
- AdobeR DreamweaverR CS5
http://adobe-html5.jp/
- 55. 55
セマンテックな要素は、
こう使えば IE6 でも大丈夫
Section 等のセマンテックな要素(ブロックレベル要
素)は、本来 HTML の見通しをよくするものなので
、レイアウトを指定する div として使わず、コメント
代わりに利用すれば目的も果たせて問題もなし。
<section>
<div id="section">
<h2>Example document</h2>
<p>Example document</p>
</div>
</section>
- 56. 56
JavaScript が IE6 を
HTML5 対応ブラウザにする
HTML5.js を利用すれば
新しい要素も有効になる
http://remysharp.com/2009/01/07/html5-enabling-script/
<!--[if lte IE 8]>
<script src="./js/html5.js"
type="text/javascript"></script>
<![endif]-->
- 57. 57
Movable Type で
HTML5 に対応するために
テンプレートを HTML5 で作る。
たったこれだけで HTML5 サイトになります。
但し、リッチテストエディタはその限りではない。
そのために来年早々にでも
CKEditor for Movable Type は
HTML5 対応とします。
MT5.1 公開にほぼ合わせて発売される書籍
『 Movable Type 5.1 プロの現場の仕事術 ( 仮題 ) 』
にも HTML5 について書きます。
ご期待ください。
- 58. 58
HTML5 参考サイト
W3C HTML5
http://www.w3.org/TR/html5/
WHATWG
http://www.whatwg.org/
Web 標準 Blog | メソッド | ミツエーリンクス
http://standards.mitsue.co.jp/
HTML5.JP
http://www.html5.jp/
html5-developers-jp
http://groups.google.com/group/html5-developers-jp
- 59. 59
Movable Type が
僕にもたらしたもの
1. 知名度
2. 仲間
3. 可能性
得られるモノは人それぞれです。僕の場合は Movable Type の
勉強会の開催を通じて、多くの頼れる仲間に出会いました。
本を出すことにより、 Web 業界とのつながりだけでなく、
出版社とのつながりもできて、次のステップが得られました。
Movable Type を真剣に取り組んでよかったと思います。
- 60. 60
技術は逆転勝利をもたら
す !
Web 標準や CMS の普及は Web 制作の現場に大き
な改革をもたらしました。 Web を作る上でプロ
デュースやディレクション、設計に関わる上流の
人々ですら技術への理解が必要となってきました。
技術が重視されることにより、現在の Web 業界は
、企業規模や学歴に関係なく努力した人が成功しや
すい世界になってきました。
新たに登場した人々の多くは技術者上がりです。
技術は仕事の上で逆転勝利をもたらします。
技術を大事にしてください。
- 63. 63
最後に、みなさんへ。
僕は Movable Type が大好きです。
1 人でも多くの MT ユーザーが増えると
いいなと思ってます。
これからも Movable Type の宣教活動を
続けていきたいと思ってますよ。
出来れば、一緒に仕事したり、勉強会やイ
ベントをやったり、本を出しましょう。
ご静聴ありがとうございました。