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

                  毎週金曜日配信 What's New 2002/10/11
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
           初心者のためのホームページ作り
           http://www.scollabo.com/banban/
                <第22号>

             banban@scollabo.com
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

この講座はタグを覚えてテキストエディタだけでホームページを作るという、ど
ちらかというとやや専門的な作業が中心になります。各種の専用のオーサリング
ソフトとは一線を画して、思い通りのプロ並みのHPを作ることが出来ます。

 時には専門的で難解な言葉も出てきますが、なるべく初心者にも分かりやすく
解説していきます。どうぞ、気軽な気持ちでお付き合いください。講座をすすめ
る中で分からない点がありましたら、ご遠慮なくメールください。

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

 今週の課題 ■ テキスト(文字列、文章を構成するもの)
             ■ 外部スタイルシート

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

◆テキスト
ここでは、文字列を形成するテキストについての応用を詳しく解説します。
 多くのサイトのコンテンツはテキストで成り立っています。私たちがインター
ネットにアクセスして知ることのできる情報の多くがテキストと言っても過言で
はありません。
 テキストを記述する上でのアクセシビリティというものがあります。ここでは
テキストに関わる作法などを解説します。

■改行
強制改行させる場合の作法。例えば、

<p>昔々、とても可愛い赤頭巾<br>
ちゃんがいました〜省略</p>

 このように文字列をそろえるために文脈の途中で改行するのは決して褒められ
ません。音声ブラウザも正しく発音できない場合があります。句読点のあるとこ
ろで改行する方がいいでしょう。ただし、ブラウザが自動改行する分には問題あ
りません。

■文字間のスペース
 また、表などでの記述に

   日 時  17:00より
   場 所  ばんばんの家

 などと文字間に空白を記述している場合が多々見受けられますが、この場合音
声ブラウザでは、「ひ、とき」、「ば、ところ」と発音します。漢字に不要なス
ペースがあると、音声ブラウザはひとつの単語と認識してしまいます。どうして
も文字を離して使いたい場合は、スタイルシートを利用します。

 例: p { letter-spacing: 1em } この要素で囲まれた文字間に1文字分の空
 白が入ります。

■見出し要素の使い方
 見出し要素を段落やフォントの大きさの違いだけに利用される場合があります
が、文法的には明らかな間違いです。例えば、

<h1>赤頭巾ちゃん</h1>
<h2>赤頭巾ちゃんと狼</h2>
<h5>昔々、あるところに・・ 省略 </h5>

 h1〜h6はあくまで見出しに使う要素です。見出しとそれの文章とは明らかに違
うものです。見出しはあくまで見出しです。
 また、見出し要素の使い方にも問題になる記述があります。例えば、

<h1>基礎講座</h1>
<h3>スタイルシート</h3>
<h4>スタイルシートの利用は・・省略 
<h2>クラス属性</h2>

 最初の第1見出しの後に、第3見出しがあるのは変です。またその後に第2見
出しがあるのはもっと変です。正しくは、

<h1>基礎講座</h1>
<h2>スタイルシート</h2>
<p>スタイルシートの利用は・・省略 </p>

<h2>クラス属性</h2>
<p>クラス属性とは、・・省略 </p>

 見出し要素は段落ではありません。あくまで「章」あるいは「節」などの見出
しでなければなりません。音声ブラウザの中には見出しを女性の声、本文を男性
の声で区別して発声し、「視覚障害者」に理解しやすい工夫がなされているもの
があります。

 実は見出し要素の大きさは決められていません。ブラウザが判断して第1から
第6までの大きさを決定しているだけに過ぎません。ブラウザの種類によっては
見出しを中央に配置するのもさえあります。
 見出し要素の大きさを変えたい場合は、スタイルシートを利用しましょう。

■ フォントの大きさ
フォントの大きさの設定もアクセシビリティがあります。
 お年寄りにとって小さな文字は読みづらいものです。そこでユーザ側でブラウ
ザの設定を操作して、自由に文字の大きさを指定し、自分なりに読みやすい環境
にすることができます。

 しかし、作成者がスタイルシートでフォントのサイズをポイント(pt)、ミリ
(mm)、インチ(in)などで「絶対値」を指定してしまうと、ユーザ側で文字の
大きさを変えることができなくなってしまいます。

 できるだけフォントのサイズを指定しない方がユーザにとって便利です。どう
しても変化をつけたい場合はなるべく「相対値」を設定しましょう。相対値はユ
ーザ側の設定にも対応できるので安全です。特に大切な情報を読んでもらいたい
場合には「絶対値」を指定しない工夫が大切です。

 フォントの相対値の単位
 %、px、em、ex、smaller、small、x-small、xx-small、meduim、larger、large
 x-large、xx-large など (本誌第6号を参照してください)

 *なお、ピクセル(px)はユーザ側の画面の大きさによって左右されますので
  相対値ですが、安全のためフォントのサイズに指定しないようにしましょう。
  解像度の低い小さな画面では、辛いものがあります。

■ フォント名の指定
フォント名の指定をスタイルシートで記述する場合の注意として、制作者側の環
境で設定しないようにしましょう。例えば、Windowsで使われる「MS ゴシック」
は、Macintoshや UNIXでは再現されません。反対に、Macontoshでよく使われてい
る「Osaka」は、Windowsや UNIXでは再現されません。
 独自のフォント名を指定する場合は、相手の環境も考えて複数設定する配慮が
望ましいものです。
 例: p { font-family: "MS ゴシック",Osaka,san-serif }

できればフォント名を設定しないほうが最も望まれることでしょう。ユーザの中
には「明朝体」は嫌いだと言う方もおられるでしょうし、「ゴシック体」は馴染
めないという人もいると思います。
 読者の皆さんの中には、ブラウザの設定で、好みのフォント名を指定している
方もあると思います。

 すべてのユーザを満足させる方法はありません。ある意味では設定しないほう
がユーザを不愉快にさせることはないでしょう。

■ 文字色の指定
文字色も重要なポイントです。色を使ったページでは、色弱障害者に配慮する配
色を考えることも大切です。特に赤と緑の配色には注意が要ります。背景色に緑
を使って文字色を赤にすると見えにくくなる可能性があります。それらの色はな
るべく単独で使うようにしましょう。

 文字に色をつける場合は、意味のある場合に使用することをお奨めします。特
別な意味を持った場合や、他と違う内容などの場合には効果的ですが、意味なく
文字色を変化させるのは読みにくいものです。

 また、背景色との兼ね合いで、文字に色をつける場合は色相に注意を払う必要
があります。例えば、黒色の背景色に青色の文字色は読みづらくなります。

■ テキストを画像で使う
 Webページの中には、テキストを画像にして見せているところも少なくありませ
ん。しかし非視覚系ブラウザは画像を読めません。タイトル画像くらいでしたら
 alt属性で代替できるのですが、文章をまるまる画像にするのは感心できません。
テキストを画像にする意味があまりないように思います。

 同様に、スクリプトを使ってテキストを表示させるのも危険が伴います。スク
リプトをオフにしているユーザも少なくありません。当然、非視覚系ブラウザで
はスクリプトの実行が不可能です。
 どうしてもスクリプトを使いたい場合には代替ページを用意しましょう。
 (私も過去にたくさん作って恥をかいた経験があります。)

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

◆物理タグ  tt, i, b, u, s, strike, big, small, font
テキストに用いる要素の中には「物理タグ」と呼ばれるものが存在しています。
これらは、ユーザのハード及びソフト環境に依存するもので、使用しないほうが
安全と言われています。なお、b、i、tt要素は非推奨とはなっていません。
 しかしながら、何故 W3Cはこれらの要素を廃止にしないのか不思議でなりませ
ん。当講座では、物理要素の使用はお奨めしていません。代替となるフレーズ要
素(論理要素)、またはスタイルシートを利用しましょう。

 物理要素一覧
 <b> 〜 </b>  テキストが強調されて太い字で表示します。
 <i> 〜 </i>  テキストが斜体で表示されます。
 <u> 〜 </u>  テキストに下線が付いて表示されます。(非推奨扱い)
 <s> 〜 </s>  テキストに抹消線が付いて表示されます。(非推奨扱い)
 <tt>〜 </tt> テキストが固定ピッチフォントで表示します。(テレタイプ風)
  <strike> 〜 </strike> テキストに抹消線を付けて表示します。(非推奨扱い)
 <big> 〜 </big> テキストをより大きく表示します。
 <small> 〜 </small> テキストを小さく表示します。
  <font> 〜 </font> フォントの大きさを設定する場合に使用(非推奨扱い)

 *固定ピッチフォント=いわゆる等副フォントのことです。
  なお、代替のスタイルシートは「今週のおさらい」にサンプルと共に掲載し
  てあります。

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

◆フレーズ要素
テキストに論理的な意味を与えるものを、「フレーズ要素」と呼びます。これは
通常のテキストの中で使われるインラインレベル要素です。
フレーズ要素には下記の種類があります。
  em  strong  dfn  code  samp  kbd  var cite  abbr acronym

 ■ em 強調(Emphasis)終了タグ必須
  テキストが強調され、一般的な視覚系ブラウザでは斜体で表示されます。
 日本語で使用するのには、少し見にくくなる傾向があります。

 ■ strong より強い強調(Strong Emphasis)終了タグ必須
 テキストが強調され、一般的な視覚系ブラウザでは太字で表示されます。

 ■ dfn 定義用語(Defining Term)終了タグ必須
 技術的な専門用語など定義されたテキストであることを示す場合に使用します。
 一般的な視覚系ブラウザでは斜体で表示されます。また、非視覚系ブラウザで
 は無視されますが、安全であると考えられています。
  例:クジラは、<dfn>哺乳類</dfn>に属します。

 ■ code コード(Computer Code)終了タグ必須
 コンピューターのプログラムコードや出力結果を表示するときに使用します。
 比較的長文のサンプルなどを記述する場合は、pre要素を使うといいでしょう。
 一般的な視覚系ブラウザでは、固定ピッチフォントで表示されます。

 ■ samp サンプル(Sample)終了タグ必須
 主にプログラムやスクリプトなどの出力サンプルをマークアップするのに用い
 ます。ですが、プログラムコードそのもののサンプルは、むしろ、code要素と
 して使用するべきでしょう。一般的な視覚系ブラウザでは、固定ピッチフォン
 トで表示されます。

 ■ kbd キーボード(Keyboard)終了タグ必須
 ユーザによって入力される文字であることを示す要素です。
  この要素のもとの意図は、code要素と異なる表示をしてキーボード入力と結
 果のコード出力を読者が区別できるようにすることでした。ですが、code要素
 とまったく同様に表示します。

 ■ var 変数(Variable)終了タグ必須
 プログラムの変数や引数を示し、文章に付加的情報を表示するためのものです。
 一般的に視覚系ブラウザでは、イタリック体で表示されるようです。

 ■ cite 引用文献(Citation)終了タグ必須
 引用元などの情報源を参照する部分であることを示すときに、この要素でマー
 クアップします。主に blockquote要素と組で使って、作者名、文書名、サイト
  名などが当てられ、引用先としてこの要素内に記述します。

 ■ abbr 略語(Abbreviation)終了タグ必須
 略語として発音できない場合にこの要素で title属性を使ってマークアップし
 ます。
   例:<abbr title="World Wide Web Consortium">W3C</abbr>とは
     World Wide Web Consortiumの略語です。

 ■ acronym 頭字語(Acronym)終了タグ必須
 abbrと同じ略語を示しますが、この要素の場合、発音できる略語として使用す
 る時にマークアップします。
  例えば、LAN(ラン=ローカル・エリア・ネットワーク)、NATO(ナトー=北
 大西洋条約機構)などが挙げられます。音声ブラウザの発声に寄与します。
  視覚系ブラウザでは、この要素に囲まれたテキストにマウスを近づけると、
 ツールチップが表示されます。

 *フレーズ要素のサンプルは「今週のおさらい」に掲載してあります。

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

◆その他の推奨されるテキストに関する要素
上記フレーズ要素以外にも、状況に応じたテキストの記述に使う要素があります。

 ■ sup 上付き文字 終了タグ必須
 例えば、数式を記述する時に、 aの2乗とかのべき乗に使用する場合には、こ
  の要素を使って表現します。
  例:<p>
        a<sup>2</sup> + b<sup>2</sup> = (a + b) (a - b)
        </p>

  ■ sub 下付き文字 終了タグ必須
 例えば化学式などの数式にこの要素を利用します。
  例:<p>
        水の化学式は、H<sub>2</sub>O です。
     </p>

  ■ ins  追加部分 終了タグ必須
 そのテキストが、後から追記された時に使用します。一般的にこの要素で囲ま
 れたテキストには下線が付きます。また、title属性で示されたテキストは、
 視覚系ブラウザでは、ツールチップが表示されます。
  例:<p>
        ばんばんの親父が緊急入院しました!
    <ins title="医師の報告">どうやら、飲みすぎによる
    急性アルコール中毒だそうです。</ins>
        </p>

 ■ del 抹消部分 終了タグ必須
 その部分が既に抹消されたテキストであることを示します。
  ただし、この要素に対応しているブラウザでは、「抹消線」を付けて、他の
 部分と異なる表示をしますが、その表示方法が明確に決まっているわけではあ
 りません。ブラウザによっては、何も変化なく表示する場合があるので、スタ
 イルシートで色や抹消線などをつけるといいでしょう。
  例:<p>
      <del>xmp要素は、サンプルの表示に最適です。</del> 
				ただし現在は廃止されています。
    </p>

 ■ bdo 文字表記の方向 終了タグ必須
 通常、HTMLでのテキストの方向は、Unicode の Bidirectional Algorithm 
 (双方向性アルゴリズム)によって左から右に表記されます。
 この要素を使うことによって、一時的にそのアルゴリズムを無効にしたうえで
 文字の方向を指定できます。
    dir属性を使って方向を指定します。
  dir="rtl"  右から左へ
  dir="ltr"  左から右へ
  例:<p>
    ヘブライ語<bdo dir="rtl">HEBREW</bdo>は、右から左に書きます。
    </p>
    * HEBREW というテキストが、WERBEH と逆順に表示されます。

  ■ ruby ルビ 終了タグ必須
 日本語の漢字には読みが困難な難しい字があります。そんな場合に小さくルビ
 をふっておけば読む人にはありがたいものです。
  例えば、北海道の「足寄」という地名は「あしょろ」と呼びますが、これを
 HTMLで記述する場合に、ruby、rb、rt要素を使います。

     ruby要素は、テキストにルビを用いることを示します。
    rb要素は、ルビを付ける対象のテキストを示します。
    rt要素は、rb要素で示されたテキストのルビを示します。

  例:<p>
        <ruby>
          <rb>足寄</rb>
          <rt>あしょろ</rt>
        </ruby>
        </p>

 ただし、ルビの表示に対応していないブラウザ(Netscapeなど)では、ルビが
 足寄あしょろ 並んでと表示されてしまいます。そこでルビの部分に括弧をつ
 けて表示がおかしくないようにする方法があります。
 rp要素で括弧を囲っておけば、ルビに対応しているブラウザでは表示されず、
 対応していない場合は、足寄(あしょろ)と表示されます。
  例:<p>
        <ruby>
          <rb>足寄</rb>
          <rp>(</rp>
          <rt>あしょろ</rt>
          <rp>)</rp>
        </ruby>
        とは、北海道の地名です。
        </p>

 *ここでの要素のサンプルは「今週のおさらい」に掲載してあります。

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

◆pre 整形済みテキスト
テキストを記述する上で、空白や改行などを維持し整形したものを表示させる要
素に <pre> というブロックレベル要素があります。
 通常、テキスト間のスペースは基本的には半角分のスペースが与えられていま
す。そのためにたくさんの空白がテキスト間にあっても、半角文の空白しか表示
しません。また、改行させる時には、br要素で強制改行します。
  pre要素は、連続した空白を維持し、改行要素の要らないテキストを実現させ
ることができます。ただし、フォントは固定ピッチフォントになります。また、
ブラウザによっては設定した分のスペースが異常に広く取られたりする場合もあ
ります。そのためにはスタイルシートを利用して狙ったとおりのテキストを表示
させる必要があります。

 初心者が間違えやすい点として、この要素内にブロックレベル要素を使ってし
まうことがありますが、明らかな文法違反です。

 さっそく簡単な整形済みテキストの表示をさせるHTMLを作ってみましょう。
テキストエディタ(SimpleTextやメモ帳など)を起動して下記のようにタイプし
てください。
 (注:MacOS XのTextEditや、Windowsのワードパッドを使う場合には、保存の
際、標準テキストを選んでください。リッチテキストのフォーマットでは、HTML
文書として保存されません。詳細はそれぞれの「ヘルプ」を参照してください。)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=SHIFT_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>整形済みテキストの表示</title>
<style type="text/css">
<!--
div  { margin: 10px 50px }
h1   { font-size: large }
pre  { text-align: left;
       white-space: pre;
       font-size: medium }
-->
</style>
</head>


<body>
<div>
<h1>整形済みテキストの表示</h1>
<pre>
整形済みテキストと言うのは、空白や改行などを維持しています。
    このように空白があってもそのまま空白も表示します。
    pre要素の特徴として、
        1.テキストは固定ピッチフォントで表示される
        2.一般的に文字が小さく表示される
        3.空白や改行を維持して表示する
    などがあります。
    プログラムなどを記述する場合には適した要素です。

一般的に pre要素内には他のブロックレベル要素は記述することができません。
これは初心者が犯しやすいミスです。
</pre>
</div>

</body>
</html>

入力が終わりましたらHTML文書として保存します。そのためには必ず拡張子をつ
けて保存します。ここでは、test_26.html としておきます。「.html」を忘れず
に保存してください。なお、保存の際の文書名は任意の名前をつけていただいて
も差し支えありません。
 保存できたら、ブラウザで確認してください。

  サンプルHTML実行結果URL
 http://www.scollabo.com/banban/magazine/backnm_022.html#pre

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

◆解説
  div  {margin: 10px 50px }
 div要素に、上下10ピクセル、左右50ピクセルの空白を設けました。

  h1 { font-size: large }
 第1見出し用その文字の大きさを largeに設定しました。

  pre  { text-align: left; white-space: pre; font-size: medium }
 pre要素に、文字列を左に配置、空白スペースを維持させる設定をしました。
 ブラウザによって空白の幅が勝手に表示されないための設定です。文字の大き
 さを mediumとしてブラウザの初期値に設定しました。

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

◆外部スタイルシートの実践
先週述べましたスタイルシートの実装方法の中で、今回は外部に置く方法を詳し
く解説します。
 外部に置くスタイルシートの拡張子は「.css」です。これをlink要素によって
HTMLに読み込ませる方法が、リンキング方式です。

 ■ なぜ外部にスタイルシートを置くのか?
 ホームページを作る場合、決して1ページだけしか作らないということは、ほ
 とんどありません。それぞれ、「章」やカテゴリー別にページを作って、ホー
 ムやページ間からリンクする方法を用いています。

 ページを作る上で重要なポイントは何と言ってもデザインです。スタイルシー
 トを利用することで、ほとんどのデザインは可能です。
  「クール」なサイトとは、どのページでもデザインの一貫性があります。特
 別な用途がない限り各ページのデザインを統一した方が「格好いい!」サイト
 になると思いますし、訪れるユーザもそう感じます。

  ページが変わるたびにスタイルシートを記述するのは大変ですし、もし変更
 があった場合にはすべてのページを書き直さなければなりません。外部スタイ
 ルシートならば少しの手間ですべてのページに反映させることができます。

 ヘッダに置くスタイルシートでは下記のように記述します。
 <styel type="text/css">
  <!--
  body { background-color: #fff }
  -->
  </style>

 XHTMLでは、この中のコメントタグ  <!-- と -->  が本当のコメントと認識さ
 れスタイルシートが無視されてしまう可能性があります。
  そのような危険性があるために、 W3Cではスタイルシートを極力外部に置く
 よう推奨しています。将来の XHTMLの移行のためには今から外部にスタイルシ
 ートを置く方法を覚えておきましょう。

 ■ スタイルシートは複数読み込める
 HTML内に複数のスタイルシートを読み込ませることが可能です。状況に応じた
 スタイルシートを作っておけば、必要に応じて読み込ませることができます。

 私の場合は、カテゴリー別のメインのスタイルシートを作り、状況の変化に対
 応するサブのスタイルシートを利用しています。
  例えば、「今週のおさらい」というページでは常にスタイルシートの変化が
 あり、その都度メインのスタイルシートを変更していたのでは、他のページに
 影響が出てしまいます。そのために特定のページのみで使用するサブのスタイ
 ルシートを作って読み込ませています。

  サブのスタイルシート(私の場合は subsheet_1 という名前で連番にしてい
 ます。)では、必要なものだけしか記述しないので後々の編集の楽です。また
 「制作ノート」には、どのサブシートに何が書いてあるかを記録して、必要に
 応じて他のページでも利用しています。

 複数のスタイルシートを利用するHTMLは、
 <link rel="stylesheet" href="../css/mysheet.css" type="text/css">
 <link rel="stylesheet" href="../css/subsheet_15.css" type="text/css">
 と、このようにヘッダ部に記述して2つの外部スタイルシートを読み込ませま
 す。ちなみに上記は「今週のおさらい」で使用しています。

(Tips:制作ノート)
「制作ノート」という言葉が出てきたので説明します。私の場合、依頼されたも
のを含めてページを作る場合には、必ず「制作ノート」を作ります。
 もちろん手書きの「ノート」です。これには、ページのラフデザイン、使用す
るディレクトリとリンクの割り振り、画像ファイルの容量と縦横のサイズ、取材
の場所と日付、HTMLファイル名と容量、スクリプトやスタイルシートの内容など
かなり細かく書いています。時には作ったページを印刷して部分的に貼り付けて
います。

 この習慣は昔からのもので、ある種の「コーディング・ノート」みたいな、い
わゆる台本です。
 デザインとは「発想」ですから作ろうと思っても作れるものではありません。
私の場合は貧弱な「発想」しかありませんので、日頃からノートを片手に思い浮
かぶものを殴り書きしています。
 また、「制作ノート」があると、更新作業の時には非常に便利です。ページご
とに使用している画像やスタイルシートが記載していますので、何を手直しする
べきかがすぐに分かります。

 読者の皆さんも、ページ作成時には「ノート」を1冊作っておくと便利ですの
で、お奨めします。

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

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

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

次回は、アンカーのスタイルシートとスクリプトの対比について解説します。
(教材を利用しますので、当サイトにてダウンロードしてください。)

(注:本講座に関するすべてが無料です)
読者から質問される中で一番多いのは、メールマガジンの購読、教材、質問事項
に関して、どれくらい費用がかかるのかという問い合わせです。
 当講座では、一切費用はかかりません。お金は受け取っておりません。読者が
アクセスする通信費以外は費用はかかりませんので、ご安心ください。
 なお、どうしても受け取れという申し出には遠慮はしておりません。このよう
なご奇特な方はいないと思いますが・・

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

◆更新情報 --- バックナンバーの配布
本誌11号から20号までのバックナンバーを当サイトにて配布します。なお、この
バックナンバーは圧縮されたアーカイブファイルになっています。
(第1号〜第10号までは既に配布が可能となっています。)

 アーカイブは、Macintosh、Windows、UNIX系の各プラットフォーム別にダウン
ロードできるようにしました。途中からご購読いただいた読者には、過去の記事
をオフラインでゆっくり読むことができますので、ご利用ください。

 Windows版とMacintosh版はそれぞれ自己解凍できるアーカイブになっています。
ZIP形式、tar形式はお手数ですがアーカイブ解凍ソフトをお使いください。

 バックナンバー・ダウンロードURL
  http://www.scollabo.com/banban/daf/archive.html

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

質問・ご意見ははこちらまで→ banban@scollabo.com
なお、ご質問の際には、お使いのOS、通常使っているブラウザ、使っているテキ
ストエディタなど、なるべく分かりやすく制作環境を明記していただけると回答
しやすくなると思います。
 ただし、平日の昼間は会社勤めなので、返事が遅れることがあります。ご了承
ください。

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

誤字・脱字・変換ミス・表現欠乏などには平に御容赦願います。なお、マガジン
内容の記述に重大な誤りがある場合、叱咤と罵声と共に私まで突きつけていただ
くと幸いに思います。

バックナンバー こちらで公開しています。
プレーンテキスト  http://www.scollabo.com/banban/magazine/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

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

<えでぃた〜ず・るーむ>
「ナノ・テクノロジー」という言葉を聞いたことがあると思います。1メートル
の10億分の1の長さを表す単位で、民間企業ばかりでなく国を挙げてこの革新技
術に取り組んでいます。
 日本では、その微細加工技術のもう1つに「フェムト秒」という新たな分野で
1995年から官民共同で開発に挑んでいます。

 「フェムト秒」という時間の単位は、1000兆分の1という、とてつもなく短い
時間のことで、通常、光の速さは1秒間に地球を7週半というスピードを持って
いますが、「1フェムト秒」では約 0.3ミクロン、およそウィルスの直径に等し
い長さしか進まないのです。

 「フェムト秒」の応用技術は通信分野で期待されています。現在の光通信にお
ける通信速度は、最大1秒約100メガと言われています。
 これは、光の「オン」と「オフ」によってデジタルデータが運ばれます。もし
この光ファイバーで「フェムト秒」が実施されれば、1秒間で約1テラビットに
なります。

 この1テラビットとは、1000ギガのことを指し単位で、現在の光ファイバーの
速度の約1万倍の速さになり、新聞 300年分に匹敵するデータ量をたった1秒で
送受信が可能になるという夢のようなデータ通信です。

 ただし、実用化までには10年以上先になるようです。これが実用化されると、
インターネットの世界は大きく変わってしまうでしょう。もう画像は当たり前で
映像もふんだんに使えるようになり、テキストで伝える情報は圧倒的に少なくな
るでしょう。おそらく、リアルタイムの双方向で、この講座が読者の皆さんと直
接指導ができるかもしれません。
 そうなると学校教育も変わるんだろうなと思います。技術の進歩とは、まさに
日進月歩、そのすさまじさに、ただただ驚くばかりです。

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

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

      Copyright(C) 2002  www.scollabo.com/banban/
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■



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