このサイトは、2011年6月まで http://wiredvision.jp/ で公開されていたWIRED VISIONのコンテンツをアーカイブとして公開しているサイトです。

増井俊之の「界面潮流」

「界面」=「インタフェース」。ユーザインタフェース研究の第一人者が、ユビキタス社会やインターフェース技術の動向を読み解く。

第32回 マクロで楽々HTML

2009年6月 8日

(これまでの増井俊之の「界面潮流」はこちら

Cのプログラムでは、定義された規則に従ってプログラム中の文字列を別の文字列に置き換えるマクロ機能を利用することができます。たとえばプログラム中で以下のような記述をしておくと、

#define SIZE 100

その後に出現するSIZEという文字列はすべて100という文字列に置き換えられるので、

char array[SIZE];

のような記述は

char array[100];

と書いたのと同じことになります。

これは100バイトのメモリ領域を確保するための宣言文であり、この領域を利用するプログラムは100バイト以上のデータをこの領域にコピーしたりしないように注意しなければなりません。領域サイズは仕様変更などにより変更される可能性がありますから、サイズに依存する部分では以下の例のように「100」のかわりに「SIZE」と記述しておけば、サイズの変更があってもあちこちを修正する必要がありませんし、プログラムの意味を理解することが容易になります。

if(length < SIZE){ ...

文章におけるマクロの利用

文章を書くときにもこのようなマクロ機能が使えると便利です。「非決定性状態遷移機械」のような長い文字列が何度も出現する文を書くとき、Cの場合と同じように

#define NFSM 非決定性状態遷移機械

のようなマクロ定義を利用することができれば、何度も「非決定性状態遷移機械」を入力したりコピペしたりするかわりに「NFSM」と書くだけですみますし、表記揺れのミスを防ぐことができます。また、用語を「非決定性オートマトン」に変更したくなったような場合でも、定義部分だけ修正すればよいことになります。

文書整形システムTeXでは強力なマクロ機能を活用できるので大変便利ですが、残念ながらHTMLにはマクロ機能がありませんから、同じような記述を何度も書かなければならないことがよくあります。例えば、凝ったレイアウトが必要な場合、複数の<div>タグを何段も入れ子にすることがありますが、そのような場合は全ての<div>を生真面目に記述する必要があります。同じような記述をマクロで置き換えることができれば記述の量をかなり減らすことができます。

HTML + m4

UnixやMac OSにはm4という汎用マクロプロセッサが標準搭載されています。m4は、C言語で有名なBrian KernighanとDennis Ritchie (K&R)が開発したマクロプロセッサで、Kernighanのソフトウェア作法という本で実装法が解説されています。C言語の普及度に比べるとm4の知名度は惨憺たるものですが、HTMLでマクロ機能を使いたいような場合に手軽に使うと便利です。

m4ではdefine()でマクロを定義します。たとえば

define(NFSM,非決定性状態遷移機械)
<h1>NFSM</h1>
NFSMとは...

というテキストをm4で処理すると、全ての「NFSM」が「非決定性状態遷移機械」で置き換えられて

<h1>非決定性状態遷移機械</h1>
非決定性状態遷移機械とは...

という出力が得られます。

m4では、数値をインクリメントするincr()や、条件判断を行なうifelse()などを利用できるので、以下のように、繰り返し処理を行なうtimesマクロを定義することができます。

define(times2,`ifelse($1,$2,$3,
`times2(incr($1),$2,$3)$3')')
define(times,`times2(1,$1,$2)')
times(4,`<br>')

このテキストをm4で処理すると以下のような出力が得られます。

<br><br><br><br>

入れ子の<div>を使いたい場合は以下のようにしてdiv2マクロを定義することができます。

define(div,`<`div' class="$1">
`$2'
</`div'>')
define(div2,`div(class1,div(class2,$1))')

この後に続けて

div2(abc)
div2(def)

と記述したものをm4で処理すると、

<div class="class1">
<div class="class2">
abc
</div>
</div>
<div class="class1">
<div class="class2">
def
</div>
</div>

のような出力が得られます。div2(abc)のような記述をするだけで長いHTMLが生成されるので便利だといえるでしょう。

定型的な記述が多いWebページでは、マクロ機能を使うと記述の量を大幅に減らすことができるでしょう。CSSを使うことによってスタイルの記述を簡素化するのと同じように、HTMLの本文全体にわたってマクロを利用することにより、文書の本質的な部分により注力することができるようになるかもしれません。m4はあらゆるUnixやMac OSに搭載されているので今すぐ使えるというメリットはありますが、かなりプログラマ臭がするシステムであり、普通のWebページ制作者にはとっつきにくいと思われるので、より使いやすい汎用マクロプロセッサの普及が望まれるところです。

フィードを登録する

前の記事

次の記事

増井俊之の「界面潮流」

プロフィール

1959年生まれ。ユーザインタフェース研究。POBox、QuickML、本棚.orgなどのシステムを開発。ソニーコンピュータサイエンス研究所、産業技術総合研究所、Apple Inc.など勤務を経て現在慶應義塾大学教授。著書に『インターフェイスの街角』などがある。

過去の記事

月間アーカイブ