毎週金曜日配信　What's New 2002/5/31 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 　　　　　　　　　　　初心者のためのホームページ作り 　　　　　　　　　　　http://www.scollabo.com/banban/ 　　　　　　　　　　　　　　　　＜第３号＞ 　　誰でもすぐ分かるHTMLタグを丁寧に解説しながら勉強していく講座です。 　　　　講座をすすめる中で分からない点があったらメールくださいね。 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ この講座はタグを覚えてテキストだけでホームページを作るという、どちらかと いうとやや専門的な作業が中心になります。マイクロソフトの FrontPageやＩＢ Ｍのホームページ・ビルダーとは一線を画して、思い通りのＨＰを作ることが出 来ます。時には専門的な難解な言葉も出てきますが、なるべく初心者にも分かり やすく解説していきます。どうぞ、気軽な気持ちでお付き合いください。 　なお、このマガジンは等幅・等長フォントでお読みください。基本的に全角36 文字にて書かれています。 今週の課題■各種の設定（今週は難しいぞーっ！！） ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 決まりごと・・DTD(Document Type Definition：文書型定義)の宣言 （HTML文書のバージョンの宣言） これはHTMLでの必須条件です。今まで講座のサンプルでは無視してきましたが、 今後のサンプルではなるべく記入するようにします。 　文書型定義が宣言されていないHTML文書は、 HTML2.0仕様書によると「ブラウ ザは HTML2.0として扱え」となっていますが、HTML4.01ではこの考え方では現状 に対応できないとの見解をＷ３Ｃが示しております。つまり、それなりのバージ ョンとして扱った方がいいということでしょう。 　同時に、全要素、属性に対して、誤った記述をブラウザ側で正常に表示するよ うに求めており、この文書型定義の明示如何に関わらず、一応正常に表示される はずです。ただし、誤った記述に依存したHTML設計は良くないとのことも明言し ていますので、HTMLを書く場合、常に文法に気を使わなければなりません。 　つまり、あらゆるHTML文書の行頭にバージョンを明示する文を加えなければな りません。この文は、HTML要素の外で構いません。（通常はHTML文書の１行目） これは、タグではなく宣言であるということです。 　また、大文字と小文字の区別があるので、下記のように記述します。 DTD(Document Type Definition)は大きく以下の３つに分けて考えることができ ます。 ◆HTML4.01 Strict DTD あるいは、 廃止予定の要素や属性とフレーム関連を除く、すべての要素と属性が定義されて います。 将来、このDTDに統合されていく予定です。 　早い話が、HTML4.01で定義されている要素と属性しか扱えないという非常に難 しい文法です。当然ブラウザ独自によるタグも扱えません。非常に厳格な文法し か許されていません。慣れてしまえば簡単なのかもしれませんが、私の頭の中に は昔の悪い「癖」があるゆえ、「困難」な作業になってしまいます。これが完璧 に使いこなせないと、XHTMLには行けないのかなぁ、なんて思ってます。 ◆HTML4.01 Transitional DTD あるいは、 廃止予定の要素や属性を含むすべての要素と属性が定義されています。 　Ｗ３Ｃでは将来、この宣言は廃止予定ですが、ブラウザはこれらをサポートす る必要があります。廃止予定とは将来的なもので期間は言明はしておりません。 　この宣言型は、過渡的なものとして多くのＷｅｂページで採用されています。 今後廃止予定の要素が今のところ使えるという点では、ありがたい宣言です。講 座では、なるべく廃止予定の要素は使わないよう心がけていくつもりです。 ◆HTML4.01 Frameset DTD フレーム関連と廃止予定の要素や属性を含むすべての要素と属性が定義されてい ます。将来、これも廃止予定ですが、ブラウザはこれらをサポートする必要があ ります。 　早い話が、Transitionalにフレーム要素が追加されたものと思ってください。 なお、フレームに関する講座はいずれ予定しております。 ちょっと古いHTML参考書では、上記文書型の宣言は省略しても良い、なんて書い てあったものがありましたが、これはまったくの嘘です。Ｗ３Ｃではとっくの昔 から必須条件として明記しています。HTML2.0 からだったと思いますが・・ ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 決まりごと・・文字の設定（文字コードセットの設定） 皆さんがインターネットでいろんなページを閲覧するとき、時々文字化けするサ イトに出会ったことがあると思います。そのほとんどが文字設定を忘れている場 合があります。正統派を目指すうえで必ずの中に使用する文字を設定しま しょう。私たち日本語を使うものにとって、必須条件です。 文字コードセット設定のタグを紹介します。 初心者のためのホームページ作り ◆解説 通常には属性がないのですが、HTML文書全体が日本語で書かれていること を明記するために、と示します。 の部分は改行せずに１行で書きましょう。この文字設定は SHIFT-JISで、 圧倒的に多くのサイトで採用されています。この文字コードセットはIANAという 組織が管理しています。現在、SHIFT_JIS、ISO-2022-JP、ECU-JPの３つの日本語 文字コードが認定されています。 を後に置いたのは文字を設定する前では、漢字である非アスキー文字が 使えないという文法によるものです。この点は重要です。<meta>は、<head>内 のみで使われる、定義の設定で、HTTP（後述）に伝える要素です。 （誤りの例） <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"> <html lang="ja"> <head> <title>初心者のためのホームページ作り　 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 決まりごと・・MIMEタイプの設定 実は上記の言語設定でMINEの設定がありました。MIME（マイムと呼ぶ）とは、少 し難しいですが、Multipurpose Internet Mail Extensions の略で、インターネ ットの電子メールのプロトコル（通信手順）です。もともとインターネットの電 子メールでは半角の英数字しか送ることができなかったのですが、MIMEに対応し ている電子メールソフトを使うと、漢字などの２バイト文字が扱え、画像や音声 などのバイナリデータをやりとりできるわけです。これは Webページにも当ては まります。 　HTTP（ HyperText Transfer Protocol）は、情報の転送を依頼するリクエスト とそれに対するサーバのレスポンスから構成されています。URL やユーザー名と パスワード、Webブラウザの種類、使用言語などの情報をWebサーバ側に送信する と、Webサーバはそれに応じてデータやエラーコードなどを転送してきます。 　データのヘッダにはリクエストの可否、現在の時刻、サーバの種類などが記載 されており、これとHTMLなどの要求されたデータ本体が返答されてきます。 　また、MIMEの定義に基づいたデータの属性についても、返答が戻されます。Web ブラウザは、返信されてきたHTMLファイルを解析し、画像ファイル等があれば再 度送信を要求し、返信されてきた画像を読み込んで、表示することになります。 　リクエストには、ほかにもフォームなどに入力したデータを送信するPOSTや、 データの更新日時やサイズなどの情報を取得するHEADといったメソッドが用意さ れているのです。 　長くなりましたが、サーバーへの情報の引渡しにMIME設定が必要であることは 理解できたかな？これは少し初心者には難しいかもしれません。 　 このテキストはHTML文書で文字コードにShift_JisであるというMIME設定 このテキストスタイルは CSS文書であるというMIME設定 このテキストで書かれたスクリプトはJavaで書かれたスクリプトであるという設 定。 まとめ：何故上記のような各種の設定が必要なのでしょうか？ 私たちがインターネットに接続するということは、サーバーに接続するというこ とです。サーバーにはいろんな種類があって、UNIX、NT、Linux、FreeBSDなどが 使われています。それらのサーバーへの橋渡しとしてHTTPという手順が存在し、 そのHTTPに対して、私たちが設定した定義を送信するために、MIMEタイプにして 送り込んでいます。そうすることによって、様々なサーバーに接続し、インター ネットを閲覧しているわけなんですね。 　つまり、私たちが作ったＷｅｂページはこうしたサーバーに転送（ＦＴＰ）し て置くことにより、全世界の人々が閲覧できるわけです。難しかったかな？ 　ＦＴＰ（ファイル転送）については、講座で必ず取り上げます。 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ スタイルシートの言語設定 スタイルシートにも言語設定が要るのか、と言われると「う〜む」と唸ってしま います。実は、私の経験上HTMLでの言語設定で 「ISO-2022-JP」を使用し、かつ 外部スタイルシートファイルもこの言語で書いたところ、一部のブラウザでスタ イルシートが無視されてしまいました。そこで、外部スタイルシートをSHIFT_JIS で書いてみると見事に反映されたのです。以来、私は外部スタイルシート専用の エディタを用意し、SHIFT_JISで書き、かつ と設定しています。なぜかと言うと、HTML文書を書くエディタの言語設定を固定 して、ISO-2022-JP で使っているからです。少し前まではSHIFT−JISが使えなか ったために、ほとんど癖に近い感覚でこの文字コードセットを利用しています。 　これで書いたHTML文書やテキストは他のテキストエディタソフトでは文字化け してしまいます。 　厳密に言うと、MIME設定でスタイルシートの言語設定を行うことがベストです。 　もっと厳密に言えば、コンテンツのすべてに文字コードセットの設定が必要で あるということですが、ほとんど省略しているのが現状です。 　エディタによって初期設定（デフォルト）がどのような言語設定になっている のか、それぞれのソフトで確認してください。選べるものがあればベターです。 　結論として、HTML文書そのものを SHIFT_JISで書くならスタイルシートの言語 設定は必要でなく、そうでない場合は設定しておくと安全です。(経験上） ちなみに、Windowsの「メモ帳」、MachintoshのSimpleTextはどちらもShift_Jis です。私もスタイルシートだけはこのどちらも使っています。 　今週の講座は難解な言葉が多く、理解できたかどうか少々心配です。読者の中 には初めて出会う単語に、「えーっ、そんなこと必要なの？」と思われる方も居 るでしょうが、必要なんですよ。 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 前回までのHTML文書をそれぞれの決まり事に則って書いてみましょう。 （Strictの場合） 初心者のためのホームページ作り

初心者のためのホームページ作り

（Transitionalの場合） 初心者のためのホームページ作り

初心者のためのホームページ作り

というような文書になります。かなり本格的なHTML文書になりました。 　なお、講座では、StrictとTransitionalを併用して使うことにします。なるべ くならStrictがいいのですが、今後使用する要素（タグ）と属性がStrictで動く かどうかについての検証が難しい場合には、安全を期してTransitionalを使うよ うになります。 　要素と属性の関係などにあまり自信がない場合には、Transitionalを使ったほ うが安心です。かくいう私もどちらかというとあまり自信がないので、もっぱら Transitionalを中心にHTML文書を書いています。 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 今回はここまで、ではでは・・ 今週のおさらいはＷｅｂページにも掲載しましたので、是非見ておいてください。 Ｗｅｂページは画像が使えるので、より分かりやすく説明しています。 （今週のおさらい） http://www.scollabo.com/banban/magazine/ 次回は、実戦的にページを作成します。課題はテキストです。 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ ◆ホームページ作りのポイント ホームページを閲覧する際のブラウザによっては、表現できたり出来なかったり します。代表的なブラウザとして、マイクロソフトのインターネット・エクスプ ローラー（以下ＩＥ）とネットスケープ社のネットスケープ・コミニュケーター （以下ＮＳ）では、お互いに独自の機能があり、互換性がありません。 　制作者の意図に反して、ＩＥで表現できてもＮＳでは無視され、その逆もあり ます。これは、JavaScriptでも内容によって同様の現象があります。 　この講座では、どんなブラウザでも対応できるようにするため、基本的に独自 タグは使わないように心がけています。ま、困った状況ですわい。 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ ◆米Netscape Communications社は22日（現地時間）、老舗Webブラウザーやメー ルソフトを含むインターネット関連ソフト群の次世代バージョンNetscape　v7.0 Preview Release 1（PR 1）をリリースしました。 　現在、Windows 95/98/Me/NT 4.0/2000/XPに対応するWindows版については日本 語、英語、ドイツ語、フランス語の各言語版が、MacOS X版とPowerPC版、UNIX版 については英語版が入手可能で同社のWebサイトから無償でダウンロードできます。 なお、Windows版のインストールは、先にセットアップファイルだけをダウンロー ドし、セットアップを実行すると必要な構成ファイルが自動的にダウンロードさ れる仕組みになっています。おっつけ日本語版が出るハズです、多分。 □Netscape.com　　http://www.netscape.com/ ◆The Mozilla Organizationは23日（現地時間）、オープンソースで開発を進め ているWebブラウザー「Mozilla」v1.0 Release Candidate 3（RC 3）を公開しま した。今回公開されたRC 3は、計画では正式版公開前の最終的な候補版に位置づ けられるもので、RC 2を使用したユーザーから報告のあった 139種類の不具合の 修正が主な変更点としています。 □mozilla.org　　http://www.mozilla.org/ Netscapeがバージョンアップしたことはうれしいニュースですが、せっかく完成 したばかりのHTMLリファレンスにどんな変更が出るのかは今のところ不明です。 おそらく１年後ぐらいには色々と判明するでしょうからその時に改定するつもり です。また、時期的にMicrosoft社も最新版を出すでしょうね。 XHTML、XMLが中 心の時代が来たんだなぁという心境です。 ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 質問・ご意見ははこちらまで→　banban@scollabo.com なお、ご質問の際には、お使いのOS、通常使っているブラウザ、また他に持って いるブラウザ、使っているテキストエディタなど、なるべく分かりやすく制作環 境を明記していただけると回答しやすくなると思います。 誤字・脱字・変換ミスについてはご容赦ください。 発行者　ばんばん 協　力　スズキ・コラボレーション　http://www.scollabo.com/ 配信の変更や中止は下記メールマガジンの配信元で行えます。 配信エンジン　まぐまぐ　http://www.mag2.com/ （ID　0000090196） 　　　　　　　melma! http://www.melma.com/ （ID　m00063462） ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ ＜えでぃた〜ず・るーむ＞ サッカーのワールドカップが始まりますね。世の中Ｗ杯一色です。個人的にはサ ッカーはあまり興味がないのですが、やはり日本チームは気になります。 　Ｗ杯では、世界中のプロ中のプロが集まるわけですから、サッカーファンには たまらない魅力だと思います。オリンピックでは年齢制限があるので、そういう 意味でも今回のＷ杯サッカーは、きっと見ごたえがあるんでしょうね。 　でも勝った、負けただけで選手やチーム、国を評価しないようにして欲しいも のです。勝負は時の運というものもありますし、一概に技術レベルだけでは判断 できないものもあるでしょう。何たってアトランタ五輪で日本がブラジルをやっ つけたことだってあるんですしね。 　Ｗｅｂサイトでも、かなり間違った文法を書いているものの中にもキラリと光 る優れたページがあります。やっぱコンテンツなんですよねぇ。と、溜め息・・ ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ ◆著作権について 個人がご自分のＰＣに保存して利用する以外の記事の転載、引用は基本的に応じ ておりません。記事中のすべての内容についての著作権は放棄していません。 無断で使用することを固く禁じます。 　　Copyright(C) 2002 www.scollabo.com/banban/ ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■