CIW News Flash 　指定できるのは意味があるから [まぐまぐ！]

2008/01/30

CIW News Flash 　指定できるのは意味があるから

特に問題無いようです。 ■■■　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　■
■■　　　　　　CIW News Flash - IT 知識を武器にしよう - 　　　　　 ■■
■■ 　　CIWって何？　CIWを知ろう、学ぼう、IT基礎力を高めよう！　　 ■■
■　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　■■■
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
　　　　　　　　　　　　　　　　　　　　　　　　　　2008/1/30　No.18
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

寒さ厳しき折、みなさまはいかがお過ごしでしょうか。とはいえ、あと数日も
すれば立春になります。暦の上では春が来ます。……もちろんまだまだ寒い
時期が続きますが、一歩一歩、春は確実に近づいてくるそんな時期になります。

CIWをより深く知っていただくために、毎週水曜日、みなさまにCIWのサンプル
問題から読み解く、IT知識応用術をはじめ、CIWの最新ニュースなどをお届け
しています。毎週欠かさずチェックしていただけると幸いです。

　index-----------------------------------------------------------------
　01. とっておき、注目ニュース！
　02. CIWサンプル問題
　03. コラム　-　指定できるのは意味があるから
　04. 1週間の Webサイト新着情報
　05. CIWサンプル問題・解説

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
　01.とっておき、注目ニュース！
───────────────────────────────────

◆◇◆　CIWファンデーション V5受験　いよいよ明日より開始！　◆◇◆

ITスキル標準にも対応したCIWのファンデーション試験、いよいよ明日
2008年1月31日（木）より、V5対応の試験がスタートします！
（注意：プロメトリックのみ、1/31スタートとなります）

　CIWファンデーションV5試験詳細ページ
　http://www.ciw-japan.com/ciw/ciw_foundations_v5.html

1/21（月）からは、プロメトリック様にてV5の受験予約も可能になりました。
V4では物足りなかったみなさま、腕試しにV5受験はいかがですか？

【CIWファンデーション　公式テキスト】

2007年12月10日 CIWファンデーション V5　日本語版の公式テキストが販売を
開始し、現在はCIW-ATP、CIW-AAP様向けに先行販売を行っております。

　≫ 一般のお客様で CIWファンデーション V5公式テキストをお求めの場合

　　弊社カスタマーサポートにご連絡いただきましたら、代引きにて発送させて
　　いただきますので、お気軽にお問い合わせください。

※また、2008年2月初旬には、CIWファンデーションV5公式テキストを一般書店に
てご購入いただけることになりました。それまでは従来どおり、弊社もしくは
CIW-ATP様経由でのご購入をお願い申し上げます。

書店販売が可能となれば、実際にお手にとって教材をご覧いただけますので、
「CIWなんて知らんぞ。見たこともないようなテキストをいきなり買うのは
嫌だぞ」と思う方は、全国展開までお待ちください。もうすぐです！

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
02.CIWサンプル問題
───────────────────────────────────

今回も「CIWファンデーション」から出題。せっかくですので、各レッスン
ごとに、毎回１問ずつ出題していこうかと思います。
今回は、Web制作基礎の基礎のレッスン６から出題です。
（ファンデーションは、インターネット、ネットワーク、Web制作の基礎の
　3本立て構成です）

問1 テーブル作成にあたり、必ずしも必要ではないテーブル要素は
　　次のどれですか。

　 1.  <CAPTION>
　 2.  <TD>
　 3.  <TR>
　 4.  <TABLE>

　解説は、下部の「05.CIWサンプル問題・解説」をご覧ください。
　まずは、答えを見ないで、Let's try!

※問題は「CIWファンデーション」V4試験、同等問題

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
03.コラム
───────────────────────────────────

Web作成を行うとき、テーブルはよく利用します。
HTML4.01の頃はテーブルレイアウトといって、<table>タグを使って、
Webページの全体のレイアウトをしていたころもありました。
（XHTMLでは、CSSでデザイン的なレイアウトを作り上げることを推奨。
　<table>タグは本来の「表」構造を示すタグとして利用するのが望ましい）

ということで、今回は良く使う<table>タグについてみてみましょう。

…… 必須じゃなくても使ってね
　　　　　　　　　　　　　　　　　　　　　指定できるのは意味があるから

まずテーブルを定義するのには何が絶対に必要でしょうか。
これはテーブル（表）ですよという宣言が必要です。見るからに、<table>が
それっぽいです。

<table>
</table>

の1セットは絶対必要ですよね？

では次。二次元の表ですから、どこなんだという指定が必要です。
<table>タグでは次のような形で指定しています。つまり、
<tr>と<td>。

tr は Table Row の略で、テーブルの行を記述します。
td は Table Data の略で、テーブルのセルの内容を記述します。

つまり、
┌─┬─┐
｜ａ｜ｂ｜
├─┼─┤
｜ｃ｜ｄ｜
└─┴─┘　というような表であれば、

<table>　　　　　　　　　　　これから表を描きますよ
  <tr>　　　　　　　　　　　行があります。
    <td>ａ</td>　　　　　　　セルの中身は「a」です。
    <td>ｂ</td>　　　　　　　セルの中身は「b」です。
  </tr>　　　　　　　　　　　この行はこれで終わりです。
  <tr>　　　　　　　　　　　行があります。
    <td>ｃ</td>　　　　　　　セルの中身は「c」です。
    <td>ｄ</td>　　　　　　　セルの中身は「d」です。
  </tr>　　　　　　　　　　　この行はこれで終わりです。
</table>　　　　　　　　　　これで表を描き終わりました。

という感じの指定になります。
これで最低限、表は書けそうですよね。

でも、これだと表の構造上の情報までは伝えられません。
例えば、このａとｂの部分のセルは見出し部分かもしれません。

┌──┬──┐
｜単価｜金額｜
├──┼──┤　　
｜10円｜50円｜
└──┴──┘
という表だとすると、ａの位置にある単価、bの位置にある金額は
見出しという情報を、ｃとdはそれぞれそれに対応するデータだという
ことを伝えることができれば、より正しく情報を伝えることができます。

上部の<table><tr><td>の組み合わせでは、そこまでの情報は
伝えることができません。見出し部分なのかデータ部分なのかという
情報までは含んでいないからです。

<table>　　　　　　　　　　　これから表を描きますよ
  <tr>　　　　　　　　　　　行があります。
    <th>単価</th>　　　　　　このセルは見出し部分で中身は「単価」です。
    <th>金額</th>　　　　　　このセルは見出し部分で中身は「金額」です。
  </tr>　　　　　　　　　　　この行はこれで終わりです。
  <tr>　　　　　　　　　　　行があります。
    <td>10円</td>　　　　　　このセルはデータで中身は「10円」です。
    <td>50円</td>　　　　　　このセルはデータで中身は「50円」です。
  </tr>　　　　　　　　　　　この行はこれで終わりです。
</table>　　　　　　　　　　これで表を描き終わりました。

視覚障害者の方は、表に視覚的な施しで（単価や金額のセルの部分に
色が付いてるとか）見出しとデータ部分を分けられても、それを
理解することはできません。
もちろんそれは視覚に頼れない検索エンジンのロボットに関して
同じです。彼らはテキストデータだけしか読み取れません。

しかし正しいタグを使うことにより、例えば音声読み上げブラウザ
などで、単価が10円、金額が50円とう形で、正しく表を理解して
それを読んでくれたりもします。

このようにタグは、視覚に頼らず、本来の情報の意味合いを
より正しく記述することのできる力を本来持っているのです。

ちなみに<CAPTION>は表題が何かという情報を定義します。
<CAPTION>で指定しておけば、音声ブラウザで読むと、
これは何のための表ですよ、という表題を読んだ上で、
表の中身を読むことが可能になります。

視覚的にも、テーブルの上に表題が表示されるので、
この表が何の表なのかという情報を定義できます。

ということで、必須のタグというのは、表示に必要な本当に
最低限のものです。必須になっていないタグにも、それぞれ
役目があるから存在しています。その役目を知ることにより
より正しく情報を発信できるようになります。

このタグにはどんな意味があるのか？
それは、タグを知らなければわからないことです。
まずは暗記になっちゃいますが、どんなものがあるのかを知りましょう。
何が必須で、何が必須じゃないかも、その過程で自然とわかります。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
04. 1週間の Webサイト新着情報
───────────────────────────────────

◆CIW 公式サイトのここ1週間の新着状況

　　なし

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
05.CIWサンプル問題・解説
───────────────────────────────────

問1 テーブル作成にあたり、必ずしも必要ではないテーブル要素は
　　次のどれですか。

正解   1.  <CAPTION>
　　　 2.  <TD>
　　　 3.  <TR>
　　　4.  <TABLE>

解説正しい選択肢は、1番です。

必ずしも必須とされないテーブル要素は、<CAPTION>および<TH>です。
ただし<TH>タグは、<TD>タグを使わない時には必須となります。
<CAPTION>タグは表のタイトルにあたり、表組自体には影響を与えません。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
　編┃集┃後┃記┃
　━┛━┛━┛━┛

　思わぬところで答えが見えると、なぜかみょうに感慨深いものを感じます。

　以前、美術館でモネ展をやっていたので見にいったことがあったのですが、

　気に入った絵が数点ありました。あまり解説を読まないほうなので、直感

　だけで「好きだな♪」と感じていたのですが、この前、ひょんなことから

　なぜ好きなのかの理由の1つがわかりました。私が好きだと感じた絵は、

　日本の浮世絵の構図など、浮世絵の影響を受けて描かれたものだったの

　です。アイデンティティというか……自然の中に感情を書き込む、そんな
　
　浮世絵の描き手の思いを、直感で感じられたのでしょうか。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
◆　発行元情報
───────────────────────────────────
発　行　元：プロソフトトレーニングジャパン株式会社
発行責任者：工藤真紀子

配　　　信：まぐまぐ　http://www.mag2.com/ 　　　　(ID：247849)
登録・解除：http://www.ciw-japan.com/news_flash.html

【著作権に関して】

・本メールマガジンに掲載された情報の転送は歓迎致しますが、内容に関する
　著作権はプロソフトトレーニングジャパン株式会社に帰属します。

・CIWサンプル問題に関しましては、メールの転送などは構いませんが、
　WebやBlog上での公開はおやめください。ライセンスに抵触致します。　

その他、何かご不明な点がございましたら、
　info@prosoft-j.com　まで、メールにてご一報ください。

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━