福冨諭の福冨論

RSSリーダーではこちらをどうぞ→https://feeds.feedburner.com/fuktommy

Another HTMLPP で携帯電話用XHTMLを生成

新月掲示板mobile.fuktommy.comFOMA対応版(一部機種非対応)にしました。 iモードHTMLシミュレータII で確認しただけなんですけどね。 iモードHTMLシミュレータ では表示されないので旧機種の人はごめんなさいです。 新月ヘッドラインblog.fuktommy.comのミラー を見てください。

mobile.fuktommy.comの方は HTMLプリプロセッサ(Another HTMLPP) を使ってi-mode用のタグを生成しています。 これはけっこう面白いことをしていて、こんな感じです。

index.html を例にすると index.ht というソースファイルでは

>>>include "tags.h"
 >>>include "head.h"
 <$H2>コンテンツ<$_H2>

としています。 それぞれのヘッダファイルはこんな感じです。

tags.h:
 >>>define  H1           <h1><span style="font-size:medium;">
 >>>define _H1           </span></h1>
 >>>define  H2           <div style="background-color:#afa;"><h2><span style="font-size:medium;">
 >>>define _H2           </span></h2></div>
head.h:
 <?xml version="1.0" encoding="Shift_JIS"?>
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN"
     "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
 <head>
   <meta http-equiv="content-type" content="text/html; charset=Shift_JIS" />
   <meta http-equiv="content-script-type" content="text/javascript" />
   <title><$TITLE></title>
   <meta name="description" content="<$DESCRIPTION>" />
   <link rev="made" href="mailto:webmaster@fuktommy.com" />
   <link rel="contents" href="/" title="トップ" />
 >>>ifdef SECTION
   <link rel="contents" href="./" title="<$SECTION>" />
 >>>endif
   <link rel="alternate" type="application/rss+xml" title="RSS" href="http://blog.fuktommy.com/rss" />
   <link rel="meta" type="application/rdf+xml" title="license" href="/license" />
 </head>
 <body style="background-color:#efefef;">
 <$H1><$TITLE><$_H1>

その結果、index.htmlのh1,h2要素はこんな感じになります。

<h1><span style="font-size:medium;">mobile.fuktommy.com</span></h1>
 
 <div style="background-color:#afa;"><h2><span style="font-size:medium;">コンテンツ</span></h2></div>

Apacheの設定はこんな感じ。

RewriteEngine on
 RewriteCond %{HTTP_USER_AGENT} DoCoMo
 RewriteCond %{LA-F:REQUEST_FILENAME} \.html
 RewriteRule .* - "[T=application/xhtml+xml]"

Original Article: http://blog.fuktommy.com/1177937483