span要素の存在

第6回日記巡回中

早速第6回授業日記をアップしてくれてる人の日記を巡回しています。diary.htmlに書いてくれてる人は直接コメント書けないので、、
>ID:025さん
>授業スケジュールのタグ引用文は色が薄くて若干見づらい
確かに!というわけで早速なおしました。
それからID:19さんのブログにもコメントつけました。
全体的に、span要素とdiv要素の違いとかclass属性とid属性の使い方がしっくりこない、、という内容が多いですね。授業終了後にもふたりの人から”span要素の存在って微妙じゃありません(class属性で意味の補足できるならそれでいいじゃない)?”っていうような内容の質問を受けました。かなりいい線いってる質問だと思います。
文章で表すってつくづく、難しいです。正確に伝えようとするとよけいに回りくどく分かりづらい言葉を使わなくてはならないこともあったりするのですが、、、それしか方法がないのでもう一度ここでも復習してみましょう。
span要素は、示したい情報のかたちを示すための要素がない場合にclass属性と組み合わせて用いる要素です。
HTMLで使うことができる要素には限りがあります。これまで授業で出てきたものは、見出しを表す要素、段落を表す要素、改行箇所を表す要素などですが、「情報のかたちをデザインする」ということを学んだ第2回授業で使った展覧会のDMを思い出してください。あのDMのなかに配置されていた文字や図形、画像などを、先に出てきた「見出し」「段落」「改行箇所」だけで情報のかたちを示すことができるかというと、そうではありませんね。あのDMにはもっと複雑な情報のかたちを示すべき情報がありました。そのような、HTMLの要素だけではその情報のかたちを示しきれないときにspan要素にclass属性を組み合わせてマークアップします。
授業サイトの例のように、h1要素としてマークアップした「夕焼けフォトグラフ〜京都の秋の空〜」の「〜京都の秋の空〜」はサブタイトルなので、

<span class="subtitle">〜京都の秋の空〜</span>

とspan要素でマークアップしましたが、これもサブタイトルであるということを表す要素がHTMLにはないため、汎用要素であるspan要素を用いてサブタイトルであることを示していることになります。
ほかにもいくつか例を。
文章中の日付であることを示したいとき

<p>今日は前回<span class="date">11月15日</span>の授業で作成したフォトアルバムのHTMLファイルに適用させるスタイルシートファイルを作成しました。</p>

文章中の注意箇所であることを示したいとき

<p>HTMLファイルを更新したら<span class="warning">アップロードしておく</span>ことを忘れないようにしてください。</p>

このとき、「subtitle」「date」「warning」などの値は任意でかまいませんが、できるだけ補足したい意味(情報のかたち)を端的に表す英語を充てておくのがベターだと思います。