#article **提案と質問(SEO、CSS、繰り返し、タグ属性ダミーサポート) [#ab0662c9] >[[yusuke]] (2004-12-03 (金) 13:52:52)~ ~ www.arclamp.jpのyusukeです。Mayaの仕様書、大変面白いです。僕もJakarta Velocity(VTL)へのアンチテーゼとして、似たような考え方(デザイナドリブン、Tapestry)でテンプレートエンジンを作成しました。ただ、あくまでもデザイナが自分で作れることを前提にしているので、HTMLにちょこっとタグや属性を足すだけというのが前提です。また、Velocityが元なので、TagLibの連携は考えていません。~ まず、デザイナに受け入れられるためには、Webサイトの現状をサポートしてあげる必要があります。これはWebサイトは、SEOの観点から、インフォメーションアーキテクト(IA)がHTMLタグは意味づけだけを行って単純化し、デザイナがCSSで装飾するという考え方です。~ 以下は、これを踏まえた提案と質問です。なお、Mayaの仕様書を読んだけで書いていますので、いまさらなところ、変なところがあるかもです。~ ~ 提案1.id属性を使用しない(既存のHTML属性にシステムとしての意味を持たせない)~ CSSで利用するid属性をシステムが使用していると不整合が生じることがありました。idを属性名として使用したくても装飾的にはくくっている場合がある。あるいは、idをデザイナ側が違う意味で使ってしまっているなどです。これは、意味と装飾が必ずしも1対1でないことから生じる問題です。また、そもそもCSSの使い方に制限を与える可能性があるのは避けるべきだと思います。~ ~ 提案2.テンプレートと設定を同じファイルにする方法~ 2つのファイルを見ているとメンテナンスビリティが悪いと思います。僕の場合は、複雑な情報設定はHTML内部に独自のタグを拡張してXMLで定義しました。ただし、HTMLのDTDを変える必要性ありますが、逆に言えばバリデーションチェックも行えるようになります。MayaのようにSPANで設定するのはいいアイデアだと思いましたが、微妙な気もします。前述のようにHTMLは意味づけをおこなうものであって、意味のないタグの存在は混乱を招くからです。~ ~ 提案3:例文をspanではなく、h1-h5やpで書く~ 前述のIA的な視点だとインライン要素のspanはまず使いません。例文もh1-h5、pで書くようにしたほうがイメージがつきやすいと思います。SEO的にも、そちらが推奨されます。~ ~ 提案4:仕様書に目次を~ ちゃんと、アウトラインに対応させて、目次を作ってもらえるとうれしいです。~ ~ ~ 質問1.繰り返しの処理の方法が知りたい~ 僕が作ったのは、HTMLのリストモジュールであるULであれば1つ目のLI、TABELであれば1つ目のTRもしくはTDをループするという感じです。HTMLタグ自体を解釈するようなってしまいましたが、もっとも分かりやすかったので採用しました。~ <UL x:loop="list" x:def="info"><LI><p x:name="info.text">dummy</p></LI>...~ <TABLE x:loop="list" x:col="4" ><TR><TD><h2 x:name="info.text">dummy</h2>...~ TABLEのx:colは、自動的に4列にテーブル組みをしてくれるものです。ヘッダがいる場合はTHEADER、TBODY、TFOOTERを利用してもらって、TBODYの中だけを繰り返します。~ ~ 質問2:IMGやAタグでのダミーデータサポートの方法が知りたい~ HTMLタグの中の属性に対して、ダミーをサポートしようと思うと、どうしても複雑になります。僕の場合は、~ <a href="dummy" x:href="bean.url" x:name="bean.title">dumy</a>~ <img src="dummy" x:src="bean.url" />~ としました。~ ~ // -提案1>idとm:injectはJSPカスタムタグのインジェクションにおいて重要な要素を持っています。idはMaya設定XMLを置いたときに、設定の対照に使います。m:injectはインジェクションするカスタムタグの指定です。また、m:名前空間を持つ他の属性がテンプレートのタグに埋め込まれている際には、それらはJSPカスタムタグのプロパティとして設定されます。逆に名前空間がついていない属性は、id属性だけを特別にプロパティ設定する以外は、捨て去ります。ということで、id属性にもm:idというように名前空間をつけてもよいのですが、そうすると、<input type="text" value="aaa" id="forCSS" m:id="forMaya" m:value="{ binding }" m:inject="h:inputText">というように、idが二種設定可能となります。そして出力される際には、<input type="text" id="forMaya" ...とせざるをえないかと考えております。CSSの動きを守るために、結果、id="forCSS" m:id="forCSS"と同じ値をいれることになります。となると、id属性においては現在の仕様で良いのではないかと帰結しています。いかがでしょうか? -- [[まさたか]] &new{2004-12-04 (土) 13:17:34}; -提案2>インジェクション設定およびプロパティバインディング設定はテンプレートにm:名前空間を付加することによって、属性として埋め込むことが可能です。また、全てもしくは一部をMaya設定XMLに外部化することも可能としています。ふたつのファイルを見るのが作業効率を低下させている開発フェーズではすべてテンプレートに埋め込みで開発すればよいし、デザイナーとの連携上でテンプレートにバインディング情報を埋め込みたくないときには、すべてをMaya設定XMLに出しておけば、テンプレートにのこるのは(提案1ではなく現行仕様のままとしたら)、HTML標準のid属性だけになります。さらには、バインディング情報をテンプレートと設定XMLとの間での移動をEclipseプラグインでサポートしようと考えています。開発フェーズやチーム構成に応じて、テンプレートの使い方をダイナミックにも変えられるようにするように考えてます。 -- [[まさたか]] &new{2004-12-04 (土) 13:24:00}; -提案3>サンプルでspanを使っているのは、Tapestryへのオマージュであるのと、現在の仕様書の対象者が一定以上の経験をもったプログラマーのため、デザイナー視点での気配りは行えてません(私が非デザイナーであることも一要因です)。先のドキュメント、サンプルでは、デザイナー的視点も意識するようにしますね。 -- [[まさたか]] &new{2004-12-04 (土) 13:28:10}; -提案4>ドキュメントはいずれ出版したいと思ってます。どこかの版で章・項の構成をきちんとして、目次も作ります。しかし、近日についてはご猶予ください。 -- [[まさたか]] &new{2004-12-04 (土) 13:30:05}; -質問1>JSPカスタムインジェクションまかせです。内部ではLoopTagインターフェイスを対応すべく、doAfterBody()メソッドをきちんとコールするなどの対応をしますが、あとはJSTLのforEachなどをインジェクションすることによってループも実現できます。 -- [[まさたか]] &new{2004-12-04 (土) 13:34:10}; -質問2>ご質問中の例示のままで対応可能です。<img m:inject="x:myImage" src="dummy" m:src="${ bean.url }">と書いておけば、m:名前空間の無い属性はカスタムタグにプロパティ設定されないので望む動きになると思います。また、<img id="image1" src="dummy">とテンプレートには書いておいて、Maya設定XMLに、<tag id="image1" inject="x:myImage"><binding name="src" value="${ bean.url }"></tag>でもいいです。 -- [[まさたか]] &new{2004-12-04 (土) 13:41:17}; -そして、最後に対象者が違うのかもしれません。デザイナーがプログラミング知識なくとも動的サイトをつくれる仕組みではなく、デザイナーとプログラマーで同時並行に仕事を分担できる仕組みをMayaでは考えています。Tapestryも同じ思想です(と、作者のHLS氏が著書で語ってます)。 -- [[まさたか]] &new{2004-12-04 (土) 13:51:08}; -すみません、質問したのですが勘違いでした。Mayaが理解できました。すごくいいですね。Velocityのように、静的なファイルを出力することも可能にできるようですし、かなり有用ですね。 -- [[yusuke]] &new{2004-12-08 (水) 00:22:08}; #comment **期待しております。がんばってください [#x4589ad4] > (2004-11-20 (土) 02:18:00)~ ~ 現在、Spring1.1.1+JSTL(JSP)で開発した案件が多数あり、その際、~ JSTLの<c:if>タグなどをHTMLの<input>タグに入れ子の状態に~ した場合、Dreamweaverのデザイン画面で確認するとレイアウト~ が崩れてしまうことで、デザイナとの真の分業ができなかった経験~ がございます。Spring1.1.1以降への対応を考慮いただければ、あり~ がたいと思っておりますが、対応可能になる見込みはございますで~ しょうか。~ ~ PS.)~ 現在、個人的にSeasar+S2JSF+S2DAOを評価させていただいてお~ ります。~ ~ よろしくお願い致します。~ // -DIContainerとの連携は、Springも対象にするはず。 -- [[ひが]] &new{2004-11-21 (日) 17:56:42}; -MayaとSpringとの組み合わせについて言うと、間にStrutsとか挟んだりするとJSPの単純置換えでいけます。バインディングでMaya-Springを直につなぐとなるとそれはアダプタちっくな小品で対応できるため、上記ひがさんのコメントに続きます。 -- [[まさたか]] &new{2004-11-25 (木) 10:05:44}; #comment