僕は僕でだれかじゃない

ビジネスとテクノロジーと健康についてあれこれ

MENU

CMS大阪夏祭り2016 参加レポート

f:id:sitk:20160904101553p:plain

f:id:sitk:20160813004057j:plain おはようございます。小畑です。

2016年9月3日(土)に、CMS大阪夏祭り2016が開催されました。今回で2回目だそうです。1回目知らんぞw

cms-fes.info

内容は下記の通り。

  1. 基調講演:運営スタッフに喜ばれる CMSの選び方 超入門
  2. フロントエンドとコンテンツ配信のミライ − Webはどう変わるか
  3. 座談会〜CMSとセキュリティの現場から
  4. マーケティング・オートメーションとCMS
  5. オーサリングツールとしてのCMSとWebアクセシビリティ

いずれも、内容の濃ゆいセッションでした。簡単に振り返ります。(長文になりましたので、お時間の許す限りどうぞ。。。)

基調講演:運営スタッフに喜ばれる CMSの選び方 超入門

f:id:sitk:20160904101515j:plain

結論

  • CMSは機能ではなく形で選ぶ

テクニカルディレクター

  • 複数のCMSを知っている
  • お客様に近い立場でサポート

 なぜ選べないのか

  • 車名では選べない(CMSの名前では選べない)
  • 車種では選べる(CMSの種類では選べる)
  • つまり、専門家でない限り用途に合う選択ができるのは種類まで

CMSの種類

  • ブログ型
  • ページ型

の2種類。(一般的な話ではない)

  • ブログ型かページ型か
  • CMSの生い立ちをみるとわかる

参考

mtrl.net

ブログ型

  • ほぼ同じ形の記事を登録
  • 一覧ページ作りやすい

ページ型

  • 異なるレイアウトの記事を登録
  • 様々な一覧ページは作りにくい

形を選んだ後は?

どちらが向いてるかわかったら、該当するCMSの詳しい話を聞いてみる。イラストにするとわかりやすい。

f:id:sitk:20160904101519p:plain

f:id:sitk:20160904101523j:plain

f:id:sitk:20160904101526p:plain

f:id:sitk:20160904101533p:plain

参考 www.loftwork.jp

まとめ

  • 機能でなく、まず形で選ぶ
  • 形を見分けるために生い立ちをきく
  • 特徴は絵に描いて説明してもらう
  • ブログ型かページ型が選択できればまず大丈夫

所感

車での例えが分かりやすかったです。確かに名前(車名)で言われてもよくわからんなと。種類(形)で選ぶという視点は参考になりました。そして、イラストで可視化するという考え方、これいいですね。文字で伝えるよりも断然伝わりますね!今後の参考にさせていただきます!

 フロントエンドとコンテンツ配信のミライ − Webはどう変わるか

f:id:sitk:20160904101538j:plain

  • 流れの速いWebの世界
  • 多様化するニーズ
  • 技術選択が必要
  • Webとアプリの境界がなくなってくる
  • CMSはコンテンツ管理に特化するべき

サーバーレスアーキテクチャ

  • サーバーにまつわる問題

qiita.com

クラウド化

  • サーバー管理をサービスとして効率化
  • AWS S3がオススメ
  • 画像ファイルだけ置くとか

aws.amazon.com

静的サイトジェネレータ

  • 管理画面が不要な場合は向いている
  • エンジニア寄り

マルチプラットフォーム

  • いろんなデバイス
  • CMSとは、Webページではなく、コンテンツを配信するもの

REST API対応

  • CMSの資産を様々なシステム、プログラムから簡単に利用できる仕組み
  • コンテンツのみの配信

wp.tech-style.info

HTML5 API

www.htmq.com

ハイブリッドアプリケーション

  • Webサイト、アプリを並行で開発
  • Monacaなど

html5experts.jp

ja.monaca.io

AMP

  • 高速に表示、読み込み可能なWeb
  • シンプルなHTML構造

www.ampproject.org

CMSのミライ

  • コンテンツ管理
  • クラウド配信
  • 独立したWeb制作

それぞれ切り分ける ↓ 分業制作

シームレスUI

  • Webっぽさ、アプリっぽさ
  • WebページからWebアプリに
  • 多機能化するJS
  • 共通化するWebブラウザ

SPA(シングルページアプリケーション)

  • ページ遷移を感じさせない
  • ネイティヴアプリの操作感をWebへ
  • ローディングの可視化

qiita.com

プログレッシブウェブアプリ

  • 機能面でもネイティブアプリと遜色ないレベルを実現する
  • Webアプリのオフライン対応
  • push api
  • app install banners

developers.google.com

これからのミライ

  • Web制作はPHPからHTML、CSS、JSへ
  • フロントエンドの開発比重が大きくなる
  • 制作体制の変化
  • より高度なjsへ
  • 分業した制作体制
  • CMSはコンテンツ管理システム

モノリシックなCMSからマイクロサービスへ

  • コンテンツ管理に集中
  • テーマ機能や固定ページ機能は付加的な存在
  • コンテンツの入力と管理に集中できる
  • コンテンツ利用機会の拡大
  • rest apiを用いてあらゆるWebサイトでコンテンツが利用できる
  • フロント制作体制の強化

ミライを知るために

  • コミュニティでの情報収集
  • 技術ニュースは技術に特化しすぎ

所感

後藤さんのセッションは聴き応えありました。フロントエンド界隈に身をおいてる者としては、もっとアンテナを張り巡らせなあかんなと、、、反省しております。でも、こういう場にでてきて、情報を吸収することで、自分への知識となっていくので、もっと外に出て勉強していくぞ!と思わされたセッションでした!時代はフロントエンドだなw

 座談会〜CMSとセキュリティの現場から

f:id:sitk:20160904101542j:plain

ガートナーの調査

  • 日本企業の情報セキュリティに関する懸念事項

f:id:sitk:20160904101545j:plain

ガートナー | プレス・リリース |ガートナー、日本企業のセキュリティへの取り組みに関する調査結果を発表 より引用。

CMS全般に対する最新の脅威は?

参考サイト wp-portal.net

攻撃パターンは2つ

  • id password
  • プラグインやテーマ

パスワード攻撃

  • 1日で大量に攻撃が来てるものはパスワード攻撃によるもの - 新しい脆弱性が発表されるとピンポイントで狙ってくる
  • ロシアからの攻撃が多い

制作会社でできるセキュリティ対策は?

  • お客様の教育が必要
  • まずは人
  • パスワードは使いまわさない

パブリッククラウドはセキュリティが心配と声もよく耳にします。インフラ側でできるセキュリティ対策は?

  • セキュリティは何を指しているのか?
  • きちんと定義してあげる
  • 問題はお客様の側
  • リスクの分析をしないから、どこまでセキュリティをやらないといけないのかがわからなくなる
  • セキュリティを分析して対策を取る必要がある

WAF Webアプリケーションファイアーウォール

www.scutum.jp

  • ecサイトなどで使われる
  • 脆弱性対策をきちんとしていれば、WAFはあまり必要ない
  • 検討すべき項目

お客様にセキュリティ対策、リスクについてどのように説明するか?

  • 何をもってよしとするか、判断できる人が居ない
  • 最近のニュースを元に脅す
  • お客様がどこまで詳しいかわからないので、セキュリティよりも何を(どの資産、サーバーなのか?ウィルス対策なのか)守りたいかをはっきりさせる
  • 目的に沿った提案をしている
  • リスク分析をして何を守るかを決める
  • リスクとコストの兼ね合いでしかない、コストとリスクのバランスが大事
  • コストパフォーマンスの高い対策を取らないと意味がない

セキュリティへ投資しないことがコストでありリスクである ICPO 中谷氏

リスクを把握すること

  • 利用者、エンドユーザー、上席者に啓蒙しtw、リスクを理解してもらう
  • セキュリティ対策を行わないリスクを把握することは、自分、自社を守ることになる

いますぐできるセキュリティ対策

  • サイトをアップデートすること
  • 保守をする
  • アップデートできない場合に、セキュリティ製品を検討する

所感

はっきり言って、実際の制作現場でどこまでセキュリティのことを考えて制作しているのだろうか。まだまだ認識が甘い気がする。僕も含め。セキュリティの話になると、ハードルが高くなるイメージがあったけど、まずはできることから始めるというのが大事だということを学びました。

下記資料は読んでおくべきですね。無料ですし!ドワンゴでも研修教材として使われてるようですし!

www.ipa.go.jp

 マーケティング・オートメーションとCMS

f:id:sitk:20160904101548j:plain

そもそもMAとは

dmlab.jp

  • マーケティングプラットフォーム
  • 見込み客を管理するもの

リードジェネレーション

  • 見込み客の作成機能
  • まずリストを作る

リードナーチャリング

  • 有望な見込み客の育成

リードクオリフケーション

  • 購入確度の高い見込み客を選別

MAツール Mauticの紹介

www.mautic.org

  • オープンソース
  • 無料

dmj.underworks.co.jp

MAツールでのコンテンツ運用

  • Mautic
  • LP作成ができる
  • メール、キャンペーンビルダー
  • シナリオを作るのが大変

CMSとの連携

  • 顧客育成のシナリオ
  • WPのプラグインもある

ja.wordpress.org

所感

マーケティング・オートメーション。マーケティングの世界は横文字が多いw 制作畑の人間としては、あまり馴染まない言葉ですがw でも、実際にMAツールを使って、サイト構築していくっていうイメージは持てました。これは、今後の課題だ。。。

 オーサリングツールとしてのCMSとWebアクセシビリティ

f:id:sitk:20160904101550j:plain

アプリの紹介

ColorQuest

alfasado.net

ColorTester

alfasado.net

ATAG2.0

Authoring Tool Accessibility Guidelines (ATAG) 2.0

  • オーサリングツールのーためのガイドライン
  • 公共機関にCMS入れたときに、障害者の職員が管理画面使えないとアウト
  • オーサリングツール自身をアクセシブルにする
  • スクリーンリーダーで管理画面を操作したことがあるか?
  • キーボード操作できるか?
  • CMS管理画面はフォームの塊、フォーム周りは注意すべし
  • 複数の到達手段を用意する
  • 検索やサイトマップなど

たとえば、ドラッグアンドドロップのUIの時

  • チェックボックスとキーボード操作で操作できるように、代替手段を提供する

CMSをアクセシブルにするには

  • 障害者差別解消法ではサービスやアプリも対象になるかも
  • まず、知る、意識することから始める
  • 小さなことから始める

alt問題

  • ウィジウィグエディタでは、altが見れない
  • 画像とだけ入ってるaltはだめ
  • 代替テキストはあとで変えれるように

所感

アクセシビリティは、CMSの管理画面にも影響を及ぼす。管理画面を使う人にとってもアクセシブルでなくてはならない。CMSは、フォームの塊ですからね。これはやばいw altの付け方や、タブキーでの移動、ウィジウィグエディタ、、、自分が実装するとなると、ぞっとするようなことが管理画面には盛り込まれてますwアクセシビリティの世界は奥が深い。。。

さいごに

CMSをここまで深く掘り下げて見たことがなかったので、とても勉強になりました。CMSの選び方に始まり、フロントエンドまわり、セキュリティ、マーケティング、そして、アクセシビリティ。特に、フロントエンドまわりの進化はとてつもなく早いと感じています。

話を聞いただけでは身にならないので、、、実際に案件で提案できるまでにならなあかんな。。。がんばろう。そして、人との繋がりが大事だなと思えた勉強会でもありました。今回は名古屋でお世話になったアップルップルのみなさんがブースを出されてたのでそちらにも顔出させていただきました。

www.appleple.com

a-blog cmsの書籍も出されてますので、こちらも要チェックです!コンテンツ制作のワークフローの話があるので、そちらはとても参考になります!あとは、プロトタイピングという考え方ですね。気になる方はチェックしてみてください。

a-blog cmsの勉強会にも参加してきますので、そちらは別途レポートします。

おわり。

おまけ

やっぱり、アクセシビリティ界隈の人たちは、 飲んべえが多い(謎