HTMLを出力するテンプレートエンジンをちょっと見ています。 「テンプレートエンジンを見つめる『メソ』」がお送りします。(提供)

テンプレートエンジンは腐るほどありますが、どうにもグッとくるものがない。 もちろんハッとするものもない。

何がグッっと来ないかと言うと、折角デザイナが作ったHTMLに、 素人の私が手を入れる必要があるものがほとんど。 まあ、ある程度はしょうがない気もするが、「手を入れる」 どころか「手を突っ込んで思いっくそ掻き回す」みたいなものがあまりに多い。

幾つか見てみる。

(テンプレート部分の記述以外のMVC的な辺りや、その他具だくさん、みたいな部分についての優位性等はとりあえず置いとく。)

独自タグパターン

このパターンがたぶん一番多い。 PHP自体 や Smarty , Velocity なんかがそうです。

<html>
  <head>
    <title>{$title}</title>
  </head>
  <body>
    <h1>{$page_name}</h1>
    <ul>
      {foreach from=$items item=itm}
      <li>{$itm}</li>
      {/foreach}
    </ul>
  </body>
</html>

みたいな。(上記は Smarty)

変数の内容を{}で表示するのはともかく、 制御構文を思いっきりHTMLにぶちまけています。あり得ません。 人の仕事を「思いっきり掻き回して」います。 デザイナーなんてf**kと思っているに違いありません。

まあ、そこまで言わないにしても、仮に上記のように手を入れてしまうと、 「成果物を受け取って加工品を作った」事になってしまうので、 修正依頼や不明点があった場合に全部、デザイナーではなく、こっちに 連絡が来てしまいます。そりゃそーですよな。 作った後に勝手に加工されたものに文句付けられてもデザイナーさんも困ってしまいます。

コメント&独自タグパターン

独自タグパターンとほとんど同じですが、 制御構文をコメントやHTML要素として埋め込む。

例えば、PEARの HTML_Templat_IT は、

<html>
  <head>
    <title>{title}</title>
  </head>
  <body>
    <h1>{page_name}</h1>
    <ul>
      <!-- BEGIN items -->
      <li>{item}</li>
      <!-- END items -->
    </ul>
  </body>
</html>

と、そのまま独自タグ書くよりは、若干優しい感じにはなってますが、 後から「コメントを埋め込む」もしくは「コメントは触らないでください」っつーのは 変わりませんし、根本的に{title}などとHTMLとして開いたときに表面上にデータ構造に 関数表記が見えちゃってるのがガッカリ感満点です。

上記どちらのタイプにも言えますが、 依頼者とデザイナーがデザインに関する打ち合わせをする時に、表示部分に"{$page_name}"などと書かれたモックアップを使うのはコミュニケーションをワザと阻害しようとしてるような気がしてなりません。

PHPテンプレートエンジンTop25 なんつーのも眺めてみましたが多くは上記タイプのどちらかでした。

XHTMLっぽく定義を拡張するパターン

HTML部分はそのままに、テンプレート用のスキーマを用意して属性等にデータや制御構文を設定していくパターン。

PHPTALとかPHPOOTとかTapestryとかですかね。(Tapestryはnamespace用意せずに拡張しちゃってるので、どっちかっつーと『独自タグパターン』かな)

<html>
  <head>
    <title tal:content="title">タイトル</title>
  </head>
  <body>
    <h1 tal:content="page_name">ページ名</h1>
    <ul tal:repeat="item items">
      <li tal:content="item">各アイテム</li>
    </ul>
  </body>
</html>

みたいな感じ。(上記はPHPTAL)

これはなかなかイイ。テンプレートをブラウザで見たときにも変数名や制御構造は一切出てきません。

XHTMLだった場合は、機能や記述の追加のやり方としても非常に全うです。

が、やっぱり tal:content="title" みたいな部分はどうしても気になってしまいます。 要するにそこ追記しないと行けないわけですから。 後、(たとえ本当にXHTMLだったとしても)XHTML,XHTML的な感じはなんとなく萎えます。

昔ならともかく今のご時勢、XHTMLである事自体は別に(と言うか全く)問題ないと思うのですが、XHTMLスキーマだけで行かない、と言う事はやっぱりデザイナーさんには書けない部分、と言う事になっちゃうと思います。

まあ、事前に埋め込んで渡せばいいので許容範囲内ではありますが、グッとは来ない。

HTML要素自体を目印にするパターン

HTMLの id 属性等とデータやオブジェクトを結びつけて変換するタイプです。

Amrita とか Mayaa とかです。

<html>
  <head>
    <title id="title">タイトル</title>
  </head>
  <body>
    <h1 id="page_name">ページ名</h1>
    <ul id="items">
      <li id="item">各アイテム</li>
    </ul>
  </body>
</html>

Amritaの例です。Mayaaでも上記でOKです。 と言うか、単なるHTMLです。テンプレートファイルである事を表すものが全くありません。

スヴァラシイ。

これです。こうあるべきです。 もちろん、「idを付けなきゃいけない」のである意味1つ前のパターンと同じじゃん、と言う事も言えますが、完全にHTML(or XHTML)になっているだけで随分違います。

HTML構造(?)を気にしているデザイナーさんであれば、id,class 辺りは付けてくる場合がありますし、css活用してる場合も大体それっぽいところに付いてきます。

問題としては、HTMLのidを使う事によって逆に、 idの用途が作業者によって異なるので衝突が発生する可能性がある点でしょうか。

開発者はデータやオブジェクトのキーとして利用しているのに対し、 デザイナーはスタイルシートやjavasctiptのキーとして利用しているので、 どちらにとっても勝手にidを変えられたりすると困った事になります。 (そーゆー意味では『XHTMLっぽく定義を拡張するパターン』の方がよい)

又、Amritaの場合、idをテンプレートエンジンの為に占有している節があり、 変換後、対象のid属性を勝手に消します。 詳しく見てないので、もしかしたら設定で消さないようにもできるかもしれませんが、 上記サンプルの <li> タグの場合などは、繰り返されるタグに対して id を振ってしまっているので、仮に消さなかったとすると id 重複となってしまいます。

後、これもAmritaの場合ですが、タグの値ではなく、属性の設定等、デフォルト動作と異なる操作をする場合に、データそのものにマークを付けたりする必要があったりします。 (HTML側に書く事もできますが、そーすると『XHTMLっぽく定義を拡張するパターン』と同じになっちゃいます) Maayaの場合は、この辺を .maaya と言う制御ファイル(?)を別途用意する事で解決してます。

個人的には Amrita のような手軽さの方が好きですが、完全にはグッっと来ないわけであります。

んー、じゃあ、どーゆーのがいいんだよ、っつー事になりますが、その辺は又次回。。。 (続かないです)

作成日 2007-11-21 (水) 20:08:44

Tag: 日々 php ruby