第7回「DevDo北海道開発オフ」に参加してきました。
参加者延べ17人。
どんどん輪が広がっていって素晴らしいことです＞＜
今回、テーマとして選択したのは先日ホッテントリ入りした
「SOY CMS」です。
SOY CMSは、SOHOやWebデザイナーの救世主になるかもしれない: 世界中の１％の人々へ
私は今のところ、MovableType・WordPressのデザインと構築を生業としています。
Dakiny（蒲生）さんが言うように、デザイナーの救世主足りうるのかという点が猛烈に気になったので、開発オフで実務的なサイト構築まで試してみることにしました。
7/1補足：随所に加筆をしています。そちらも参考にしてください。
下準備
インストールまでは、Dakinyさんの記事を読んだ時から手を付けています。エックスサーバーが条件を満たしていないこともあり、構築できる段階になるまで一週間かかりました。
エックスサーバーにインストールする方法に関しては、後日改めて記事を書きます。
条件がPHP5.2以上という段階で、実用には厳しいところです。
既存のウェブサイトにCMSを入れ込む場合、利用しているサーバーが常にメンテナンスされているとは限りません。
MT・WPが厳密にはCMSでないのに関わらず重用されるのは、導入できるサーバー条件が非常に緩い＝サーバー移転に関わる時間と費用を節約できるという事情があるのです。
ただ、この辺りはどのアプリも通る道だと思いますので、広く普及したりPHP5.2に対応するサーバーが増えれば状況が変わってくるかもしれません。
で、ベースとなる静的ウェブサイトを用意しました。
おまめ商事です。おまめさんリスペクトしました。
農研さんのデモサイトは、ちょっと参考デザインとしては…アレなので、一般的な構成のウェブサイトを作りました。
前職在籍時に作ったウェブサイトのひな形を元にしているので、コーディングに古い部分もあり、今回のテーマにはちょうどいいのです。
上記のサイトをざっと見てから、次項にお進みください。
いきなり作業結果
結果から書きます。現状ではこうなっています。
7/1追記：
エックスサーバーでは不具合が起こるため、動作が確認されているCORESERVERで再構築中です。
構築をしてみての感想
独自タグの仕様について
作業をはじめて、いちばん興味深かったのが独自タグの仕様です。
このようなHTMLソースがあった場合
<p>ここにエントリーのタイトルを入れたいな</p>
MovableTypeやWordPressが
<p><$mt:EntryTitle$></p>
と、「要素の中身を削除して独自タグに入れ替える」のに対し、SOY CMSは
<p cms:id=”title”>ここにエントリーのタイトルを入れたいな</p>
と、「要素の中身を残したまま属性値かコメントで独自タグを指定する」仕様になっています。
出力時に、タグの内容は自動的に置き換えられることになります。
こういう、「置換法」は初めて見たので、発表のときに「利点がわからない」と言ったところ、参加者の渡邉さんに補足をしてもらいました。
@webbingstudio Javaでも色々ありますよ。デザイン重視のテンプレートは置換タイプが多い傾向ですね
http://twitter.com/shuji_w6e/status/1261743170@webbingstudio 設計時の見本（モック）がそのままテンプレートとして使えるし、修正した場合でも反映が楽なのがポイント
http://twitter.com/shuji_w6e/status/1261744153@webbingstudio 静的にデザインしてコーディングし、修正依頼が来たときに意味不明のタグだらけで表示もできないってパターン防止です
http://twitter.com/shuji_w6e/status/1261832339
確かに、MovableTypeなどで作成したテンプレートはダミー文を削除してしまうため、Dreamweaverでは正確な状態で見ることができません。構築時もHTMLをかなり修正することになります。
元の静的ページのソースコードをできるだけ生かすことで、デザイナーへの取っ付きやすさや作業の効率化を図っているようです。この点は、普及すれば確かに制作の現場において劇的な効果があるかもしれません。
独自タグに関わる欠点
しかし既存のHTMLと同化しているという仕様上、ちょっとでも書き間違えるとすぐページが崩れます。
引数にダブルクォーテーションが使われているため、元々クォーテーションで囲まれているtitleやalt等の属性値内に記述しようとすると、やっぱり崩れてしまいます。
また、テンプレートにPHP構文を書くことはできますが、上述の仕様のため独自タグの内容を変数に入れ込むことはできません。
このままではカテゴリーのアイコン化などができないので、この辺、要望として出したいところです。
7/1補足：
属性値の他にコメントで変数を記述する方法もあります。また、この記事以降のバージョンではクォーテーション重複に対応し、属性値に使用することが可能になりました。
管理画面について
これは、サイトを作成した直後の、管理者権限を持っているユーザーのダッシュボードなのですが…
横ナビゲーションに違和感があります。
（赤線は私が引いたものです）
何故「プラグイン」がど真ん中ですか。
7/1補足：
バージョン1.2.5以降で用語・インターフェースが改善され、左から
ホーム / 記事 / ラベル / ページ / プラグイン となりました。
「記事」はページの中に入る情報、「ページ」はページの外観とサイト構成のことです。
一般的なUIの概念からすると、頻繁に利用するものを左上に置くのが定石と考えられます。
なので、どのWebサービスやアプリも「エントリーの投稿」がいちばん左上、かつ大きなボタンとなり、ワンステップで記事を書き始められるようになっています。
クイックリンクは一応右のサブメニューにもあるのですが、
「エントリー」「ブログ」というボタン名もわかりづらく
（ブログページセットの設定に関する画面で、すぐエントリーを書けるページではありません）
「テンプレート」というボタンも謎で
（テンプレート作成ではなく、既存のテンプレートセットをインストールする画面です）
操作時にはかなーり混乱しました。
大きな入力項目や、マウスオーバーでヘルプが出るのはなかなか快適です。
しかし、いろんなところでまだまだ整理されてない印象が強いです。
ひとまず、早急に改善してほしいのは、
WYSIWYGエディタ（TinyMCE）のインターフェースだけ異常に細かい点です…
7/1補足：
WYSIWYGエディタの文字が管理画面と同サイズになり、見やすくなりました。また、WYSIWYGエディタそのものを設定でオフにすることも可能です。
（きちんと構築して、WYSIWYGエディタを使わずに済むのが理想ですよね…v_v）
CSS編集機能が使えない
一般の静的なウェブサイトは、CSSや画像へのリンクを「相対パス」で記述します。
しかし、これをそのままSOY CMSに入れ込むと、CSS編集画面では「リンク切れ」となり実質編集はできません。
テンプレート側で、相対パスを絶対パスに編集しなければならないとしたら本末転倒です。
この辺、なんとかならないもんでしょうか。
まぁ、HTMLやCSSの編集は、ローカルで編集してFTPでアップが基本なんですが。
7/1補足：
相対パスでもCSSのリンクが切れなくなりました。また、Dreamweaver等で編集→所定の階層にアップ→SOYCMSに同期という作業も可能です。
独自タグへの説明が少ない
CMS版のトップページを見ると、少しおかしいことになっています。
記事本文がそのまま表示されてしまっています。
こういった新着情報で良くあるのが、記事タイトルの下にHTMLタグを除去した概要を表示するというものなのですが、概要を出力する方法がわからず、またブログ新着へのリンクをブログ外から貼る方法もわからず、保留になっています。
構築やカスタマイズに関わる、独自タグの説明が少ないのはちょっと困ります。
公式サイトのマニュアルを、時間があるときに改めてあたってみます。
7/1補足：
マニュアルに独自タグの説明がだいぶ追加されました。また、「記事の先頭x文字」のトリムが可能になりました。
携帯対応ページに期待
SOY CMSが特に力を入れているのは携帯端末関連で、絵文字にもかなり対応しているようです。
携帯電話は単純な構成のページになることが多いので、先述のCSS編集や細かいカスタマイズのことをあまり気にする必要はありません。
本サイトは新着情報のみSOY CMSを埋め込み、携帯サイトは全部SOY CMSで構築、という構成にすると、今の段階でも充分に力を発揮できそうな気がします。
現時点でのまとめ
ここまで読んでいただいた方ありがとうございます。長くて申し訳ない。
いろいろ書いている通り、私としては
「蒲生さんの記事タイトルは大袈裟。現時点ではSOHO救えません」
というのが率直な感想です。
特にユーザーインターフェースがこなれていない印象です。
私はブログに慣れていることもあり「ま、いっか」で済ませてしまうところがあるのですが、カスタマイズに不慣れなSOHOや、お客様だとそうはいきません。
既にMovableType・WordPressを利用している個人事業者も含めて、お客様にこれはおすすめです、とご紹介できるのにはまだまだ時間がかかりそうです。
置換法を使っているからなのか、表示速度の遅さも気になるところです。
ただ、日本のウェブサイトに特化した軽量CMSとしての伸びしろは、充分にあると感じました。
フォーラムでもいろいろ要望が出されているようなので、今回のホッテントリ入りを機に、どんどんバージョンアップされたり、関連ブログが作られるのを期待しています。