「a-blog cms 勉強会」参加レポート

a-blog cms 勉強会」参加ちょっと前の話になりますが、9月4日にjuso-coworkingさんで行われた、a-blog cms 勉強会に行ってきました。
少し忘れてるところもありますが、教わったことなどのおさらいを込めて記事を書いてみました。

コンテンツファースト

a-blogはプロトタイプとしても使えるということで、コンテンツファースト型のワークフローについて触れられていました。

従来のワークフローの問題点

デザインが確定した後で、いざ情報を入れてみると、想定してたものと違った見え方になるケースが結構あります。
よくあるのが、メニュー項目や文章量の過不足問題。
想定していたものより情報量が多い(少ない)せいで、デザイン的に微妙になってしまうことがあります。

コンテンツファースト型ワークフローの場合

まずはコンテンツを作成し、そこからデザインやサイトの構造を設計・展開していく。
そうやって、早い段階で「見える化」することにより、コンテンツに過不足がないか、新しいアイデアを取り入れたりできないかといった判断がしやすくなります。

コンテンツファースト型ワークフローのメリット

● 制作者側
デザインと構築を同時進行で行えるので、効率的
デザイナーにとって、どういうデザインが必要か分かりやすい
● クライアント側
制作段階の早い内からコンテンツ入力やチェックに協力してもらえる

a-blogの特徴

ブラウザ上で、直感的に編集できる

実際の画面を確認しながら、ドラッグアンドドロップでレイアウト調整ができます。コーディングに知識がない人でも簡単に編集できるのがいいですね。

PHPを書かなくても実装できる

WordPressとは違い、テンプレートにPHPを書かないのが特徴です。
独自プログラムを書けないということではなく、中にはオリジナルのモジュールを作ってカスタマイズしている人もいるようです。

デバイスや条件ごとのコンテンツの出し分けが簡単

「パソコン・タブレット・スマートフォンでの分岐」や、「あるページを見たユーザーに対してだけ別の画像を表示する」といった分岐なども簡単に設定できます。
また、他言語サイトを作成したい場合、WordPressではマルチサイトを使うこともありますが、a-blogの場合すでに他言語機能が実装されているとのこと。
(ちなみに管理ページの他言語化もできるようです。)
どういったサイトが作成できるかは、制作事例のページでいくつかサイトがあげられているのでこちらを参考に。

a-blogをちょっと触ってみる

a-blogは基本有料なのですが、ablogcms.ioで30日間無料でさわることができます。
ページの下の方には、ハンズオンがいろいろ掲載されているので、何をしたらいいかわからない人は、まずここをチャレンジしてみるといいと思います。
自分のサーバー、またはローカル環境でさわりたい場合は、下記のページが参考になります。

(※ ローカル環境において、htdocs直下にインストールするよう書かれてますが、私の環境下では作業用のWordPress環境など他のファイルも置いてたので、専用の階層を一つ作って作成しました。)

a-blogをさわる上で知っておくといいキーワード

ユニット

文章や画像、動画などを「ユニット」と呼ばれるブロックに分けて、登録・更新していきます。

ユニットの種類

  • テキスト
  • 画像
  • ファイル
  • マップ
  • ビデオ
  • 引用
  • メディア
  • カスタム …ユニットの入力欄を自由に作れる
  • モジュール …他のエントリーの一覧やバナー画像のような素材用
  • ユニットグループ …複数のユニットをまとめてレイアウトできる

カスタムフィールド

WordPressでもおなじみ、オリジナルの入力項目を作る機能です。
a-blogでは管理画面上ではなく、テンプレートファイルにHTMLを書いていきます。
プログラムの知識はなくても大丈夫ですが、不安な人はカスタムフィールドメーカーから作成することもできます。

モジュール

ブラウザ上から更新できる部分には、「モジュール」と呼ばるパーツを、htmlファイルのテンプレートに貼り付けて作成していきます。
モジュールはリファレンスにスニペットが用意されてるので、プログラマーの人じゃなくても安心してコピペすることができます。
ただ、調子にのって貼り付けすぎると、それなりに重くなるのでほどほどに…とのこと。

テーマ

見た目のデザイン編集はテーマ設定で行います。
テーマは themes/テーマディレクトリ名 に管理します。
ちなみに、WordPressのように子テーマを作成したい場合は、テーマのディレクトリ名の後ろに@親テーマ名をつけるといいようです。簡単!
主なテンプレートは3種類。

  • トップページ(top.html)
  • 一覧(index.html)
  • 記事(entry.html)

ディレクトリ内に静的ファイルを置くこともできます。

テーマをカスタマイズしたい場合

既存テンプレートにある 「simple2016」 をインストールするのがおすすめとのこと。
また、theme の中にある readme を見ると、より理解が深まるとのことでした。

困ったときは…

制作者向けの情報サイト、もしくはFacebookのa-blog cmsの相談所を…というかんじですかね。 あと、本も今年出たようです。

実践! コンテンツファーストのWebサイト運用 a-blog cmsではじめるCMSプロトタイピング
山本一道 鈴木健 山田拓生 岩崎浩 伊藤淳 森田霞 今井理紗子 堀悟大 口田聖子 山田恵理子 坂本邦夫 勝又孝幸 松下嗣紀 いちがみトモロヲ
ボーンデジタル
売り上げランキング: 353,974

参加しての感想

参加者特典で、個人向けのライセンスや、お得なライセンス情報などいただけたので、参加してよかった!と思いました。
勉強会については、結構頻繁に行われていて、11月には2日間開催の大きいベントもあるようです。
また、機会があれば参加したいと思います。