<!DOCTYPE HTML PUBLIC "ISO/IEC 15445:2000//DTD HyperText Markup Language//EN">

<html lang="ja" dir="ltr">

<head>
  <meta http-equiv="content-type" content="text/html;charset=shift_jis">
  <meta name="author" content="加納 景">
  <link rev="made" href="mailto:%77%65%62%6D%61%73%74%65%72%40%70%6F%65%73%69%61%2E%6A%70">
  <link rel="start" href="../index.html">
  <link rel="index" href="./index.html">
  <link rel="help" href="../about/index.html">
  <link rel="stylesheet" type="text/css" href="../css/main.css" media="screen,tv" title="elegant">
  <title>ISO-HTMLでのデザインを模索する -Poesia</title>
</head>

<body>
  <ol id="NAVI">
    <li><a href="../index.html">Home</a></li>
    <li><a href="../weblogs/index.html">Weblogs</a></li>
    <li id="POINT">ISO-HTMLでのデザインを模索する</li>
</ol>

<h1>ISO-HTMLでのデザインを模索する</h1>

<h2>優れたHTMLによる優れたデザインを実現するには</h2>

<h3>はじめに</h3>
  <p>このリソースにおいては、HTMLやCSSを<em>正しく理解</em>してゐる閲覧者を対象としてゐる。申し訳ないが、それらを理解してゐない閲覧者の方は、優れた入門者用の解説サイトが沢山あるので、そちらを参照していただきたい。それらは<a href="../links/index.html">Links</a>のHTMLやCSSの項目でリンクしてるので、どうぞ。</p>
  <p>また、ある程度理解されてゐる方はお分かりになると思ふが、ここでは殆ど理論上の話をしてゐる。実際のUAでの表示等の問題は、文脈上省いてゐる。しかし、そのやうな方々は、すでにその問題の解決法をご存知でせうから、注釈も付けてゐません。</p>

<h3>限界と可能性</h3>
  <p>リニアでフラットな論理構造を目指す<a href="http://www.cs.tcd.ie/15445/15445.HTML">ISO/IEC 15445:2000</a>（ISO-HTML）では、いくら<q cite="http://members.jcom.home.ne.jp/pctips/15445/15445Merit.html" title="ISO/IEC 15445:2000(ISO-HTML)を採用する利点">ISO/IEC 15445:2000準拠でも、ヴィジュアル面で一般的なサイトに劣らないサイトを構築する事は可能</q>と言つても、やはり限界がある。例へば、ここのリソースのソースを見てもらいたいが、ほとんどdiv要素を使つてゐない。本来ならば、h3直下の文書に対して、<code>&lt;div class="document"&gt;&lt;p&gt;なんとかかんとか&lt;/p&gt;&lt;/div&gt;</code>とでもして、CSSによる装飾をほどこしたいところであつたが、その中に見出し要素が出現する可能性も考へれば、出来なかつたのだ。（もちろん、不可能ではないが、文書の普遍性――サイト全てのHTML文書に適用可能かということ――を考えればできない）</p>
  <p>しかし、ストイックに考へれば、その中で作り出されたものでも良質であれば、一般から見れば（HTML 4.01等）もつと素晴らしいものになるはずである。限定された中で生まれる産物に、悪いものはない。</p>

<h3>div要素の代替案</h3>
  <p>そこで、私が考へたのは、div要素を使わないデザインの方法であつた。そもそもdiv要素は、class属性などで制作者が意味づけをするといふだけで、それ自体にあまり意味はない。殆どの場合において、ビジュアル方面で役に立つてゐると言つて良いと思ふ。（それがいはゆるdiv厨に繋がつてゐることは明白）さういふところのデザインを見れば、いくつかの特徴を知ることが出来る。</p>
  <ol>
    <li>統一感がある（marginやpaddingをとりやすい）</li>
    <li>background-image等の画像での装飾がある</li>
    <li>段組がある</li>
  </ol>
  <p>等々……。これらを、ISO-HTMLでも遜色なく実現できるのか、あるいは、別の方法があるのか、といふ風に考へればよい。</p>
  <p>一つ一つ潰して考えよう。まづ一つ目。デザインにおいて、基本であり重要である要素に、「強調」「反復」「近接」「整列」とがあることは有名であるが、div要素によつて囲ふことで、少なくとも近接（関係のあるものを一つにまとめ、関係のないものは離す）と整列（左揃えや右揃え等）が一気にでき、それゆゑ統一感ができる。これを、div要素を使はずにデザインするにはどうするか。実は、これは実現可能である。誰でも思ひつくやうに、各要素ごとに細かくmarginやpaddingを指定すればよいのである。その時に、前述したデザインの基本を抑へれば、崩れることはない。また、細かく指定することで、marginを自在にかつ容易に設定できるやうになる。div要素が単純な整列に向くとしても、それだけであつて、逆に制約にとらはれないデザインをするには、中々厄介なCSSを作らねばならないが、ISO-HTMLでは容易である。私の例で言えば、h3要素がそれである。<ins>デザイン変更によりこれはなくなつた。</ins></p>
  <p>次に二つ目。私は、この問題に関して、殆ど見切りをつけた。といふのは、画像といふものが伝へる情報の価値を徹底的に疑つたのだ。そして、私は元々シンプルであるものが好きなので、画像を使はずにデザインをするといふことが、それほど苦ではなかつたのだ。それでも、やはり画像を使つたはうが良い、あるいは、好きだ、といふ人は、どうすれば良いのか。これは、マークアップを見直すことで半分近くの人は解決できると思ふ。何もISO-HTMLは、div要素を使ふなとは言つてゐない。ただ、その中に見出し要素が含まれてゐてはだめだといふだけである。だから、div要素内にある見出し要素は、本当に必要なのか、ひよつとしたら、他の要素で代替できはしないか、よく考える必要がある。それは、好ましいマークアップになるといふことでもあるのだから。さうすれば、多くの画像を使つてのデザインも可能となるだらう。しかし、それでも不可能である場合は、諦めるしかない。</p>
  <p>最後に三つ目。段組について。最近になつて、段組は本当に必要なのか、といふことが問はれている</p>
  <blockquote cite="http://members.jcom.home.ne.jp/jintrick/Personal/d20039l.html#d16_1" title="段組の利点 - 3つの情報ブロックがある場合">
    <p>右（或いは左）に「関連記事へのリンク柱を設ける」という方法は、はっきりいって<em>全然駄目</em>です。何故なら、「どのようにその文書と関連しているのか」という最も重要な説明を妨げるからです。</p>
  </blockquote>
  <p>これにはまつたく同感である。私も常々思つてゐたが、段組によつて本文との関連性が断たれるならば、その利益はないに等しく、また、閲覧者にいらぬ労力を強ひるといふ点で、廃されるべきデザインだ。さうであるならば、段組しようといふ意思さへも否定されるだらう。しかし勿論、段組によるデザインの方が良い場合もあるわけで、それは、indexのやうなコンテンツを並べるだけのリソースの場合だらう。その場合は、前述の二つ目で言つたやうに、div要素を使つての段組が適切である。ただし、その中に見出し要素が出現するといふ可能性を除けば――。</p>

<h3>まとめ</h3>
  <p>以上述べたやうに、多くの人が準拠してゐるHTML 4.01でのデザインを、丸々ISO-HTMLで実現することは、不可能である。しかし、それとは方向性を変えることによつて、それと同等、それ以上のものを作ることは可能である。自分の能力を知る、あるいは伸ばすといふ点からも、ISO-HTMLでのデザインを、私は強く勧めたい。</p>

<h2>この文書について</h2>

<h3 lang="en">start and updating date</h3>
  <ul lang="en">
    <li>start:2003/12/4</li>
    <li>updating:2004/4/28</li>
  </ul>
</body>

</html>