2015年2月2日　ビジネスセミナーの資料です。

1. 2015年2月2日
シックス・アパート株式会社
長内 毅志
アクセシブルなウェブサイト構築と
CMSの活用

2. 自己紹介
–2011年～ Movable Typeプロダクトマネージャー
–2014年～ ディベロッパーリレーションマネージャー
エバンジェリスト
–趣味 ダンス (ストリート、ジャズ)
ジョギング (サブフォー)
英語の勉強 (TOEIC 875, 英検準1級)
家族と過ごすこと

3. アジェンダ
•アクセシブルなウェブサイトを構築する
にあたって、CMSができること
•Movable Type の最新情報

4. WCGA 2.0
JIS X 8341-3:2010
Indie UI
WAI-ARiA
WebVTT
HTML5 Recommendation

5. ノウハウについて語るセッションではありません
ノウハウを

6. 今日の話を一言で表すと
•コンテンツとデザインを分離し、蓄積したコ
ンテンツを時代に沿った形で提供する

7. アクセシブル=情報へのアクセスが可能であること

8. アクセシビリティの定義
•そのウェブページが、高齢者や障害者も含
めた、誰もが情報を取得・発信できる柔軟
性に富んでいて、アクセスした誰もが同様
に情報を共有できる状態にあること
• Wikipedia

9. CMSのイメージ

10. CMSができること
•更新が楽になる？
•自動更新を実現する仕組み？
•たしかにそれもある

11. CMSの仕組み
•コンテンツはデータベースに存在
•テンプレートでデザインを定義

12. CMSの重要なメリット
•コンテンツとデザインを分離できる

13. つまり
•コンテンツとデザインを分離することで、時
代に沿った形で情報を出力することができ
る

14. ネットは有用な情報の宝庫

15. 「コンテンツ」が重要

16. 例

17. 総務省発表の「情報通信白書」
•総務省が情報通信の分野における産業の
現況や政策の動向などを取りまとめて年
次で刊行している文書
•IT系の統計データに取って、信頼できる貴
重な情報の宝庫

18. 例

19. メトロポリタン美術館
•膨大なコレクションをオンライン上で検
索、閲覧可能
•スマートフォン閲覧にも対応

20. •積み重なった情報=貴重なコンテンツ
•年月を経るほど、有用性は高まる

21. 問題点

22. 閲覧環境は変化する

23. 2008/10/3 日経「スマートフォンは売れるのか」
http://www.nikkei.com/article/DGXZZO10913560S0A710C1000000/

24. 参考:閲覧環境の変化
• 出典：株式会社MM総研 http://www.m2ri.jp/newsreleases/main.php?id=010120130328500

25. 未来の予想はむずかしい
•10年前(2004年)
–IEのシェア90%以上
–ドコモのiモード絶好調
•5年前(2009年)
–2007年iPhone登場、2008年に日本発売
–「スマホは売れるのか?」

26. 「レスポンシブデザイン」というキーワード

27. •5年前、10年前にスマホの普及を予想
できた人はいますか?
•スマホ向けのウェブ技術の予想ができ
た人は？

28. 未来は予測可能か

29. 2018年 デバイス毎のデータ流量の「増加率」
0%
20%
40%
60%
80%
100%
120%
モバイル データ トラフィックの予測（2013 ～ 2018 年の CAGR）
スマート
フォン
タブレット
PC
ノート
PC
M2M
(ウェアラブル)
シスコシステムズ「全世界のモバイル データ トラフィックの予測、2013 ～ 2018 年アップデート」より
http://www.cisco.com/web/JP/solution/isp/ipngn/literature/white_paper_c11-520862.html

30. ウェアラブルコンピュータ

31. •5年後のデバイス、
デザインを予想するのは
非常にむずかしい

32. •アクセス環境はどのように変化する
か分からない
•アクセシビリティの方法論は変わる

33. If もしも
•ページ数が数千-数万に及ぶコンテ
ンツ
•最新のデバイス向けにリニューア
ルを行う必要が出たら？

34. 数万ページを手作業でリニューアル？

35. •蓄積された情報が多いほど、リニューアル
コストは比例的に増加する

36. コンテンツとデザインが分離していれば
•デバイスに応じたテンプレート設定

38. CMSができること
•コンテンツとデザインを「分離」
•コンテンツを時代にそった方法で
アクセシブルな形で「提供」する

39. 決して新しい発想ではない

40. ここまでのまとめ
•コンテンツとデザインを分離することで、閲
覧環境の変化に備え、情報をアクセシブル
に提供することができる
•そのために、CMSは有用である

41. Movable Type の Data API

42. CMSの基本構造
DB
管理画面からデータ入力
テンプレートに従ってデータ出力

43. APIの利用
DB
管理画面、テンプレートを使わず
データの入出力できる
API API

44. 拡張性に富む
•開発言語を問わずデータ出力
•管理画面をつかわずデータ登録

45. Data API
•REST形式でMTのデータを入出力
–GET https://your-host/your-mt-api.cgi/
v1/sites/{blog_id}/entries
•MTの認証をつかうため、新たに認証シ
ステムをつくる必要がない
•コンテンツの可搬性

46. ウェブに限らず、あらゆるコンテンツを管理
ウェブサイト
スマホアプリ
Webサービス

47. Data APIの活用例
http://makanai.sixapart.jp

48. Data APIの活用例

49. Data APIの活用例
•COACH UNITED

50. Movable Type 最新情報

51. 最新バージョン
Movable Type 6.0.6

52. パフォーマンス改善

53. 5つの新機能
•Data API
•Chart API
•非公開日指定
•Google Analyticsとの連携
•メッセージセンター

54. Google Analyticsの連携
• Google Analyticsと連携してアクセスデータをダッシュ
ボード上に表示

55. JSONデータで取得可能
•JSON形式でデータを取得可能
•PHP、JavaScriptなどで任意の形で
加工、利用

56. プラグイン
•more-analytics
https://github.com/miyanaga/
mt-more-analytics/
• MITライセンス
• 近日商用版リリース予定

57. レスポンシブウェブデザインテーマ
•Rainier
–ブログ向けテーマ
•Eiger
–企業サイト向けテーマ

58. Apex
•追加テーマ「Apex」
http://plugins.movabletype.jp/movable_type/apex.ht
ml

59. RainierとEiger、Apexのライセンス
•MITライセンス(オープンソース)
–自由にカスタマイズ、再頒布可能
–ビジネス利用も可能、オープンソース頒布も

60. カスタマイズ例
http://plugins.movabletype.jp/drk7jp/seo-tuning-eiger.html

61. 5.Xの機能も引き継いでいます
• スマホ対応の管理画面
• 定型文機能
• PSGI対応
• セキュリティ強化機能
–連続した不正アクセスユーザーのIDをロックアウトする
–パスワードポリシーの設定変更
• リスティングフレームワーク

62. Movable Type のラインアップ
•Movable Type
•Movable Type クラウド
•MovableType.net

63. Movable Type クラウド版
•クラウド環境でMTを提供
•サーバー保守、メンテナンスはシックス・ア
パートが担当
•月額5000円～

64. サーバー配信機能
•外部サーバーへhtml送信
•ステージング構成が簡単

65. バックアップ機能
•1日に1度データをバックアップ
•いつでも復旧可能

66. 2つの新機能
•IP制限
–管理画面、公開サイトへのアクセス制限が可能
•マルチドメイン対応
–S4i、S4g以上、10ドメインまで利用可能

67. MovableType.net
•Webサービス型CMS
•カスタムフィールドが利用可能
•GitHub上のテーマと連携可能
•低価格(2500円/月～)

68. パブリックベータ絶賛公開中

69. 自由度低
(ウェブサービス型)
高
(ソフトウェア型)
手軽さ
複
雑
容
易

70. MT on AWS
•AWS marketplace で提供
•microインスタンスは無料(
AWS使用料別)

71. MTコミュニティとイベント

72. •MT蝦夷
•MT東北
•MT東京
•MTなごや
•MT関西
•MT広島
•MT福岡
•MT長野

74. MTDDC Meetup TOKYO 2014

75. MT Live
•今日明日、 TAM Coworking で開催！

76. まとめ
• アクセシブルな情報の提供のため、コンテン
ツとデザインを分離する
• コンテンツの可搬性を重視し、ネット環境の変
化に対応する
• Movable Typeは上記をカバーした、10年以上
の実績があるパブリッシングプラットフォーム