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

                   毎週金曜日配信 What's New 2003/8/22
〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓
       初心者のためのホームページ作り/Web for beginner
           http://www.scollabo.com/banban/

                <第63号>

            wfb-org@jcom.home.ne.jp
        (初心者のホームページ作り臨時制作委員会)

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

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

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

  今週のコンテンツ
      ■ JavaScript講座 第12回 --- フォームの入力をチェックする
   ■ インターネット用語解説  第1回 --- DNS
    ■ アンケート統計結果

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

◆JavaScript講座(第12回) フォームの入力をチェックする

 今回は、フォームに関するスクリプトです。ユーザからの入力に際し、その項
目をチェックして、再度正しい入力を促すスクリプトを作成します。

 まず、仕組みを理解していただくために簡単なスクリプトを作ります。

 ■JavaScript
	<script type="text/javascript">
	<!--
	function che(mailad) {
	  if (mailad == ""){
	  alert("メールアドレスを入力してください");
	}
	   else if (maillad.indexOf("@", 0) < = 0){
	   alert("メールアドレスが正しくありません");
	   }
	}
	//-->
	</script>

 ※JavaScriptは、ヘッダ部 <head> 〜 </head> 内に配置します。

 ■HTML
	<body>
	<p>メールアドレスを記入してください。</p>
	<form action="#" method="post">
	  <div>
	  <label>E-mail:
	  <input type="text" size="20" onblur="che(this.value)">
	  </label>
	  <input type="submit" name="Submit">
	  <input type="reset" name="Reset">
	  </div>
	</form>
	</body>

 ■解説
 メールアドレスが入力されているかどうか、あるいはその内容が正しいかどう
 かを判断するための関数を設定しています。

 if(mailad =="")
 これは、メールアドレスの入力が何もない場合に、ブロックを実行する構文で
 す。何かしら入力されていれば、ブロックのプログラムを実行しません。

 alert("メールアドレスを入力してください");
 メールアドレス入力欄に何も入力されていない場合に、警告のウィンドウを表
 示して入力を促すブロックのプログラム。

 else if(maillad.indexOf("@",0) < = 0)
 入力欄の内容を確認するスクリプトです。入力された中身に 「@」がなかった
 場合、ブロック内のプログラムを実行します。
  indexOf メソッドを実行した結果、その値が 0 より小さい場合に、ブロッ
 クを実行します。

  indexOf とは、値が取り込まれた変数、もしくはフォーム内のデータを検索
 する Stringオブジェクトのメソッドで、詳しくは以下のとおりです。
  ここでは「@」の検索を行っています。

  indexOf
    構文:文字列.indexOf(検索文字列、検索位置)
  文字列から指定した位置からの文字を検索、参照します。一致した文字列が
  なかった場合には、-1 を返します。なお、検索対象となる文字列に、変数
  を指定することも可能です。 

 <form action="#" method="post">
 本来ならば、action属性には、データを送信する先の URLを記述します。ここ
 では便宜的に「#」としましたが、実際には CGI や、メールアドレスなどが適
 用されます。

 <div> 〜 </div>
 フォーム内の記述は基本的にブロックレベル要素で配置しなければなりません。
 そのため、汎用的に利用できる div要素で囲みました。

 <label> 〜 </label>
 入力フィールドにラベルをつけて、ユーザが何を入力するのかを理解させるた
 めに設定しました。

 <input type="text" size="20" onblur="che(this.value)">
 ここでは、20文字分の入力フィールドを形成していますが、入力文字数の制限
 はありません。
  onblur とは、フォーカスを失う、つまり入力フィールドからカーソルが離れ
 た時に発生するイベント属性です。
  this とは、このフォームという意味を持ち、複雑なプログラムなしに 関数
 を呼び出すために用いられる制御文です。

  this.value は、入力フィールドに入力された値を示します。この値は スク
 リプトで示された mailad変数に取り込まれます。

  サンプル実行結果
  http://www.scollabo.com/banban/magazine/mmsample/sample_63-1.html

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

◆複数の入力項目をチャックする

 次に、複数の入力フィールドに対して送信時に各項目をチェックするスクリプ
トを作成しましょう。
 基本的には、最初のスクリプトに準じますが、今度はラジオボックスなどの入
力を検索してチェックします。
 また、メールアドレスのチェックでは「正規表現」を利用して、かなり細かい
チェックを行えるようにしました。


 ■JavaScript(ヘッダ部 <head> 〜 </head> の間で記述)

 <script type="text/javascript">
 <!--
 function formVal(theForm){
  if (theForm.who[0].checked == false && theForm.who[1].checked  
    == false && theForm.who[2].checked  
    == false && theForm.who[3].checked 
  == false && theForm.who[4].checked  == false) {
		   alert("ご質問カテゴリーをお選びください。");
		   theForm.who[0].focus();
		   return (false);
	    }

	  if (theForm.name.value == "") {
		   alert("お名前を入力してください。");
		   theForm.name.focus();
		   return (false);
	   }

	  if (theForm.email.value == "") {
		   alert("メールアドレスを入力してください。");
		   theForm.email.focus();
		   return (false);
  	}

    if (theForm.qa.value == "") {
		   alert("ご質問内容を入力してください。");
		   theForm.qa.focus();
		   return (false);
  	}

  var emailStr = theForm.email.value
  var emailPat=/^(.+)@(.+)$/
  var specialChars="\\(\\)<>@,;:\\\\\\\"\\.\\[\\]"
  var validChars="\[^\\s" + specialChars + "\]"
  var quotedUser="(\"[^\"]*\")"
  var ipDomainPat=/^\[(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})\]$/
  var atom=validChars + '+'
  var word="(" + atom + "|" + quotedUser + ")"
  var userPat=new RegExp("^" + word + "(\\." + word + ")*$")
  var domainPat=new RegExp("^" + atom + "(\\." + atom +")*$")
  var matchArray=emailStr.match(emailPat)

  	if (matchArray == null) {
		  alert("メールアドレスが正しくありません。")
		  return (false)
	  }

  var user=matchArray[1]
  var domain=matchArray[2]

  	if (user.match(userPat)==null) {
	     alert("メールアドレスが正しくありません。")
	     return (false)
	  }

  var IPArray=domain.match(ipDomainPat)

    if (IPArray!=null) {
     for (var i=1;i<=4;i++) {
       if (IPArray[i]>255) {
		        alert("メールアドレスが正しくありません")
			      return (false)
		      }
	     }
     }

  var domainArray=domain.match(domainPat)

    if (domainArray==null) {
      alert("ドメイン名がありません。")
      return (false)
     }

  var atomPat=new RegExp(atom,"g")
  var domArr=domain.match(atomPat)
  var len=domArr.length

    if (domArr[domArr.length-1].length<2 ||
      domArr[domArr.length-1].length>3) {
       alert("メールアドレスが正しくありません。")
       return (false)
    }

    if (len<2) {
      var errStr="メールアドレスにドメイン名がありません。"
      alert(errStr)
      return (false)
      }
  }
// -->
</script>



 ■HTML構文

  <body>
  <h1>ご質問受付</h1>
  <form name="mailform" onsubmit="return formVal(this);" action="#">
  <dl>
  <dt>ご質問カテゴリー</dt>
  <dd><input type="radio" name="who">HTMLについて</dd>
  <dd><input type="radio" name="who">CSSについて</dd>
  <dd><input type="radio" name="who">JavaScriptについて</dd>
  <dd><input type="radio" name="who">XHTML、XMLについて</dd>
  <dd><input type="radio" name="who">その他</dd>
  </dl>

  <table cellspacing="0" cellpadding="3" summary="名前と E-Mail 入力欄">
  <col width="200">
  <tr><td>Name:</td>
    <td><input size="30" name="name" value=""></td></tr>
  <tr><td>E-mail:</td>
    <td><input size="30" name="email" value=""></td></tr>
  </table>

  <dl>
  <dt>ご質問内容をお書きください。</dt>
  <dd><textarea rows="6" cols="50" name="qa">質問</textarea></dd>
  </dl>       
  <p>
  <input type="submit" value="送信" name="submit"> 
  <input type="reset" value="取消" name="reset">
  </p>
  </form>
  </body>


  サンプル実行結果(スタイルシートを使っています。)
  http://www.scollabo.com/banban/magazine/mmsample/sample_63-2.html


◆解説

JavaScriptより

■function formVal(theForm) {

 関数を設定します。関数名は、formVal() で、引数にある theFomr は、この
 HTML文に存在する form要素を指定しています。
  関数におけるプログラムは、{ から、最後の } までの範囲です。


■if (theForm.who[0].checked == false && theForm.who[1].checked  
== false && theForm.who[2].checked  == false && theForm.who[3].checked 
== false && theForm.who[4].checked  == false) {

 最初のフォーム内にある「who」という名前の入力フィールドを調べています。
 最初に入力フィールドは、4つのラジオボタンになっており、通常、1つしか
 選択することができません。ここでは、1つ1つのラジオボタンを調べて、選
 択されていなかった場合に、ブロックにあるプログラムを実行します。

 checked == false とは、ラジオボタンが選択されていないことを意味してい
 ます。選択されていれば true になるので、ブロックのプログラムは実行され
 ません。次の if構文に移動します。

  == とは、比較演算子の1つで、「等しい」という意味があります。
 && は、2つの論理積を求める演算子で、2つが真(true)ならば、true を与
 えます。ここでは、4つのラジオボタンを検索して、それぞれの値が true か
 あるいは、false(偽)かを調べています。何も選択されていないと false と
 して処理します。


■alert("ご質問カテゴリーをお選びください。"); theForm.who[0].focus();
return (false);

 ラジオボタンが何も選択されていない場合には、このブロックのプログラムを
 実行します。

 alert は、警告のウィンドウに引数のテキストを伴って表示します。
 theForm.who[0].focus()  は、警告ウィンドウを閉じたときに、フォーカスを
 最初のラジオボタンに当てます。つまり、マウスカーソルが選択状態になるこ
 とを意味しています。

 return (false); は、入力フィールドの値を初期値(何もない状態)にするた
 めの「戻り値」となります。何も値がない状態は「false 偽」となります。


■if (theForm.name.value == "") { alert("お名前を入力してください。");
theForm.name.focus(); return (false); }

 フォームの「name」という名前が付いた入力フィールドの値が何もなければ、
 次のブロックを実行します。
  ブロックは警告ウィンドウを表示して「名前」の入力を催促します。ウィン
 ドウを閉じると、名前の入力フィールドにカーソルがフォーカスされます。


■if (theForm.email.value == "")
{ alert("メールアドレスを入力してください。"); theForm.email.focus();
return (false); }

 フォームの「email」という名前のついた入力フィールドの値が何もない場合、
 次のブロックを実行します。
  ブロックでは、警告ウィンドウを表示して「メールアドレス」の入力を催促
 します。ウィンドウを閉じると、マウスカーソルがメールアドレス入力フィー
 ルドにフォーカスされます。


■if (theForm.qa.value == "") { alert("ご質問内容を入力してください。");
theForm.qa.focus(); return (false); }

 フォームの「qa」という名前のついた入力フィールドの値が何もない場合、次
 の警告ウィンドウを出すブロックを実行します。以下上記と同様。


■var emailStr = theForm.email.value
 var emailPat=/^(.+)@(.+)$/
 var specialChars="\\(\\)<>@,;:\\\\\\\"\\.\\[\\]"
 var validChars="\[^\\s" + specialChars + "\]"
 var quotedUser="(\"[^\"]*\")"
 var ipDomainPat=/^\[(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})\]$/
 var atom=validChars + '+'
 var word="(" + atom + "|" + quotedUser + ")"
 var userPat=new RegExp("^" + word + "(\\." + word + ")*$")
 var domainPat=new RegExp("^" + atom + "(\\." + atom +")*$")
 var matchArray=emailStr.match(emailPat)

 ここでは、変数にそれぞれの値を初期値として代入しています。
  var というのは、変数をグローバル変数として設定するために記述します。
 グローバル変数とは、ブロックの内外で有効な変数としてその値を維持します。
  この設定は、ユーザが入力したメールアドレスが妥当であるかどうかを調べ
 るためのややこしい初期設定を行っています。

 var emailStr = theForm.email.value
 変数 emailStr に「email」と名前のついた入力フィールドの値を格納します。
 当然のことながら、ユーザが入力したメールアドレスが格納されます。

 var emailPat=/^(.+)@(.+)$/
 変数 emailPat には、正規表現の書式を設定して代入しています。
 この書式は文字列とドット、および「@」を含む正規表現であることを設定し
 ています。

 var specialChars="\\(\\)<>@,;:\\\\\\\"\\.\\[\\]"
 変数 specialChars では、@ を挟んだ文字列の「並び」つまり、メールアドレ
 スのフォーマットを定義して格納しています。

 var validChars="\[^\\s" + specialChars + "\]"
 変数 validChars に、specialChars変数で設定した文字列の前に、スペース
 を連結して代入しています。\\s はスペースを表します。

 var quotedUser="(\"[^\"]*\")"
 変数 quotedUser は、2つの文字列の値の各ビットの排他的論理和を求めてい
 ます。平たく言えば、2つの値の同じものだけを取り込んで代入しています。

 var ipDomainPat=/^\[(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})\]$/
 変数 ipDomainPat には、複数のドットを含んだ文字列フォーマットを代入し
 ています。
   \d は、単語とスペースの一致を示しています。
   $ は、入力の終端を意味します。

 var atom=validChars + '+'
 変数 atom に、validChars変数と 「+」という演算子を代入しています。
 ここでは、「@」の後につづく文字列を想定しています。

 var word="(" + atom + "|" + quotedUser + ")"
 変数 word には、atom変数と quotedUser変数の各ビット数を比較して、同じ
 値だけを抽出して取り込みます。要するに、入力した文字数を検索します。
 ここでは、「@」の前の文字数を代入しています。

 var userPat=new RegExp("^" + word + "(\\." + word + ")*$")
 RegExpオブジェクトは、正規表現を扱うオブジェクトで、変数 word で検索
 した文字数の文字列を取り込んで、変数 userPat に格納しています。

 正規表現とは、主に検索・置換の場面で文字列のパターンを規則正しく表す
 言い回し(表現)のことで、それを表すためのルールのセットを差します。
 英語では、Regular Expression と記し、JavaScriptでは RegExpオブジェク
 トを利用します。

 var domainPat=new RegExp("^" + atom + "(\\." + atom +")*$")
 上記と同様に、変数 atom で代入された文字数の文字列を、変数 domainPatに
 格納しています。

 var matchArray=emailStr.match(emailPat)
 変数 matchArray に、emailStr変数で代入された文字列の正規表現を使用して
 その文字列を検索し、emailPat変数で設定したフォーマットと一致した文字列
 を返します。
  mucth は、Stringオブジェクトのメソッドで、正規表現を使用して文字列を
  検索し、一致した文字列を返します。 


■if (matchArray == null) { alert("メールアドレスが正しくありません。")
return (false) }

 matchArray変数に何も取り込まれなかった場合、つまり、ユーザがメールアド
 レスを間違えた場合に、警告ウィンドウを出します。


■var IPArray=domain.match(ipDomainPat)

 グローバル変数を設定しています。matchメソッドにより ドメイン名の正規表
 現として ipDomainPat変数で取り込んだフォーマットに格納し、その値を
 変数 IPArray に代入します。


■if (IPArray!=null) { for (var i=1;i<=4;i++) {
  if (IPArray[i]>255) {  alert("メールアドレスが正しくありません")
	 return (false) } } }

 IPArray変数に何もない場合(nullの場合)、あるいは 255文字を超えた場合、
 警告を出します。


■ var domainArray=domain.match(domainPat)

 グローバル変数を設定しています。matchメソッドにより ドメイン名の正規表
 現として domainPat変数で取り込んだフォーマットに格納し、その値を変数 
 domainArray に代入します。


■ if (domainArray==null) { alert("ドメイン名がありません。")
  return (false) }

 domainArray変数に何も値がない場合に、警告を出します。


■var atomPat=new RegExp(atom,"g")
 var domArr=domain.match(atomPat)
 var len=domArr.length

 ここでもグローバル変数を設定しています。

 var atomPat=new RegExp(atom,"g")
 変数 atomPat に、atom変数で格納された値を正規表現として、大文字小文字
 の区別のないフラグ "g" を設定し代入しています。
  この記述は、var atomPat = /atom/g; と同じです。

 var domArr=domain.match(atomPat)
 変数 domArr に、上記 atomPat変数で代入された文字列を正規表現として、ド
 メイン名の妥当性を検索して代入します。
  domain とは documentオブジェクトのプロパティでドメインを示します。

 var len=domArr.length
 domArr変数に取り込まれた文字数を len という変数に代入しています。


■if (domArr[domArr.length-1].length<2 || 
domArr[domArr.length-1].length>3)
 { alert("メールアドレスが正しくありません。") return (false) }

 簡単に言えば、ドメイン名の文字数が1文字しかないか、4文字以上ある場合
 に警告を出すための if構文です。

  詳しく解説すると、ドメイン名の文字数に1を引いて、その数が2よりも大
 きく3よりも小さい場合には true となってエラーにはなりませんが、それよ
 りも小さな数あるいは大きな数の場合に警告を出します。1を引く理由はドッ
 ト「.」の1文字が含まれているためです。
  通常ドメイン名は2、あるいは3文字で規定されているためです。ドメイン
 名とは、ad、com、jp、org 等が挙げられます。


■if (len<2) { var errStr="メールアドレスにドメイン名がありません。"
  alert(errStr) return (false) }

 これも、上記と同様にドメイン名が2文字に満たない場合に警告を出します。


HTML構文より

■<form name="mailform" onsubmit="return formVal(this);" action="#">

 フォームを定義しています。
  onsubmit属性は、フォームのデータが送信されたときに発生するイベントで
 これをトリガー(引き金)にして、JavaScriptの関数が実行させます。

  本来 form要素では必ず action属性でデータ送信先を指定しなければなりま
 せん。しかし、ここではデータをどこかに送信しているわけではないので、方
 便として # を使っています。


■<dl>

 定義済みリストを定義しています。この要素の草しい説明は、「第57号」にて
 解説しました「タグの解説」をお読みください。
  基本的に、form要素内で配置される各入力フィールドは、必ずブロックレベ
 ル要素内で記述しなければなりません。そのために、dl要素を使っています。

■<dt>ご質問カテゴリー</dt>

 リスト内の定義用語を定義しています。この用語、あるいは項目に関する詳し
 い説明内容は、dd要素内で記述されます。


■<dd><input type="radio" name="who">HTMLについて</dd>

 定義された用語を解説するために、dd要素を利用します。終了タグは省略可能
 ですが、正統派を目指すためにも、ちゃんと記述しましょう。

  入力フィールドはラジオボタン形式になっており、このボタンには who と
 名前を付け、JavaScriptに関連させています。


■<table cellspacing="0" cellpadding="3" summary="名前と E-Mail 入力欄">
 <col width="200">

 テーブルを定義しています。同じように入力フィールドはブロックレベル要素
 内で配置します。
  col要素で、最初の縦方向の列を横幅 200ピクセルに定義しています。


■<td><input size="30" name="name" value=""></td>

 入力フィールドに、type属性がない場合にはテキスト入力欄とされます。ここ
 では、30文字分の入力フィールドを定義していますが、文字数に制限はありま
 せん。
  テキストフィールドには何も表示させたくないので、あえて value属性には
 何も記述せず、「""」としました。
  この入力フィールドには、「name」という名前をつけて、JavaScriptに対応
 させています。


■<textarea rows="6" cols="50" name="qa">質問</textarea>

 textarea要素は、複数行のテキスト入力フィールドを定義します。
  ここでは、横幅60文字分、6行分の高さを設定しています。入力フィールド
 の名前を「qa」として、JavaScriptに関連付けしています。

  なお、各入力フィールドの長さ(文字数)に関しては、ブラウザによって
 その領域の表示が異なることを、あらかじめお断りしておきます。


◆まとめ

 かなり複雑な入力チェックを行うスクリプトになっています。特にメールアド
 レスのチェックは、ユーザの入力に対して、どのような値でもチェックできる
 ような工夫をしています。
  こうした構文を変更することで、入力した値が全角文字、あるいは半角英数
 字などをチェックすることも可能です。キーワードは「正規表現」です。

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

◆インターネット用語解説(第1回) DNS Domain Name System

 今回より、JavaScript講座と併記して、初心者向けにインターネットの仕組み
や専門用語について、シリーズで掲載することにしました。
 何らかの役立つ情報として、素朴な疑問点などを深く掘り下げて解説します。

 第1回目の今回は、インターネットにおける DNSの仕組みについて解説します。

 DNS を分かりやすく説明すると、例えば、あなたが知り合いから電話番号を聞
いたとします。あなたは、手帳にその人の名前と電話番号を記入します。
 実は、この電話番号と人の名前という組み合わせを、インターネットで行って
いるのが DNSなのです。

 ■DNS
 インターネットに接続するということは、基本的に WEBサーバに接続するとい
 うことです。この WEBサーバ同士をつなげている世界的なネットワークのこと
 を、インターネットと呼びます。
  あなたが、自分のコンピュータからブラウザを立ち上げて、特定のサイトへ
 訪問するとき、そのサイトの URLを入力した経験したことがあると思います。

  例えば、http://www.scollabo.com/banban/ と、入力すれば、この講座のサ
 イトを閲覧することができます。

  この URLは、インターネット上にある様々なデータのいわば住所の役目をし
 ています。どこにあるどんなファイルも URLでそのありかを特定できます。
  この URLの構成要素として重要な役割を果たしているのが、ドメイン名と呼
 ばれているものです。つまり、scollabo.com がドメイン名に当ります。

  しかし、ドメイン名はあくまでも仮の住所であり、現実的にはコンピュータ
 は「IPアドレス(注1)」と呼ばれる住所で通信する仕組みを持っているので
 通信に先立って、ドメイン名から「IPアドレス」を割り出さなければならない
 事情があります。
  言い換えれば、IPアドレスこそ、手帳に記した「電話番号」といえます。

  IPアドレスは、32ビットの番号で利用されるため、人間に分かりにくく、実
 際の利用に適しているとは言いがたいものです。
  しかし、ドメイン名からIPアドレスを見つける処理を可能にすることができ
 れば、人間は困らなくて済みます。
  こうしたアドレスを見つける処理を「名前解決」と呼び、名前解決を実現す
 るためのしくみが DNS(Domain Name System)なのです。
            ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄

 ■DNSからDNSへ
 DNSは、インターネットに接続しているすべての WEBサーバについて、名前解
 決ができるように工夫されています。
  どこかに集中管理する方法も考えられますが、実際には世界中の DNSサーバ
 が自分の管理対象(ゾーンと呼ぶ)を決め、連係しながら名前解決するように
 なっています。
  要するに1つの DNSサーバでは世界中のゾーンを管理できないくらいに、そ
 の範囲が広がってしまったというわけです。

  まず、人間が WEBブラウザなどにドメイン名を入力すると、ブラウザは最寄
 りの DNSサーバーにIPアドレスを教えてもらうべく問い合わせをします。
  この問い合わせをするソフトウェアを、「リゾルバ」と呼びます。
 最寄りの DNSサーバとは、コンピュータ内にあらかじめIPアドレスを設定して
 いる DNSサーバのことで、ローカルDNSサーバと呼びます。

  ローカル DNSサーバは、自分と同じグループのドメイン名の情報しか持って
 いないので、それ以外のドメイン名については、別の DNSサーバに接続して、
 その答えを探し出します。

  この場合、まず最初にルート DNSサーバと呼ばれる特別な DNSサーバに問い
 合わせを送ります。
  ルート DNSサーバは、ドメイン名の階層構造の頂点に位置する DNSサーバで
 ドメイン名の一番右に来るドメイン名(comやjpなど)を管理する DNSサーバ
 のIPアドレスを持っています。
  そこでルート DNSサーバは、問い合わせを受けたドメイン名の一番右にくる
 ドメイン名を管理する DNSサーバのIPアドレスを返信します。

  例えば、www.scollabo.com の場合なら、comドメインを管理する DNSサーバ
 のIPアドレスを返信します。

  するとローカル DNSサーバは、今度は comドメインを管理する DNSサーバに
 再び www.scollabo.com を問い合わます。こうして次々と教えてもらった DNS
 サーバに問い合わせることを繰り返すと、最終的に目的のドメイン名のIPアド
 レスを知っている DNSサーバーにたどり着きます。
  そして、目的のIPアドレスを返信してもらったら、それを「リゾルバ」に返
 信します。

  リゾルバからローカル DNSサーバへの問い合わせは一度だけですが、ローカ
 ル DNSサーバは、答えが分かるまで何度もほかの DNSサーバに問い合わせを繰
 り返します。
  実在していないドメイン名を指定してしまった場合でも、一応、リゾルバは
 各 DNSサーバに問い合わせをします。どこのサーバも「知らないよ」となった
 場合に、「サーバが見つからない」を返します。

  私たちが、インターネットに接続しようとするわずかな時間の中で、こうし
 た人間の目では見ることができない様々な作業を DNSは行っているのです。
  今日のインターネットの成長を考えた時、まさに DNSなしでは考えられない
 ことでしょう。


(注釈用語解説)

 注1;IPアドレス(Internet Protocol Address)
  IPアドレスとは、コンピュータ1台ごとに付けられる住所(番地)となるも
  ので、世界でユニーク(絶対に唯一)であることが要求されます。
   IPアドレスに、32bitの番号を使って、「192.168.72.54」などと表現して
  います。現在は IPv4 という規格が主流になっていおり、最大で約43億台分
  のサーバが割り当てできます。(2の32乗)

   しかし、1990年代に入ってインターネットの普及とともに接続台数が急速
  に増え、IPアドレスの不足が懸念され始めました。そこで1994年に登場した
  のが、日本発の IPv6 と呼ばれる 128ビット規格です。
   IPv6 が普及すれば、世界中の人々全員に 1人1億個の IPアドレスが使
  えるといわれるほど天文学的な割り当てが可能です。(2の128乗)
   ただし、通信上の様々な技術的難問をクリアしなければならず、普及まで
  にはもう少し時間がかかりそうです。

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

◆アンケート集計結果

 総数 214通に及ぶアンケートの結果を掲載します。本当にたくさんのご協力あ
りがとうございました。
 アンケートを集計し、以下のような結果となりました。

 ■メールマガジンの掲載量は
  多い ------------------  32%
  ちょうど良い ---------- 59%
  少ない ----------------  9%

  ※ 多いという方が30%を超えているのは、編集内容を考えなくてはいけない
   と提起させられました。確かに多いかもしれません。
   30キロバイトを超えると、読むのも大変ですし、忙しいときはそのままに
   するか、削除することと思います。

 ■メールマガジンの配信間隔
  多い ------------------   6%
  ちょうど良い ---------- 92%
  少ない ----------------  6%

  ※ ちょうど良いというのが大勢でした。多いという方には、読む時間がなく
   て溜まってしまうという意見もありました。これは掲載量にも影響してい
   るかもしれません。
    少ないという方、これ以上は当方としても精一杯です、ご勘弁を。

 ■講座の難易度
  難しい ----------------  28%
  理解できる ------------ 54%
  非常に理解できる ------ 18%

  ※ 3割近い読者が難しいと感じているのは、編集内容を見直す必要があるの
   ではと提起しています。
    確かに、HTMLを本格的に学ぶとすれば難しいと思います。最初は「真似」
   から入ってください。そしてタグの意味を理解するために、1つづつ削除
   してみると、各タグの働きが理解できると思います。

    当 Webサイトでは各種のリファレンスを掲載していますので、初めて出
   会ったタグやその属性の意味を理解しておくと、意外とページ作成の早道
   かもしれません。

 ■メールマガジンの読みやすさ
  読みにくい ------------   4%
  まぁ読みやすい -------- 60%
  非常に読みやすい ------ 36%

  ※ 読みやすさを追及する研究について、ばんばん氏はかなり厳しい「規則書」
   を残しています。委員会でも、今までの配信したマガジンを読み返し、ど
   うすれば、もっと読みやすくなるかを考えています。
    読者の意見に耳を傾けながら、今後の編集作業に反映していきたいと思
   っています。

 ■XML講座
  興味ない --------------  13%
  興味ある -------------- 59%
  非常に興味ある -------- 28%

  ※ 正直なところ、興味ある方の数が多いことに驚いています。ホームページ
   作成のためのマークアップ言語ではないにもかかわらず、関心を寄せる読
   者がたくさんいることは大変うれしく思っています。
    今後の Webサービスには欠かせない新しい言語を覚えることは、きっと
   何かの役に立つことをお約束します。

 ■ホームページの開設状況
  既に開設済み ----------  54%
  開設の予定 ------------ 40%
  開設の予定はない ------  6%

  ※ 比較的多くの方がホームページを開設・公開しているようです。いずれ早
   いうちに、読者のリンク集をアップします。

 ■利用している OS (複数回答あり)
  WindowsXP -------------  38%
  Windows2000 ----------- 20%
  WindowsMe ------------- 18%
  Windows98 -------------  22%
  WindowsNT -------------  1%
  MacOS 9.2 ------------- 0.6%
  MacOS 9.2 ------------ 0.4%

 ※ Macintoshユーザの少なさが気になります。圧倒的に Windowsユーザです。
   ウィルスなどで一番狙われている OS でもあるので、常日頃から更新やセ
   キュリティのパッチを当てるようにしましょう。

 ■利用している主要ブラウザ(複数回答あり)
  MSIE 6.0 --------------  78%
  MSIE 5.5 --------------   8%
  MSIE5.1(Mac用) --------  1%
  MSIE 5.0 --------------   7%
  Opera 7.11 ------------  4%
  Mozilla 1.4 -----------  0.8%
  Netscape Navigator 4.x  0.4%
  Netscape 7.02---------- 0.4%
  iCab(Mac用) ----------  0.4%

 ※ バージョンの違いもありますが、MSIEが全体の94%を占めています。これ
   は世界中の占有率に等しいものです。Netscapeは、もはや消え行く運命に
   あるようです。代わって Operaの普及が著しいようです。

 ■記念品当選者(敬称略)

  アンケートに際しまして抽選の結果、以下の方々に記念品を遅らせていただ
  きます。なるべく多くの方にという思惑もあって、約4人に1人の割合で当
  たるように抽選しました。
   選に漏れた方には、お詫びします、申し訳ありません。

  1等賞 鍾馗像(高級桐化粧箱入り)3名
   茨城 中島
			山梨 encho
			大阪 いしやん

  2等賞 CD-ROM(Webサイトデータ、メールマガジン全原稿)50名
   北海道 シロ、武山、abyss
   青森  Zam
   秋田  佐藤
   岩手  高橋
   山形  カワイルカ
   新潟  Hiroshi、アキラ
   千葉県 Chiko、LetItSnow、*norityan*、あわわ、left_hand
   埼玉  とびら、Minami、中村
   神奈川 ジロー、kingyobell
   東京都 HPコウザニャン、廣瀬、さとゆう、hiro、浜野、みやけん
   長野  Ryo
   岐阜  真美
   愛知  ティピー、roku、コアラ
   福井  のりちゃん
   石川  おやじ
   京都  Lickey
   大阪  足立、Masa
   和歌山 Yasuo
   兵庫  のんちゃん、Shinji
   島根  Shoko
   山口  まり、Tom
   愛媛  まじっく
   福岡  ノック、Den、パチ吉
   大分  タカ
   宮崎  北斗

   韓国   Wonder
   アメリカ Yayoi
   フランス Miyoko

 なお、賞品は一部の方を除いて、既に発送しました。お手元に届くまでもう少
 しお待ちください。国外の方へは国際航空郵便にて本日お送りしました。

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

◆更新情報

 ばんばん氏が制作途中だった「改訂版HTML4.01リファレンス」をやっと完成さ
せました。各タグ別にページを分けて解説しています。

 改訂版HTML4.01 新リファレンス
 http://www.scollabo.com/banban/html/index.html

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

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

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


 次回予定しているコンテンツ(変更する場合があります。)
      ■ Webデザイン 第11回 --- 軽量コンテンツ
   ■ HTML講座  第11回 --- フレーズ要素
   ■ XML初級講座 第3回 --- XMLインスタンスの作成
    ■ タグの解説

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

質問・ご意見ははこちらまで→ wfb-org@jcom.home.ne.jp

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

発行者 ばんばん、初心者のためのホームページ作り臨時制作委員会
協 力 スズキ・コラボレーション 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://www.scollabo.com/banban/daf/material.html
まぐまぐの過去記事 http://backno.mag2.com/reader/Back?id=0000090196

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

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

<編集後記>

 なんだか世界中で異常気象が発生し、いつもの夏とは少し感じが違っているよ
うな気がします。夏休み中、寒かったのが印象的でした。聞くところによると、
1993年以来の冷夏だとか。このまま夏が終わってしまうのでしょうか。

 夏休みが明ける前日の日曜日、ウィルス騒動でクライアントからの要請が相次
ぎ、無茶苦茶忙しくなってしまい、せっかくの休みで蓄えた英気を全部使い果た
してしまいました。天候といいウィルスといい、本当に参りました。

〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓

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

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



Copyright(C) 2002-3003 banban@scollabo.com