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

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

             banban@scollabo.com

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

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

 当講座ではHTML4.01及び XHTML1.1 を中心とした文法が主体となっています。
なお、このマガジンは等幅フォントでお読みいただくと快適に読めるようになり
ます。等福フォントに関しては、http://www.mag2.com/faq/mua.htm を参考にし
てください。

 今週の課題 ■ HTML基本 その9 --- ボックスと余白
       ■ ホームページ作りの基本 その2--- アクセシビリティ
       ■ XHTML講座 その9 --- テーブルの作成
       ■ HTML タグの解説 --- div要素
       ■ セキュリティに関する考察 --- パーソナルセキュリティ

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

◆HTML基本 その8  ボックスと余白

 ブロックレベル要素とは基本的に、長方形の領域を持ち、前後に改行を持って
います。この領域をボックスに例えられます。

 ボックスとは、まさに箱を意味しその中にコンテンツが収められます。ボック
スには、様々なスタイルを設定することができ、余白、枠線、背景色などを施す
ことで、よりいっそう際立ったボックスを表現できます。

 読者の皆さんから寄せられるメールに、「ボックスに設定する余白の区別が分
からない」という質問が多く、つまり、margin、padding の設定の意味が理解で
きないという意見がありました。
 ボックスにおけるスタイルシートによる余白の設定は以下の通りです。なお、
余白の設定は、HTMLのタグではできません。

 margin:ボックスの外側の余白を設定する
 padding :ボックスの内側の余白を設定する

 例えばボックスに背景色を設定したとします。marginはボックスの外側の余白
ですから背景色は持っていません。
 ところが paddingは、ボックスの内側の余白のため、背景色を持っています。


              ┌────────────────┐
  ボックスの外側の余白─→│       margin       │
              │ ┏━━━━━━━━━━━━┓ │
  ボックスの内側の余白─────→    padding     ┃ │
              │ ┃   コンテンツを配置  ┃ │
              │ ┃            ┃ │
              │ ┗━━━━━━━━━━━━┛ │
              │                │
              └────────────────┘

 上の図は、margin、padding を端的に表わしたものです。太線で示されたもの
がボックスで、細線で示されたものがマージン(margin)です。

 一般的な視覚系ブラウザ(MSIE、Netscape、Opera など)では、ブロックレベ
ル要素の一部に、marginを持たせて表示するものがあり、その代表的な要素は以
下の通りです。

 前後に1文字分の余白をもたせて表示するブロックレベル要素
  p、pre、ul、ol、dl、h1〜h2

 なお、W3CのHTML仕様書では、余白を持たせるということは明記していません。
あくまでも、ブラウザ側の仕様であることを認識してください。

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

◆ホームページ作りの基本 --- アクセシビリティ

 ■アクセシビリティとは?
 インターネットの拡大によって私たちは手軽に欲しい情報を一瞬にして世界中
 から自分のパソコンに取り寄せることができます。
  また、自分の発する情報を世界中の人に伝えることもできます。10年前には
 考えられないような技術が、私たちの生活が情報を得ることで豊かにしてくれ
 ました。そして、インターネットは人種や貧富の差別がありません。誰でも自
 由に利用できることでその価値を高めています。

  しかし、一方で体が不自由な「障害者」にとっては、インターネットの利用
 は敷居の高いことも事実でした。
  社会が成熟していく中で、人々が「ゆとり」を手にしたとき、初めて「障害
 者」が自分の身の回りにいることに気がつきました。それはインターネットの
 世界でもまったく同じ現象を見ることができます。

  1998年4月、インターネット標準規格を制定する非営利団体である W3Cは、
 Webコンテンツの制作者にアクセシビリティ・ガイドラインのドラフト(草案)
 を投げかけ、1999年5月には正式勧告となって、ホームページ作りにおけるア
 クセシビリティを制作者に義務付けるようになりました。

  アクセシビリティとは Webページの閲覧において、いわゆる健常者だけでなく
 「身体障害者」の多くが利用している非視覚系ブラウザ(音声、点字、テキス
 トなどを中心とした専用のブラウザ)でも、支障なく情報を得られる工夫など
 の総称として用いられます。

  アクセシビリティと並べられる言葉に、以前この講座でも取り上げた「ユニ
 バーサル化」がありますが、基本的には同じ目的を持った Webページ作りの上
 の指針です。

  アクセシビリティ・ガイドラインでは、3つの優先度を決めて Webページの
 バリアフリー化を提言しています。
 (引用出展先: http://www.w3.org/TR/WCAG10/ )

 アクセシビリティチェック項目優先度
  優先度1.ねばならない。絶対的な必須条件。
  優先度2.べきである。べきではない。
  優先度3.しましょう。します。

 ■優先度1のチェック項目
  ○すべての画像・アプレット・イメージマップに代替テキストをつけなけれ
   ばならない。(alt属性を用いる)
  ○重要なスクリプトやアプレットが実現できない環境のために、代替のテキ
   スト、あるいはページを用意しなければならない。
  (noscript要素などを用いる)
  ○すべての音声情報には同等のテキストを用意しなければならない。
  ○色なしで見たときにテキストやグラフィックスが受信・理解可能であるこ
   とを確かめなければならない。(モノクロ画面への配慮)
  ○移動・点滅・スクロール・自動更新するオブジェクトやページを停止また
   は凍結してもよいことを確かめなければならない。
  ○マークアップやテキストからも情報が明確であるのでない限り、色を使っ
   て情報を伝達することをしてはならない。つまり、色弱者に対して色のコン
   トラスを明確にしなければならない。
  ○フリッカーを起こすスクリーンの点滅・移動を避けなければならない。

 ■優先度2のチェック項目
  ○文書構造は論理的な構造を示す要素で記述し、表現はスタイルシートで制
   御するべきである。(特にブラウザ依存の独自タグは使用しない)
  ○見出しを適切にネストするべきである。つまり、h1要素の後にはh2要素で
   配置するべきであり、h3要素を配置すべきではない。
  ○引用は q要素や blockquote要素でマークアップすべきで、字下げなどのフ
   ォーマット効果のためにこれらの要素を使うべきではない。
  ○lang属性を使って明確にテキスト言語の変更を特定するべきである。
  ○動画や映像などの新しいオブジェクトには、できる限り代替のテキストや
   代替ページを用意すべきである。
  ○イメージマップやフォームでは、そのインターフェイスがキーボード操作
   だけでも可能にすべきである。
  ○ユーザに断りもなく勝手に現在のウィンドウを変更したり、新しいウィン
   ドウを開いたり、ポップアップウィンドウを使うべきではない。
  ○「ここをクリックしてください」とか「ここ」「これ」などといったよう
   な、それ自体では意味のないリンクを避けるべきである。

 ■優先度3のチェック項目
  ○テーブルのヘッダセルに略語表記をつけましょう。(abbr属性の利用)
  ○テーブルに summary属性経由で「まとめ」をつけましょう。
  ○リンクやフォームのコントロール、オブジェクトを一貫して論理的なタブ
   順序を、tabindex属性経由または論理的なページ設計を通して制作するよ
   うにしましょう。
  ○リンクやフォームのコントロール、フォームのコントロールのグループに
   (accesskey属性経由で)キーボードショートカットをつけましょう。
  ○ページ間で一貫性のある表現スタイルを制作しましょう。
  ○明快で一貫性のあるナビゲーション構造を使いましょう。
  ○ナビゲーション構造に簡単にアクセスできるようナビゲーションバーを提
   供するようにしましょう。
  ○サイトの全体的なレイアウト、使われているアクセス機能やその使い方に
   ついての説明文をつけましょう。
  ○サイトマップを提供するように心がけましょう。

  ここに掲げたアクセシビリティのチェック項目は一部に過ぎません。すべて
 を提示し、解説を加えると紙面に余裕がなくなります。アクセシビリティにつ
 いての利用方法は、今までもお伝えしてきましたが、今後の講座の中でも、そ
 の都度、解説を加えていきます。

  HTML4.01、XHTML1.1では、既にアクセシビリティを実現する数多くの機能が
 集約され、すぐにでも利用することができるようになっています。

 ■アクセシビリティ関連サイト
 こころWeb
 http://www.kokoroweb.org/

 バリアフリーWebデザインガイド
 http://www.din.or.jp/~hiro-/barrierfree/index.html

 バリアフリーの扉/IBM
 http://www-6.ibm.com/jp/accessibility/

 CHIME Service Project/視覚障害に関するガイドページ
 http://www.neting.or.jp/welfare/chime/

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

◆XHTML講座 --- テーブルの作成 その2

 前回はテーブルのグループ化まで説明しました。今回はちょっとややこしくな
りますが、セルの連結について解説します。
      ̄ ̄ ̄ ̄ ̄
 セルというのは、テーブルを構成する1つのマス目であることは既に説明した
 とおりです。
  セルの連結とは、以下の図で示すように、複数のマス目をあたかも1つのセ
 ルのように連結してしまうことです。

 ┌──────┬─────────┬───┬───────────┐
 │  氏名  │    成績   │ 判定 │  総合評価 /ランク   │
 ├──────┼────┬────┼───┼───────────┤
 │       │ 国語 │ 24点  │ 追試 │ 極めて不真面目で意欲 │
 │      ├────┼────┼───┤ を感じない。         │
 │       │  数学 │ 30点 │ 追試 │  総合的に判断し1年 │
 │ ばんばん ├────┼────┼───┤ の留年もやむを得ない │
 │       │  英語 │ 20点 │ 落第 │ と判断した。         │
 │      ├────┼────┼───┼───────────┤
 │       │  歴史 │  5点 │ 落第 │   99位/100人中     │
 └──────┴────┴────┴───┴───────────┘

  この表には3つのセルの連結があります。横列のセルの連結、縦列のセルの結
 合があります。お分かりになるでしょうか?

  この表では、基本的に横列が5つのセル、縦列も5つのセルで構成されてい
 ます。つまり、合計25個のセルの集合で構成されています。

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

◆セルの連結

 colspan :横列のセルの連結を指定し、連結するセルの数値を記述します。
      基本的にこの属性が示されたセルと右側のセルが結合されます。
      <td colspan="2">  2つの横方向のセルを連結、セル2個分です。

 rowspan :縦の列のセルを連結を指定し、連結するセルの数値を記述します。
      基本的にこの属性が示されたセルと下方向のセルが結合されます。
      <td rowspan="4">  4つの縦方向のセルを連結、セル4個分です。

 なお、セルを連結する場合、thead、tbodyなどの横列をグループ化した場合に
 別のグループとのセルの結合はできません。その場合には連結が無視されます
 ので注意が必要です。

 それでは、先ほどの表が示すセルの連結を表現したテーブルを作ってみましょ
う。テキストエディタを起動して以下のようにタイプしてください。


<?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"><!-- 改行なしで記述-->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_Jis" />
<title>テーブルのサンプル/セルの連結</title>
</head>

<body>
<table cellpadding="5" cellspacing="0" border="1" 
        summary="セルの連結サンプル"><!-- 改行なしで記述-->
<colgroup>
<col width="90" align="center" />
<col span="3" width="80" align="center" />
<col width="150" />
</colgroup>
<thead>
<tr><th abbr="受験者">氏名</th>
    <th colspan="2" abbr="各科目成績">成績</th>
    <th abbr="合否判定">判定</th>
    <th abbr="コメント">総合成績/ランク</th></tr>
</thead>

<tbody>
<tr><td rowspan="4">ばんばん</td>
    <td>国語</td>
    <td>24点</td>
    <td>追試</td>
    <td rowspan="3">極めて不真面目で意欲を感じない。<br />
    総合的に判断し1年の留年もやむを得ないと判断した。</td></tr>

<tr><td>数学</td>
    <td>30点</td>
    <td>追試</td></tr>

<tr><td>英語</td>
    <td>20点</td>
    <td>落第</td></tr>

<tr><td>歴史</td>
    <td>5点</td>
    <td>落第</td>
    <td align="center">99位/100人中</td></tr>
</tbody>
</table>

</body>
</html>

  実行結果
 http://www.scollabo.com/banban/magazine/sample/mmsample_085.html

 <注意>
 構文は見やすくするために空白を多用しています。実際にはタブキーを使って
 空白を確保します。この構文をコピーしても表示に問題が出ると思いますので
 その際には、すべて空白部分を削除してご利用ください。
  理解を深めるためにも、面倒ですがタイプするようにしましょう。

  Netscape 6.0以降では、セルの横幅の設定がおかしな表示になります。明らか
 にバグと思われます。Netscapeにおけるテーブルの表示には、この他にも様々
 な不具合があります。念のため。

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

◆解説

<table cellpadding="5" cellspacing="0" border="1" 
   summary="セルの連結サンプル"><!-- 改行なしで記述--> 
 セルの内側の余白を5ピクセル、セル間の余白を0としたテーブルを設定して
 います。summary属性は、非視覚系ブラウザに対しテーブルの説明を行います。
 また、テーブルのすべてのセルに1ピクセル分の枠線を表示します。
  この構文は改行なしで記述してください。

<colgroup> 〜 </colgroup>
 テーブルの縦の列を構造的にグループ化するための要素です。

<col width="90" align="center" />
 テーブルの縦の列を個別に横幅を90ピクセル、テキストの位置を中央揃えに設
 定しています。この要素は空要素(終了タグを持たない要素)なので XHTMLで
 は、行末にスラッシュを入れなければなりません。

<col span="3" width="80" align="center" />
 縦列を3つ分まとめて設定します。span属性では縦の列を連続してグループ化
 する場合に便利な属性です。まとめたい列数を記述します。
  ここでは、横幅を80ピクセル、コンテンツの位置を中央揃えとしました。

<col width="150" />
 最後の縦列の横幅を 150ピクセルとしました。

<thead> 〜 </thead>
 この要素内のセルをテーブルヘッダとしてグループ化します。この要素中での
 セルの連結は、同じグループ内に限ります。他のグループとは連結できません。

<tr> 〜 </tr>
 テーブルの横方向の行を設定するための要素で、この中にセルを設定する要素
 を配置します。

<th colspan="2" abbr="各科目成績">成績</th>
 横方向の2つのセルを連結します。abbr属性は非視覚系ブラウザのための説明
 文で、一般的な視覚系ブラウザでは無視されます。
  この横列では、th要素は4回しか使われていません。本来ならば5つ必要な
 のですが、1つ分が既に連結されているために4つになっています。この意味
 が示すのは重要です。セルの連結とセルの数の整合性を常に考えなければなり
 ません。
  蛇足ながら <col span="3"> と、<th colspan="2"> とは似たような構文で
 すが、全然意味が違います。念のため。

 th要素はセルを構成しますが、セルがヘッダとしての機能を持たせるための要
 素で、データセルと呼ばれます。一般的な視覚系ブラウザでは、文字が強調さ
 れて中央揃えで表示されます。

<tr><td rowspan="4">ばんばん</td> 〜省略〜 </tr>
 rowspan属性は、縦方向のセルを4つ連結することを指定しています。
 そのため、下段の3つの横列のセルは、通常よりも1個少なくなります。これ
 は、既に1個分のセルが上の列のセルと連結されているためです。この場合も
 連結されたセルと、横列のセルの数の整合性を考えなければなりません。
 colspan 同様ちょっとややこしいけれど、構文を設計する時に注意しておきま
 しょう。
  td要素はデータセルを意味し、1つのセルを構成します。テーブルでは最低
 1つ以上のセルがなければなりません。

<tr><td>数学</td><td>30点</td><td>追試</td></tr>
 この横列のセルの数が少ないのがお分かりになるでしょう。最初のセルと、最
 後のセルが既に連結されていることが読み取れます。

<td align="center">99位/100人中</td>
 セル内のコンテンツの位置を指定する align属性によって、このセルを個別に
 中央揃えとしています。
  align属性が利用できる要素は、th、td、col、colgroup要素の4つだけです。
 他の要素には使うことが禁止されていますので、気をつけてください。
  例:<table align="center"> この構文は、XHTML1.1では文法違反です。


 ■スタイルシート
 今回はスタイルシートを用意しておりません。読者の皆さんが自由に設定して
 いただければと思います。前回の講座を参考にしてください。

 ■終了タグについて
 本誌第35号でも解説したとおり、XHTMLは、XMLのサブセットであるために、基
 本的に XMLの文法を継承します。
  HTMLでは、td、th要素などの終了タグを省略することが可能でしたが、XHTML
 では省略が許されておりません。これはテーブルに限ったことではなく、すべ
 ての要素タイプで終了タグを記述しなければなりません。

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

◆セル内のコンテンツの位置指定

 前述したとおり align属性を用いることで、セル内の位置揃えを自由に配置す
 ることができます。また、縦方向の位置揃えとして valign属性があります。

 align :  left(左:デフォルト値)、right(右)、center(中央)の指定
  valign : middle(中央:デフォルト値)、top(上)、bottom(下)、
      baseline(ベースライン=bottom)の指定

 これらの属性はすべて th、td、col、colgroup要素内でのみ設定することが可
 能です。

◆廃止されている属性

 HTMLでは便利に利用できたテーブルに関する廃止された属性は以下のとおりで
 す。XHTML1.1では使うことができません。代わりにスタイルシートで設定する
 ことになります。

 bgcolor      背景色の指定
 background   背景画像の指定
 height    テーブルやセルの高さの指定
 align     caption、table要素内での記述
 bordercolor  枠線の色の指定(MSIEの独自仕様)
 nobr     テキストの自動改行を禁止する(MSIE、Mozzilaの独自仕様)
 nowrap    セル内のテキストの自動改行を禁止する

 なお、講座を進める中で、ここに挙げた属性に代わるスタイルシートを予定し
ております。

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

◆HTML タグの解説 --- div要素

 汎用的なブロックレベル要素を意味し、一般的に1つの「区切り」を意味して
います。

 要素分類:ブロックレベル要素
 DTD仕様 :HTML4.01Strict
 終了タグ:必須
 属性  :汎用属性(id、class、lang)、align(非推奨)
 子要素として持てる要素:ヘッダに記述する要素を除くすべての要素

 インラインレベル要素を、直接body要素内に配置することができないため、汎
用的に利用できるこの要素内に配置するように使われることが多いようです。

 なお、このタグそのものには文書構造として意味を持つものはありません。単
にこの範囲がブロックレベル要素であるというだけを意味しており、特別な表現
を表わすものではありません。あくまでも汎用的に利用できるブロックレベル要
素ということなのです。

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

◆セキュリティに関する考察

パーソナル・セキュリティ
 個人で行うセキュリティに関して簡単にまとめました。快適なインターネット
ライフを楽しむために、参考になれば幸いです。

 ■メールの扱い
 ウィルスに感染する恐れの一番高いのがメールです。わけの分からない添付フ
 ァイルをつけたメールには十分注意しなければなりません。
  特に不意な添付ファイルをクリックすると、ウィルスに感染する恐れが非常
 に高くなります。個人でホームページを開設し、メールアドレスを公開してい
 る場合、少なくないウィルスメールが届いたことでしょう。

  ウィルス添付ファイルを送りつけるウィルスメール(抜粋)
  1.クレズ(WORM_KLEZ.H )ワーム型ウィルス
    他人のメールアドレスを勝手に利用し、メーラーのアドレス帖を参照し
    さらにウィルスを送りつけます。昨年感染率の堂々1位をしめ、史上最
    悪のウィルスといわれ、現在も非常に多く送りつけられています。ウィ
    ルスの被害者が知らぬ間に加害者になってしまう恐れがあります。
         ワームファイルの送信時に、感染先マシン上にあるファイルからラン
    ダムに選択した1ファイルを添付するため、情報が漏れる可能性がる悪
    質なウィルスです。

  2.リルバ(W32.LIRVA.A)ワーム型ウィルス
    感染してもファイルを削除するなど破壊的な被害はありませんが、アン
    チウイルスやファイアウォールなどのセキュリティ関連ソフトを強制終
    了させてしまう手口があります。ダイヤルアップ接続のパスワードを漏
    えいさせる機能もあり、亜種である W32.LIRVA.Cでは、バックドア・プ
    ログラムをインストールする機能や、HTMLファイルに自分自身を実行さ
    せるスクリプトを追加する機能をもっています。今年1月に発見。

  3.ソービッグ(WORM_SOBIG.A)ワーム型ウィルス
    感染すると自分自身をコピーし、レジストリキーを変更・追加し、大量
    のウィルス添付メールを発信します。ネットワークを調べて全てのオー
    プンな共有を探し、それらの共有のディレクトリにワームをコピーする
    スレッドを作成します。ウイルス自身がメール送信機能を備えているの
    で、ユーザのメールソフトを経由しないでウィルスを撒き散らします。

  4、バグベア(WORM_BUGBEARu)ワーム型ウィルス
    ソービック同様レジストリキーを変更しウィルス・ワクチンソフトを停
    止し、大量のウィルスメール送信、バックドア活動、ネットワーク共有
    を利用した感染などの活動を行う。受信時にプレビューしただけで感染
    する悪質なウィルスです。

  メーラー(メールソフト)には、各種のセキュリティに関するオプションが
 備わっています。圧倒的ユーザ数を誇るマイクロソフト社の Outlookでは、セ
 キュリティオプションから「ウィルスの可能性がある添付ファイルを保存した
 り開いたりしない」という項目があるので、チェックしておくといいでしょう。
 Outlookは、ユーザ数が多いということも狙われているメーラーの代表です。
 適時アップデートしてセキュリティホールのパッチをインストールしておきま
 しょう。

  メールによるウィルス感染は日々増大し、社会問題にもなっています。特に
 最近のウィルスは巧妙でたちが悪く、プレビューするだけでも感染したり、コ
 ンピュータを乗っ取ってしまう場合もありますので、メーラーのセキュリティ
 オプションからプレビューさせないように設定しておくことも、防御策になり
 ます。

  また、市販のウィルス・ワクチンソフトの導入もメールユーザには必須でし
 ょう。ただし、常に最新のウィルスに対応した「定義ファイル」をインストー
 ルする必要があります。ウィルスは現在分かっているだけでも 60000種を超え
 ています。そして毎日新しいウィルスが出現しています。
  せっかくワクチンソフトを導入していても、定義ファイルが古いと意味があ
 りません。特にブロードバンドが普及している今日、新種のウィルスの感染ス
 ピードの早いのが特徴です。ワクチンソフトは販売しているメーカーのホーム
 ページで最新定義ファイルを公開しているので、こまめにチェックしましょう。

 ■ブラウザの扱い
 セキュリティソフトを導入していない場合、ブラウザをデフォルト(初期値)
 のままで利用するのは、少々危険が伴います。
  悪意を持った少なくない Webサイトがあり、ActiveX や、JavaScriptによる
 攻撃を受ける危険が潜在的に否定できないのが現実です。その場合、コンピュ
 ータを乗ったられたり、パスワードやクッキーファイルを盗まれたり、巧妙な
 細工が仕掛けられています。

  得体の知れないサイトへ初めて訪れる場合、あらかじめスクリプトの実行や
 ActiveX の利用、クッキーの利用などを「オフ」にしておくことを強くお勧め
 します。

  マイクロソフト社の MSIE(Microsoft Internet Explorer)では、ブラウザ
 のセキュリティホールが度々報告されています。常にアップデートしておくよ
 うに心がけましょう。
  最近は、Operaや、Mozillaでもセキュリティホールが発見されています。

  Windowsユーザなら「Windows Update」は必須です。Macintoshユーザは最低
 週1回は「ソフトウェアアップデート」を行いましょう。(Mac OS X の場合)
  
 ■コンピュータの扱い
 経済的に許されるならば、できるだけ最新のOSを使いたいものです。特に最新
 の Windows2000/WindowsXP Proffestionalでは、ファイアーウォールの設定や
 データの暗号化が可能なので、利用されるといいでしょう。

  私の場合、ウィルスに感染することや、悪意あるクラッカーにハッキングさ
 れることを前提として、それなりの防御策を実施しています。

  1、メーラーのアドレス帖にはメールアドレスを登録しない
  2、メールメッセージは必要なものは外部に保存し、メーラーに残さない
  3.メールのパスワードは頻繁に変更する(少なくても月1回)
  4、データファイルはすべて暗号化し、共有しない
  5、データはできるだけ外部メディアに保存する
  6、コンピュータのパスワードは10桁以上で頻繁に変更する
  7、メインで使用するブラウザは、スクリプトを「オフ」、クッキーは使用
    しない、画像は表示しない、セキュリティレベルは最高に設定
  8、インターネットはセキュリティを施したルータを介して接続する
  9、メールの受信時やインターネット閲覧時以外は回線をオフにする
  10、セキュリティソフトの導入

 ■まとめ
 もはや安全はお金を出して買う時代です。しかし、常にセキュリティは「いた
 ちの追いかけっこ」でもあります。キリがありません。
  私が考え出した防御策は、ある意味ではセキュリティを放棄しているのかも
 しれません。つまり、ウィルスに感染してもかまわない状態、クラッキングさ
 れても平気な状態ということです。
  幸いにして今のところ被害にあったことはありませんが、この先は分かりま
 せん。ネットワークに安全はない、というのが私の持論です。

  ネットワークの利便性を取るか、安全性を取るかでおのずと各種設定が異な
 ってきます。この点は、ユーザ側で判断の分かれるところでしょう。

                               (つづく)

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

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

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

 次回も、XHTMLで作るテーブルの続編を予定しています。

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

質問・ご意見ははこちらまで→ banban@scollabo.com
なお、ご質問の際には、お使いの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

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

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

 当地ではここ何日間か暖かい日が続き、桜に花がほころびかけてきました。少
し動くと汗が出るほどの陽気に、やっと本格的な春を迎えました。

 年度末を控え、ほとんど毎日残業が続き、土日も出勤している関係で、かなり
参っています。おまけに花粉症に泣かされ、春の暖かさと引き換えにうらめしい
部分もあります。とにかく今は、長期休暇が一番欲しいものです。5月の連休は
まだ先のようです・・

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

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

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



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