====================================================================== ● ● ●●●●● ● ● ● ☆HTML入門講座☆ ● ● ● ●● ●● ● 第7号 98/9/22 ● ● ● ● ●● ● ● ●●●●● ● ● ● ● ● ● ● ● ● ● ● 発行人: ● ● ● ● ● ● 池田蛇足 dasoku Ikeda ● ● ● ● ● ●●●●● Visit Our Web Site About This Magazine and HTML---------------------- http://hp.vector.co.jp/authors/VA014079/study_html/ =====================================================発行部数 2462部= 第5講:見出し 今回からHTMLファイルの中身をさっそく記述していきますが、ここでまた 最初に言っておかなくてはならない点があります。それは、HTMLはテキス トの見栄えを整える言語ではない、という点です。確かにHTMLを使えば、 文字を大きくしたり、文字の色を変えたり、下線を引いたりすることもできま す。文字をスクロールさせたり、(個人的には大嫌いですが)文字を点滅させ ることも、まあできるでしょう。しかし、にも関わらず、やはりHTMLは、 ドキュメント(=文書)の見栄えを指定することを目的としたマークアップ言 語ではないのです。 たとえば次のHTMLをご覧ください。 【例1:Hn】----------------------------------------------------------

HTML入門講座

FAQ About HTML

WYSIWYG方式の是非

(参考資料>資料1) ---------------------------------------------------------------------- 三つの文があって、それぞれを

のタグで囲んでいます。これをブ ラウザで見るとどうなるでしょう。 前回の内容を思い出しながら、ドクタイプ宣言以下を記入し、と の間に上のソースを入れ、適当なタイトルをつけ、sample.html などの名前を つけて保存し、お持ちのブラウザで眺めてみてください。 なお、面倒な人はサイトにサンプルをアップしておきますので、そちらをご覧 ください。「参考資料・サンプル」にあります。(参考資料>資料1)は、サ イト上にサンプルが置かれていることを示します。 GO> http://hp.vector.co.jp/authors/VA014079/study_html/ さて、大部分の人、いやこのマガジンを購読されているほぼすべての人の環境 (ブラウザ)では、おそらく

が一番大きな文字で、

がその次、

は 一番小さく表示されたのではないでしょうか?? じゃあというタグは、文字の大きさを指定するためのものなのでしょうか。 答えは、NOです。結論から言うと、というタグは、そこにはさまれた文 字列が「見出し」であることを示しています。 欧米圏の伝統的な思考法である、ツリー構造(ディレクトリの構造がそれです ね。ドゥルーズが恐れたのもそれです (^O^))というやつを反映しているので すが、見出しの大きさに応じてレヴェルを与えています。 【例2:ツリー構造の見出し】------------------------------------------ 第一章 第一講:構造主義の黎明 1:ソシュール言語学 2:「構造」の美学と詩学 3:巨星レヴィ=ストロース 第二講:構造主義の発展 1:構造主義的文化人類学 2:ヤコブソンの詩学 3:テクスト論 第三講:構造主義の爛熟 1:ロラン・バルト 2:記号論の展開 3:ロトマンの冒険 第二章 (以下略) ---------------------------------------------------------------------- まず第一レヴェルに「章」という区分があって、その一つ下の階層に「講」が あって、さらにその下の階層にセクションがありますね。は、このように 構造化、階層化されたドキュメントの見出しのためにあるタグです。 の n には1から6までの整数を指定します。これが階層のレヴェルを示し ます。ですから、もし【例3】をHTMLでマークアップするとしたら、次の ようになるでしょう。 【例4:ツリー構造のマークアップ】------------------------------------

第一章

第一講:構造主義の黎明

1:ソシュール言語学

2:「構造」の美学と詩学

3:巨星レヴィ=ストロース

第二講:構造主義の発展

1:構造主義的文化人類学

2:ヤコブソンの詩学

3:テクスト論

第三講:構造主義の爛熟

1:ロラン・バルト

2:記号論の展開

3:ロトマンの冒険

第二章

(参考資料>資料1) ---------------------------------------------------------------------- 「でも結局、大きさをコントロールできるんだろっ!!」とおっしゃるかも知 れません。たとえば【例1】などは 【例2:フォント】--------------------------------------------------- HTML入門講座 FAQ About HTML WYSIWYG方式の是非 (参考資料>資料1) --------------------------------------------------------------------- とすれば、ほぼ同じ効果が出せると言う人もいるでしょう。ですがでは、(たとえたまたま或るブラウザの「表現」が同じでも)まるで意味 が違います。前者が文字の大きさを指定するのに対し、後者は、はさまれる文 字列が、ドキュメントの「見出し」であるということを示しているのです。 たとえば、或るブラウザでは、の見出し階層を、インデントを使って表現 しようとするかも知れません。或るブラウザでは、

をセンタリングし、

以降をアンダーラインで表現するかも知れません。●○・などの符号を付して 階層構造を表現しようというブラウザがあってもまったくおかしくありません。 「ええっ!自分のサイトがどう見られてるか分からないなんて気持ち悪いっ」 と考える方もいらっしゃるでしょう。しかし逆を考えれば、は、(そのブ ラウザが正しくHTMLを解釈できるのであれば)必ず「見出し」として表現 してくれます。もしこれをタグで実現しようとすると、フォントサイズ を変更できないブラウザでは無視されてしまうのです。 また、視覚障害をお持ちの方が読み上げブラウザで閲覧した時、「見出し」な らば、そこを読み上げた後一息置いてそこが「見出し」であることを表現した りできる可能性がありますが、フォントの大きさをただただ物理的に指定する タグでは、そこが見出しとは認識されず、単なる文字デザインの異なる 本文として認識され、普通に通して読まれてしまうかも知れません。 HTMLはドキュメントの見栄えを指定することを目的とした言語ではありま せん。最新版のHTMLであるバージョン4.0では、見栄えの指定をスタイ ルシートに一任することで、まずます見栄えでなく、文章の論理構造を指定す る言語だという性格を強めました。たとえばタグは、4.0では非奨励 とされ、やがては消えていく運命にあるようです。 ブラウザの出力が、HTMLの単なる一解釈に過ぎないということ、そして、 見栄えは別に追求するとして、論理構造さえしっかりとHTMLで指定してお けば、まずどんな環境でも閲覧できるWEBページになるということを押さえ ておきましょう。 今回の講義をまとめましょう。 ○HTMLは見栄えではなく論理構造を指定するためにマークアップする言語。 ○タグは、「見出し」の指定 ○「見出し」は階層的レヴェルを持つ。 ○の n には1〜6の階層レヴェルを表す整数を入れる。 ○はあんまり使わないほうがいいかもよ。 ただし、タグについてはちゃんと後に詳述しますね。 ●宿題 を使って適当なHTMLファイルを書いてみてね。 ●前回の宿題について 色々なご意見、御感想をありがとうございました。 m(__)m 異論反論、罵倒から、賛同賛辞まで毀誉褒貶、さまざまでした。多くの人のご 意見をお聞きすることは大変勉強になります。たとえばポーランドで購読され ている読者の方から、ブラウザの限定有無も大事だが、通信速度も千差万別な のだからアクセスブリティーについても考慮されたい、とのご意見をいただき ました。いや、この視点は僕に欠如していたものでした。 今後とも忌憚ないご意見をお待ちしています。でも、傷つきやすい性格なので 「馬鹿かおまえは」で始まるような、それを読むだけでその一日が陰鬱なもの になってしまうようなメールはやめてくださいね。(^O^) ★編集後記★ ・学校がはじまりました。ゆえに、ちょっと発行頻度が落ちます。 少なくとも週2号のペースは死守する所存です。今、レポートに追われてい ますが・・・・。 ・ちょっと先の話にはなりますが、静止画像のインライン表示の説明のときに 僕の愛用する D-pixed というフリーのイメージエディタを紹介しますが、マ ッキントッシュ環境でこれに該当するソフトをご存知の方は教えてください。 ソフトの性能として、以下のものは揃えていてもしいです。フリーが望まし いですが、場合によってはシェアでも構いません。 ・Gif方式に対応(読み込み、保存、編集) ・256色のイメージの編集が可能 ・透明化Gifに対応 記事充実のために、なにとぞご協力をお願い申し上げます。 ・今日の【例】のコードはほとんどサイトにサンプルとして掲載してあります。 是非、併せてご覧ください。掲示板にも足跡を残してもらえると嬉しいっす。 ★http://hp.vector.co.jp/authors/VA014079/study_html/ ・読者獲得キャンペーン実施中。お友達にもこのマガジンの存在を教えてあげ てください。サイトでバックナンバーを入手できるので、今ならすぐに追い つくし。みんなでHTMLのお勉強を(僕もね)していきましょう。 ・私信になりますが、ポストペットを購入する予定です。もしもやっている人 がいたらメール交換しましょう。カメがいいな、とか考えてます。ははは。 ポスペOKのメール、かなり本気で待ってます。 ^_^; ---------------------------------------------------------------------- ●次号は9月下旬の発行予定です。 ●Visit Our Web Site About This magazine and HTML- - - - - - - - - - - バックナンバーの閲覧、購読解除&登録、みんなの助け合い掲示板、リンク集 やソフト紹介など、このメールマガジンのサイトです。そのうち素材展なんか も開こうかと考えています。 ★HTML入門講座 ホームページ GO>http://hp.vector.co.jp/authors/VA014079/study_html/ ●YUJU HTML Editor1.0- - - - - - - - - - - - - - - - - - - - - - - - - HTMLをテキストベースで編集することに特化したエディタです。「シェア ウェア(500円)」ですが、当マガジン読者には無料で配布します。是非、 ダウンロードしてお使い下さい。なお、無料でお使いになる場合は、下記アド レスまで一言、お便りくださいね。ちなみに、拙作のソフトです。性能は…そ んなにすんごいモノじゃありませんので、期待しないように (^O^) あくまで 教育目的の仮バージョンってことで。実用版 2.0 はそのうちリリース。 ★なお、このソフトは Windows95 98 NT4.0以上の環境でお使いになれます。 Download URL http://www.vector.co.jp/vpack/browse/software/win95/net/sn073890.html Mailto dasoku@geocities.co.jp ★ソフトへのご要望、ありがとうございました。未熟なソフトですみません。 バージョンアップに際して考慮します。ありがとうございました。 =================================================================== このメールマガジンは、インターネットの本屋さん『まぐまぐ』を利用し て発行しています。( http://www.mag2.com/ ) =================================================================== ---------------------------------------------------------------------- HTML入門講座 第7号 発行人:池田蛇足 dasoku@geocities.co.jp 9月22日発行 発行部数 2462部