1. 本日の作業内容
   
   
   1. HTML
      
      1. 見出と段落
         
      2. 箇条書き
         
      3. 表
         
      4. 文字の属性
         
      5. その他のテクニック
         
   2. 今日の実習
      
   3. 本日の復習課題
      
   4. 次週の内容
      
   5. Webページ作成開設支援について
      
   
   
   
2. HTML
   
   HTMLの詳細に関してはいくつも書籍が発行されているので、より詳しく知りたい場合にはそれらを参考にすること。ここでは、教科書を補足して最低限の内容だけを紹介する。なお、非常によく使われている機能にフレームがあるが、視覚障害者にとって問題のある表記方法なので、ここでは紹介はしない。必要に応じて自分で調べればよい。
   
   
   1. 見出と段落
      
      教科書p.168

      <h1></h1>...<h6></h6>まで６段階で見出の文字の大きさを指定できる。中央に文字を揃えるには、<center></center>タグで囲む。

   2. 箇条書き
      
      教科書p.168

      ページの論理構成を明らかにするには箇条書きが適している。箇条書きにおいては、見出に付けるラベルが数字の場合や記号の場合、任意の文字列の場合などがある。それぞれ、以下のようなタグで実現できる。また、属性を指定すると別のパターンに変更も可能である。

      1. 記号付きリスト
         <ul></ul>で囲んだ範囲が記号付きリスト形式になる。記号はデフォルトでは階層順に●○■の様に変化することになっているが、自分で変更も可能である。変更は属性を指定して行う。例えば、<ul type="disc">などと指定する。ほかに、circleとsquareが指定できるのでデフォルトと異なる設定に変更する際は使用する。また、リスト環境は入れ子に出来るので、各階層ごとに自分の好きな記号に変更できる。見出は<li>としておく。この<li>タグには閉じタグ部分は無い。

      2. 番号付きリスト
         <ol></ol>で囲む。見だし記号は同じく<li>である。番号の属性としてtype=で指定できるのは、1AaIiがあり、デフォルトが1である。表示内容は自分で試してみると分かる。

      3. 定義型リスト
         <dl></dl>で文字列を見出しとするようなリストが作成できる。見出しになる文字列の頭に<dt>を付け、その中身（説明文）になる領域の先頭に<dd>をつける。やはり、閉じタグは無い。

      
      

   3. 表
      
      教科書p.172

      ページ構成をすっきりさせるも一つの方法が表である。罫線の無い表によりブロックごとに整理された文章を作成することが可能である。また、罫線を入れた場合には罫線の太さを変えることにより印象が異なる。擬似的にボタンのように見せることも可能である。<table border=10></tabel>のようにすると枠が太くなる。組み合わせると以下のような例も可能である。

      Pyramid?

      表は実際にデータ整理などに使用するためには非常に複雑なタグが必要になる。以下に少しだけ例を挙げるので、ソースを表示させてどのように実現しているか確かめて欲しい。

      複数行にわたるデータがある場合

      a11	b11	c11
      		c12
      	b12	c13
      a21	b21	c21

      複数列にわたるデータがある場合

      a11	b11			c11
      a21	b21	b22		c21
      a31	b31	b32	b33	c31

      行単位で文字を中央揃えする場合

      a11	b11			c11
      a21	b21	b22		c21
      a31	b31	b32	b33	c31

      特定のセルの背景色を変更する（table属性を指定すると全体の色の指定も可能）

      a11	b11			c11
      a21	b21	b22		c21
      a31	b31	b32	b33	c31

      セルの横幅を指定する場合

      a11	b11	c11
      		c12
      	b12	c13
      a21	b21	c21

      
      

   4. 文字の属性
      
      実に多数の属性が存在するので、代表的なものだけ列挙する。自分で試すことを忘れずに。

      <font color="red"></font>　文字色
      <font size=5></font>　文字サイズ（相対指定も可）
      <b></b>　太字
      <i></i>　斜体字
      <u></u>　下線
      <s></s>　削除線
      　上付
      　下付
      <tt></tt>　タイプライター体（等幅表示）
      
      
      

   5. その他のテクニック
      
      こういうページは如何？

      また、このテキストで使用されているマーカーを使ったリンクもページ構成で重要になる場合がある。通常のハイパーリンクと少し変えて

      <a href=#top></a>

      のようにしておくと、そのページ内でtopという名前が付けられた場所にジャンプする。名前を付けるためには適当な部分を

      <a name="top"></a>

      のようにして囲っておく。これは別のページの特定の場所にリンクする場合にも似たようなことが使用される。課題予告のページのソースを見るとそこで使われているのが分かる。

      最後に特殊文字についても触れておく。教科書のp.175にあるが、このwebテキストのようにHTMLの中に、HTMLのタグを記述する場合に、ブラウザが表示する際にタグには見えないようにエスケープ（処理をさけるという意味）しないといけない。HTML中では＆の記号がエスケープ記号になり、タグの記号の略号とエスケープの終わりを示す；（セミコロン）でタグの<や>が表示できる。このページのソースを見ると随所に使用されているのがわかる。

   
   
3. 今日の実習
   
   HTMLに関して、本日の内容と各種のページのソースを参考に、練習してみる。特に、テーブルの作り方及びリスト表示（箇条書き）について自分で作成して試してみる。

4. 本日の復習課題
   
   授業の終わり頃に次回までに提出する課題を発表するのでアナウンスに注意すること。また、発表されたら課題を表示するためには、一度このページを再読み込みする必要があるのでNetscapeのボタンをクリックする。そうしないと、課題のページは表示されない。

5. 次週の内容
   
   第１２章、シェルについて学習する。再び、地味なLinuxのターミナル上でのコマンド操作になるが、使い込むためには一番重要な部分なのでしっかり学習しておこう。

6. Webページ作成開設支援について
   
   これを機に自分のwebページを開設したいという希望があれば環境を用意するので、申請すること。多少の支援は行うので、少し自分で勉強しておけば難しいことではない。詳しくは口頭で説明する。

目次ページへ戻る