初心者のためのホームページ作り:第78号

                  毎週金曜日配信 What's New 2003/12/12
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

  ┏┏┏┏   初心者のためのホームページ作り/Web for beginner
  ┏┏┏         http://www.scollabo.com/banban/
  ┏┏
  ┏              <第78号>

                banban@scollabo.com

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

 当講座は、初心者や中級者が正しい文法と作法を身につけて、プロ級の本格的
な Webページ作成に役立つことを目的に配信されております。

 当講座では HTML4.01、XHTML1.1、XML1.0 を中心とした文法が主体となってい
ます。なお、このマガジンは等幅フォントでお読みいただくと快適に読めるよう
になります。

  今週のコンテンツ
      ■ Webデザイン 第22回 --- プライバシーポリシー
   ■ HTML講座  第22回 --- 引用文
   ■ XML初級講座 第14回 --- 名前空間その2
    ■ 属性の解説(第7回) --- title属性

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆Webデザイン(第22回) プライバシーポリシー

 もしあなたのサイトがユーザから何らかの入力を受け付ける場合、あるいは、
ユーザからメールをもらう場合、最後までその責任を全うしなければなりません。
 訪れるユーザは、ある意味では無防備かもしれません。そうしたユーザに対し
て安心感を与えるのが「プライバシーポリシー:個人情報の扱い」です。

 今年も多くの有名企業サイトから、個人情報の漏洩事件が相次ぎました。その
多くが、企業サイト内部の人間による情報の持ち出しでした。また、中にはサイ
ト内のサーバに設置したデータベースから個人情報がページに表示されるという
大変お粗末な事件もありました。

 事件を起こした企業の責任者の弁では、「今回の経緯を踏まえ、今後2度とこ
うした不祥事を防ぐ」というものですが、そもそも不祥事を起こした事態に、企
業の理念を疑わざるを得ません。はっきり言えば、プライバシーポリシーを持っ
ていないのです。そんな企業は Webの世界から撤退して欲しいものです。

 現在のセキュリティの実態を考えると、狙われているのはサーバばかりではあ
りません。あなた個人のコンピュータも狙われているのです。
 特に、常時接続が当たり前になっているブロードバンド環境では、いっそうそ
の脅威にさらされています。率直なところ、個人のコンピュータを攻撃するのは
至極簡単です。ほんの少しネットワークに関する知識とプログラミングができる
のなら、中学生にだって他人のコンピュータをクラッキングできます。

 ネットワークに安全はない、というのが私の持論です。だからこそ、それなり
の防衛方法を考えなければなりません。私の場合は常に、第三者にコンピュータ
を乗っ取られたということを想定しています。
 読者から頂くメールのすべては専用のコンピュータを使用し、受信後すぐに印
刷して、メールデータをコンピュータから抹消します。

 例えば未知のウィルスに感染したとします。あるいは、ソフトウェアの脆弱性
によって第三者にコンピュータを乗っ取られたとします。もし、そのコンピュー
タに重要な情報や読者のメールアドレスなどがあった場合、その情報を盗まれた
り、そのメールアドレスにウィルスを発信する可能性が考えられます。
 中学生にも乗っ取られるような現実の世界を考えれば、データやメールアドレ
スはコンピュータに置いておくわけには行きません。つまり、万が一の事態に備
えるため、古いコンピュータをメール専用としているのです。

 メールマガジンを発行し Webサイトを運営している私にとっては「最低限」の
プライバシーポリシーであると自負しています。そこで知りえたメールアドレス
や読者の情報は、当然、他人に教えることはありません。それは何よりも読者を
守ることは当然ですが、私自身も守ることにもなるのです。
 信頼を持ってメールしていただく読者の皆様を裏切ったのでは、私自身を滅ぼ
す結果となることは明らかです。

 セキュリティやプライバシーポリシーを現状の Webと照らし合わせて考えると
ファイヤーウォールやウィルス対策ソフトなどは決して安心できません。そうし
たソフトやハードに「絶対」はないのです。

 信頼されるサイトとは、豊富で有用な情報を提供するだけではありません。私
なりの考え方としていえるのは、作者とユーザの双方が信頼し合えるという共通
の認識さえも重要と捉えています。

                     (第23回 色の不思議につづく)

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆HTML講座 (第22回) 引用文

 今回のHTMLは、ページの中で利用する「引用」について解説します。
HTMLでは、引用に関するタグが2つ用意されています。1つがインラインレベル
で、もう1つがブロックレベルとなっています。

 ■インラインで利用する引用
 インラインとは、普通の文字列の中で表わされる要素で、これといって余白や
 改行などは持っていません。HTMLの文書構造の中で、インラインレベル要素は
 必ず、ブロックレベル要素中に配置しなければならない約束があります。

  インラインで引用を表わすのは q要素です。視覚系ブラウザの中には、この
 要素で囲まれた文字列に引用符が表示されるものがあり、それが「引用」であ
 ることを示しています。

 q要素の記述法

 <p>
  初心者のためのホームページ作りは、<q>W3C</q>を手本として
 コンテンツを作成しています。
 </p>

 q要素の属性
 q要素では引用先を示す属性に cite属性が定義されています。この属性では、
 引用先のアドレスを記述するのが一般的です。

 <p>
  初心者のためのホームページ作りは、<q cite="http://www.w3.org/">W3C</q>
  を手本としてコンテンツを作成しています。
 </p>

  cite属性は、非視覚系ブラウザなどでその引用先を表示することがあります。
 アクセシビリティを考えるのなら、引用先の情報として、cite属性を明記する
 ことは、言うまでもありません。

 ■ブロックレベルで利用する引用
 ブロックレベル要素とは、この講座でも何度かお伝えしているとおり、文書の
 構造体を成す有用な役割があります。そのため、基本的にインラインレベル要
 素は、必ずブロックレベル要素内に配置されなければなりません。

  引用を表わすブロックレベルは、blockquote要素です。この要素を使った場
 合、一般的な視覚系ブラウザでは、全体がインデント(字下げ)されて表示し
 ます。blockquote要素は q要素のような短文の引用ではなく、長文にわたる引
 用の場合に適した要素です。

  <blockquote>
  <p>Webにおけるアクセシビリティを実現するために、
   〜 中略 〜
  その意味でも、alt属性は必須といえることができるでしょう。</p>
  </blockquote>

 blockquote要素の属性
 基本的な汎用属性以外では q要素同様、cite属性のみが定義され、引用先の情
 報を伝えます。利用方法も q要素とまったく同じです。

  初心者に多く見かける誤りに、blockquote要素をインデントという見栄えの
 ためだけに利用することがあります。この要素はあくまで長文の引用を示すも
 のであり、見かけ上の造作を提供するものではありません。インデントを見栄
 えとして設定したい場合には、他の有用な方法がありますので、そちらを利用
 するようにしてください。

 blockquote要素を利用する際の注意点
 この要素はブロックレベル要素なのですが、HTML4.01Strictで用いる場合には
 この要素の直下でテキストを記述することができません。何らかのブロックレ
 ベル要素内で配置するように求められています。
  ある意味冗長的ですが、blockquote要素は引用を示すための領域しか提供し
 ていない、と判断してください。この扱いは、body要素と同じであることに気
 がつくでしょう。
  なお、HTML4.01Transitionalでは、特にこの要素内で記述するテキストには
 他のブロックレベル要素内で配置する必要はありません。

 ■まとめ
  要素にはそれぞれの役目を持った機能を提供するものとして定義されていま
 す。難しく述べると、それぞれの構造にマッチした要素型が定義されていると
 いうことでしょう。
  そうした仕様書とはまったく別の使い方をすることは、ユーザエージェント
 などの仕様を無視するのと同じことであり、自殺行為に等しいものです。

  例えば、見出し要素を文字の大きさの変化に利用したり、引用要素を字下げ
 の見栄えに使ったりすることは、HTMLを冒涜しているとしか思えません。その
 ような作り方では、その情報を正しく万人に伝えることができません。

  たかが blockquote要素1つで、大仰なことと思うかもしれませんが、この
 要素に限らず声を大にして言いたいのです。正しいHTMLのために・・

  次回は「ボックス」に関して詳しく解説します。今回の解説にも連動した内
 容となることでしょう。

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆XML初級講座(第14回) 名前空間その2

 今回は、名前空間を利用して XHTMLで MathMLを表現したいと思います。
なお、XHTMLは、XMLのサブセットとして定義されていますので、この XML初級講
座とは決して無関係ではないということをお断りします。

 XHTMLを採用したのは、XSLを利用しなくても良いという単純な発想です。ただ
し、XHTMLを保存する際の拡張子は「.xhtml」になりますので注意してください。
残念ながらこの拡張子では、MSIEはサポートしていません。というよりもMSIEが
実装している XMLパーサ(MSXML)にバグがあると言った方がいいでしょう。
 (来春予定している WindowsXP専用として MSIE6.05 に期待するところです。)

 なお、MSIEでは Design science社の MathPlayerをインストールすれば表示で
きるようです。その際には、拡張子は「.html」になりますので注意してください。

   Design science社の MathPlaye(フリーの30日間評価版)
    http://www.dessci.com/jp/ (日本語版)

 また、Operaブラウザでは拡張子 .xhtml はサポートしていますが、 MathMLに
ついては実装していないため、正しく表示することができません。
 いずれにせよ、MSIEおよび Operaでは MathML はサポート対象外です。その点
を含んでお読みください。

 今回作成する XHTML文書は、Mozilla、Netscape、Amaya の Webいずれかのブ
 ラウザで閲覧していただくようお願いします。これらのブラウザは、ほとんど
 のプラットフォームに対応していますので、あなたの環境(OS)に合わせてイ
 ンストールしてください。

 各ブラウザのダウンロードは以下のとおりです。(すべて日本語版です)
   Mozilla  http://jt.mozilla.gr.jp/download.html
   Netscape  http://wp.netscape.com/ja/downloads/
   Amaya      http://www.w3.org/Amaya/

 (1つの OS で複数のブラウザをインストールすることができるのか、といっ
  た質問をよく寄せられていますが、まったく問題ありません、可能です。
  ただし、それぞれの OS に対応したブラウザであることが前提です。)

 ■MathMLとは(マスエムエルと発音します)
 例えば、2+3=5、などといった簡単な数式はテキストレベルで表現するこ
 とが可能です。しかし、対数や微積分などの高等数学で利用する数式を表わす
 ことは、HTMLでも XMLでも表現することができません。
  そうした数式全般にわたる表現に特化したマークアップ言語が、MathML、正
 しくは、Mathematics Markup Language です。

  MathMLは、1998年4月に、W3Cより Version 1.0 が正式勧告されています。
  (なお最新版として、MathML2.0 が勧告されています。)
  MathMLでは数式の表記と、数式の意味を伝えるための2種類のタグが用意さ
 れています。

  MathML文書は単独で使用されるほか、他の XML文書や XHTMLで記述されたペ
 ージに数式を埋めこむ際に使われることを強く意識しており、最近では Webブ
 ラウザでも対応が進むものと考えられています。

  MathMLでは、記述した数式の答えを SVG(注1)によって描画することがで
 きます。つまり、MathMLは単に数式を表すだけでなく、数式の意味を理解する
 言語であるとお考えください。

 ■MathMLと名前空間
 XMLや XHTMLでは MathMLを利用するために名前空間を用います。前回説明した
 とおり、名前空間とは、既に公開されているスキーマを「借りる」ために利用
 することができる XML最大の拡張した仕様です。

  通常、MathMLを名前空間を使って利用するためには、その接頭辞は「m:」が
 定義されています。これは XMLや XHTMLで使われる要素型と区別するために設
 けられています。
  ただし、今回作成する文書では、MathMLが持つ要素名と XHTMLが持つ要素名
 が衝突するわけではないため、あえて接頭辞は設けていません。

 ■MathMLの作成
 では、さっそく名前空間を利用して、MathMLを XHTML野中に取り込んで数式を
 表現してみましょう。
  テキストエディタを起動して以下のように入力してください。

<?xml version="1.0" encoding="Shift_Jis" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <!-- 改行せずに1行で -->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="application/xhtml-xml; 
charset=Shift_Jis" /><!-- 改行せずに1行で記述 -->
<title>MathML</title>
</head>

<body>
<h1>MathML Sample Data</h1>
<p>
<math xmlns="http://www.w3.org/1998/Math/MathML">
    <mrow>
      <mi>x</mi>
      <mo>=</mo>
      <mfrac displaystyle="true" scriptlevel="0" >
        <mrow>
          <mrow>
            <mo>-</mo>
            <mi>b</mi>
            <mo>&#177;</mo>
            <msqrt>
              <mrow>
                <mrow>
                  <msup>
                    <mi>b</mi>
                    <mn>2</mn>
                  </msup>
                  <mo>-</mo>
                  <mn>4</mn>
                  <mi>a</mi>
                  <mi>c</mi>
                </mrow>
              </mrow>
            </msqrt>
          </mrow>
        </mrow>
        <mrow>
          <mrow>
            <mn>2</mn>
            <mi>a</mi>
          </mrow>
        </mrow>
      </mfrac>
    </mrow>
  </math>
</p>

<p>
  <math xmlns="http://www.w3.org/1998/Math/MathML">
    <mrow>
      <mi>a</mi>
      <mo>=</mo>
      <mrow>
        <mo>(</mo>
        <mrow>
          <mtable>
            <mtr>
              <mtd columnalign="center" >
                <mrow>
                  <mn>1</mn>
                </mrow>
              </mtd>
              <mtd columnalign="center" >
                <mrow>
                  <mn>2</mn>
                </mrow>
              </mtd>
            </mtr>
            <mtr>
              <mtd columnalign="center" >
                <mrow>
                  <mn>3</mn>
                </mrow>
              </mtd>
              <mtd columnalign="center" >
                <mrow>
                  <mn>4</mn>
                </mrow>
              </mtd>
            </mtr>
          </mtable>
        </mrow>
        <mo>)</mo>
      </mrow>
    </mrow>
  </math>
</p>

</body>
</html>

 入力が終わりましたら、文書名に任意の名前を付けて保存します。保存の際の
 拡張子は、「.xhtml」としてください。
  「.html」でも表示可能ですが、環境によっては何も表示されない場合があり
 ます。本来ならば XHTMLの拡張子は「.xhtml」なのですが、古いブラウザとの
 互換性を重視するために「.html」が使われています。

  最新の Webブラウザでは、MSIEを除くブラウザでこの拡張子がサポートされ
 ています。マイクロソフト社では XMLに特化したソフトウェア戦略を展開して
 いますので、いずれ完全な XHTMLが実装されるだろうと予想しています。

  なお、構文は見やすいことを目的としてかなりのスペースを使っています。
 コピーして利用する際には、すべての余白を削除してからお使いください。

  MathMLサンプル実行結果
  http://www.scollabo.com/banban/magazine/mm/sample_78-1.xhtml
  (注意:MSIE不可)

◆解説

■<?xml version="1.0" encoding="Shift_Jis" ?>

 XHTMLは、XMLのサブセットです。つまり XML文書であることを意味しています。
 そのため、冒頭で XML宣言を行います。省略することは可能ですが、それには
 利用する文字符号コードが、Unicode であることが前提条件となります。


■<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <!-- 改行せずに1行で記述 -->

 XHTML文書の文書型定義(DTD)を指定しています。XHTML必須の構文です。


■<html xmlns="http://www.w3.org/1999/xhtml">

 XHTMLで利用するための名前空間を指定しています。なぜか今のところ、この
 構文は必須条件です。
  本来ならば文書型定義を宣言しているにもかかわらず、名前空間で XHTMLの
 スキーマを指定しなければならないという矛盾があります。これについては、
 Tipsの項で詳しく解説します。


■<meta http-equiv="Content-Type" content="application/xhtml-xml; 
charset=Shift_Jis" /><!-- 改行せずに1行で記述 -->

  XHTML文書を「.xhtml」という拡張子を持った文書として保存する際には、そ
 のMIMEタイプを明記する必要があります。この記述は主に、ユーザエージェン
 ト(注2)に渡す情報として(メタ情報)明記します。
  なお HTML文書として保存する場合には、従来どおり「text/html」とします。

■<math xmlns="http://www.w3.org/1998/Math/MathML">

 MathMLのマークアップ言語を利用するために、そのスキーマを指定した名前空
 間を記述しています。これによって XHTML文中で直接、MathMLを書くことがで
 きます。


◆MathMLの解説について
 MathMLの要素型についての解説は行いません。解説を加えるとなるとかなりの
原稿量になってしまいます。それこそ10週分くらい必要となってきますので、こ
こではあえて触れません。折がありましたら、特集を組んで解説を加えていこう
と思います。ただし残念ながら XML講座は今月中で終了する予定です。ご了承く
ださい。(いずれ Webサイトでご紹介しようかと考えています。)

 皆様が本気でMathMLに取り組むのであれば、下記サイトを推奨します。じっく
りと腰を落ち着けて学んでください。

 MathML関連サイト
 http://washitake.com/MathML/ (和志武功久氏 W3C版の日本語バージョン)
 http://www.w3.org/Math/ (W3CのMathML公式サイト:英語バージョン)


(注釈用語解説)

 ■注1:SVG(Scalable Vector Graphics)
 SVGとは、W3Cが提唱する、新しい可能性を秘めた、グラフィックス用の XMLベ
 ースのマークアップ言語です。テキストベースで記述した言語によって、ベク
 トル形式のダイナミックなグラフィックを生成します。

  XML、XHTMLで利用する場合、名前空間を用いて SVGのボキャブラリを利用す
 ることができます。
  今年2003年3月には、プラグインツールを必要としない SVG 1.1 が正式に勧
 告されています。

  SVG関連サイト : http://www.w3.org/TR/SVG/intro.html


 ■注2:ユーザエージェント(UserAgent)
 インターネットのスキーム http が利用可能なソフトウェアをユーザエージェ
 ントと呼び、一般的には Webブラウザやプロクシなどを指します。

  W3Cは、http が利用可能なソフトウェアが Webブラウザだけではないとして
 ブラウザを含めたソフトの総称として、ユーザエージェントと呼ぶことにして
 います。

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆Tips --- XHTMLの文書型定義と名前空間の関係

 XHTMLでは、XML宣言後に DTDを明示するように求められています。そしてルー
ト要素(html)で、名前空間を使って XHTMLの規格を指定するという冗長的な規
則があります。何故このようなことを記述するのでしょうか?

 ■厳密適合文書(Strictly Conforming Document)
 XHTMLでは、DTDを指定して妥当な検証済み XML文書として使用することも、あ
 るいは DTDを指定しないで整形式 XML文書として使用することも可能です。

  DOCTYPE宣言を使用して、W3Cが指定する DTDを指定し、htmlをルート要素と
 し、かつ、htmlタグで xmlns属性に XHTMLの名前空間を指定してある文書が、
 XMLパーサによる DTDとの妥当性検証に合格すると、その文書を 厳密適合文書
 と呼びます。

  しかし、XHTML文書で別の名前空間の要素を使用すると、W3Cが用意した DTD
 では検証できなくなります。別の名前空間の文書型定義が W3Cの DTDに追加す
 る手法が開発されたり、XML Schemaの仕様が、こうした要件を満たすようにな
 れば、状況は変化しますが、現在のところ XHTMLで別の名前空間を使用するこ
 とができないのが実情です。

  何度も言うように、XHTML文書とは、XML文書であるため、そうした検証済み
 の文書を作成しなければ、Web上で再配布(閲覧)することができません。
  W3C以外の名前空間を用いる場合には、XML文書として作成し、XSLTを使って
 ブラウザ上で表現するようにしなくてはなりません。

  現在の Web上で配布される XHTML文書が「厳密適合文書」であることが前提
 となっていることを考えると、残念ながら DTDと名前空間の両方を記述する必
 要があります。

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆HTML、XHTML 属性の解説 --- title属性

 title属性は、要素の補足的な説明を加える属性で、ほとんどの要素型に利用
 できるため、「汎用属性」として定義されています。

 ■title属性  要素の補足説明
 DTD:    すべての文書型定義で利用可能
 属性値:  テキスト(CDATA)
 記述法: <a href="index,html" title="ホームに戻る">Home</a>
 関連要素: ほとんどの要素

 XHTMLの制限:特にありません。

 この属性を記述した要素は、視覚系ブラウザではツールチップ(マウスを近づ
 けると表示される)が表示されることがあります。
  非視覚系ブラウザでは、要素の補足的な説明文としての役割があり、要素と
 共にレンダリングされます。難しい専門用語などを利用するときには便利な属
 性となります。

  ウェブ・アクセシビリティ・ガイドラインでは、適切な補足説明を加えたコ
 ンテンツ作成を望んでいます。専門用語、語彙、リンクなどでは有効に作用し
 ますので、積極的にこの属性を利用するといいでしょう。

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

今回はここまで、ではでは・・
今週のおさらいは Webページにも掲載しましたので、是非見ておいてください。
Webページでは HTML文の実行結果のサンプルもあり、より分かりやすく説明して
います。あわせて過去の記事のおさらいも掲載しています。

 (今週のおさらい)
  http://www.scollabo.com/banban/magazine/review_078.html

 次週は、急な海外出張の予定がありますので、ことによってはお休みするかも
しれません。その際には改めてご案内いたします。

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

質問・ご意見ははこちらまで→ banban@scollabo.com

 なお、ご質問の際には、あなたがお使いのOSや Webブラウザ、テキストエデ
ィタなど、なるべく分かりやすく制作環境を明記していただけると回答しやすく
なると思います。
 ただし、個人的な事由により返事が遅れることがあります。ご了承ください。
お急ぎの場合には、当サイト内の掲示板をご利用ください。きっと誰かが答えて
くれると思います。

発行者 ばんばん
協 力 スズキ・コラボレーション http://www.scollabo.com/
配信エンジン まぐまぐ http://www.mag2.com/  (ID 0000090196)

 誤字・脱字・変換ミス・表現欠乏などには、平にご容赦願います。

バックナンバー こちらで公開しています。
プレーンテキスト  http://www.scollabo.com/banban/magazine.html
各号のおさらい  http://www.scollabo.com/banban/magazine/
アーカイブ    http://www.scollabo.com/banban/daf/archive.html
まぐまぐの過去記事 http://backno.mag2.com/reader/Back?id=0000090196

配信の変更・中止はこちらです。
個別の手続きは受け付けていませんので、ご面倒でも各自でお願いできれば助か
ります。
当サイトにて http://www.scollabo.com/banban/magazine/top.html
まぐまぐにて http://www.mag2.com/m/0000090196.htm

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

<えでぃた〜ず・る〜む>

 街を歩くとクリスマスの雰囲気で満ちていることに気がつきます。年の瀬だと
いうのにその実感がないのは年齢のせいかな、と思うことがあります。

 子供の頃には、ジングルベルに心がウキウキして、早くお正月がこないかなと
はしゃいでいたものですが、年をとるたびにそんな無邪気な気持ちが薄れていき
ます。でも、忙しいだけの12月は嫌いだな。

□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□

◆著作権について
個人がご自分のPCに保存して利用する以外の記事の転載、引用は基本的に応じ
ておりません。記事中の内容について、無断で使用することを固く禁じます。
 なお、記事中のスタイルシート、HTML、スクリプトなどをご自分のページ作成
に自由に使っていただいても差し支えありません。

            Copyright(C) 2002-2003  www.scollabo.com/banban/
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□



最新更新日 2003/12/23
Copyright(C) 2002-2003 banban@scollabo.com