KAWANO's PukiWiki Plus! - Lecture/JouhouC2007/3rd/review のバックアップ(No.1)

• バックアップ一覧
• 差分 を表示
• 現在との差分 を表示
• 現在との差分 - Visual を表示
• ソース を表示
• Lecture/JouhouC2007/3rd/review へ行く。
  • 1 (2007-04-23 (月) 05:35:20)

前回の復習

前回の内容

HTML(Hyper Text Markup Language)を使った、 Webページの作成をはじめました。

まず、次のような概念を説明しました。

• World Wide Webとハイパーテキスト
• World Wide WebとHTML
• Webページの作成
• HTMLの書き方

次に、HTMLを使ったWebページの作成として、 タグ（文書の構造を示すマーク）をいくつか使ってみました。

• HTMLファイルの「骨組み」をつくる （html, head, title, body）
• 「見出し」をつくる （h1, h2, h3, h4, h5, h6）
• 「段落」と「改行」をつくる （p, br）
• 「リンク」をつくる （hr）
• 「水平線」をつくる （a href）

前回のポイント

提出された課題を見て、 いくつか気になるポイントがありました。 自分が提出した課題をチェックしてみましょう。

ちなみに、前回の課題のサンプルをこちらに載せておきます。

(1) 文書の構造がわかりやすいですか？

「h1、h2」や「p」などの要素を上手く使い分けていますか？
HTMLでは、タグを使うことで、文書の構造（かたち）を表現します。 「（大きな）見出し」「（小さな）見出し」「段落」など、 人間ならとくに意識しなくても区別できるものを、 コンピュータにも区別できるようにするのです。

文書の構造がコンピュータにわかるようになると、 文書中のどの情報が重要なのか、 「情報の優先順位（プライオリティ）」をコンピュータが判断できるようになります。 このような技術は「検索サイト」でよく用いられており、 検索結果で上位に表示されるためには重要になります。

(2) 見出しをきちんと使えていますか？

「h1」要素は、本来、1回だけ使うものなので注意してください。
「h1」は最も大きな（重要な）見出しです。本でいえばタイトルにあたります。 その大きな見出しが、2回以上使われている場合があります。

(3) 文字を大きくするために見出しを使ってませんか？

「h1, h2, h3」要素は、「見出し」という構成要素をあらわしているものです。 文字の大きさを変えるために使ってはいけません。
「h1→h2→h3…」の順に、見出しの優先順位があり、h1は最も大きなレベルの見出しとなります。 次のように、 レベルの順番を入れ替えて使うようなことは、できるだけ避けましょう。 ただし、「h1→h3…」のように、途中の見出し要素を飛ばすのは、問題ないでしょう。

<h1>自己紹介</h1>
<h4>プロフィール</h4>
<h2>リンク集</h2>

(4) 段落をきちんと使えていますか？

段落を示す「p」要素の使い方は、ちょっと難しいかもしれません。

段落とは、その中に伝えたい内容を一つだけ書くものです。 文章が1つだけの場合もあれば複数ある場合もあります。 ある程度まとまった文章を書いたら、「p」要素で段落にしておきましょう。

また、「p」要素を忘れている場合もあります。 見出しなのか段落なのかわからなくなりますから、 忘れずに段落に指定しておきましょう。

(5) へんな入れ子になっていませんか？

次のように、見出しの中に段落を指定したりしていませんか？ 「見出し」と「段落」は、文書を構成する部品として、同等のものです。 タグの使い方には注意しましょう。

<h3>
  見出し
  <p>
    あいうえおかきくけこ…
    ……
  </p>
</h3>

(6) リンクに使う文字は、具体的ですか？

前回の課題ではとくに指示はしませんでしたが、 リンクを作るときに、そのリンクに使う文章はとても重要です。 リンク先の内容がわかるような、具体的な文章にしましょう。
よく使われる表現には、次のようなものがあります。

• ページの役割
  • 例: トップページ、ヘルプ
• リンク先のページのタイトル
  • 例: 日付の表記に関するノート
• リンク先のページのタイトル + サイトの名前
  • 例: 日付の表記に関するノート(The Web KANZAKI)

次へ進んで、 今回の内容を見てください。