制作者(webmaster)
野嵜健秀(Takehide Nozaki)
改訂
2002-04-05

「日刊K u R 0 N e K 0 N E W SのHTML講座」を斬る

「日刊K u R 0 N e K 0 N E W SのHTML講座」

例によつてソース拜見

http://members.tripod.co.jp/KuR0NeK0_NEWS/html/index.htmlのソース。

WYSIWYGHTMLエディタで書いたやうな、それでゐてテキストエディタで直打ちしたやうな、絶妙に謎のソースです。

はじめに

見出しは、こちらで勝手に(或は便宜上)附けました。

 ここでは初心者でもWEBで自分のHTMLページを公開できる程度の最低限の知識だけを学べるようにしてます。そのため一切の虚飾などは省き、本当に必要な骨の部分しか説明しません。それ以上のスキルはやっていくうちに自然と覚えていくでしょう。大体1時間もあればあなたのWEBサイトがインターネット上に現れるでしょう。驚くほど簡単ですので気軽にやってみましょう。 (^^)

もちろん、本当に必要な骨の部分を教へず、餘計なものばかり教へてゐるので、「トンデモ」扱ひする譯です。

■必要なもの

「ブラウザ」を舉げてゐないのは、この手の「入門」「講座」にしては全うで、正しい事です。

ここではタグの基本を覚えてもらいたいのでWEB作成ソフトは使いません。「FrontPage」などはクサレたソフトで作るくらいなら手書きでやったほうがましです。あんなものはHDの肥やしにもなりませんのですぐ消去しましょう。

絶妙に日本語の文章として變です。まあ、筆者はクサレたソフトであるFrontPageが憎くて怒りに理性を失つてゐたのだ、と、善意に解釋してあげませう。

餘談ですが、私もFrontpageは嫌ひです。しかし、ここまで言ふ事はないと思ひます。テキストエディタで出たら目なソースを打込むのも、Frontpageに出たら目なソースを吐かせるのも、似たやうなものです。後者の方が、時間の儉約になるので、まだ増しです。「講座」の作者は初心者に、テキストエディタでHTML文書を書かせたいのならば、WYSIWYGHTMLエディタが吐くソースよりも増しなソースを書くやうに教へなければいけません。

■WEBサイト制作の手順

  1. まず最初にHTMLページを手書きで制作。
  2. できたページをアップする前にブラウザで確認。
  3. 問題なければFTPソフトでサーバーにアップ。
  4. 最後にネットで自分の作った通りにできてるか確認。

先程「必要なもの」に「ブラウザ」を舉げてゐなかつたので褒めましたが、ここにブラウザで確認が出てきてしまひました。減點です。

ローカルでHTML文書のチェックをするには、文法チェッカを用ゐるのがベターです。Another HTML-lint以外にも、ローカルで動作する文法チェッカは幾つかあります。もつとも、その手の文法チェッカにクサレたソフトがあつたりするので、最終的には自分の目で確認した方が良いでせう。文書の推敲を他人任せにしてはいけません。

ネットで確認に關しても一言。やつぱりブラウザで確認なのでせうかねえ。絶妙に説明不足です。

まあ、私などブラウザで確認もしないでHTML文書をサーヴァに置いて、後でネットサーフィンするついでに見てみると表示が壞れてゐて焦る事がありますが。でも、その手の記述ミスに關する苦情がいつまで經つても來なかつたりするのは非道いよ。閑話休題。

■HTMLページ制作

それでは具体的なHTMLページの解説に入ります。まず下のテキストフィールドを見て下さい。

意味もなくtextareaにソースをぶち込む邊りがナイスです。

 必要なタグは「html」「head」「title」「body」だけです。

例の「お作法」に從つてゐるだけです。HTMLではtitleのみ明示しなければなりませんが、htmlもheadもbodyも開始タグと終了タグを記述する必要はありません。明示されてゐなくとも、html/head/bodyは全てのHTML文書に潛在的に存在します。

ではタグの解説を簡単にします。タグは必ず2つで1組みになってます。最初と最後の「html」を見てもらえばわかりますが、最初は「html」だけですが、最後は「/html」となっています。「/」はタグの終わりを示します。これがないとタグは成り立ちません。これがいわゆる「タグの閉じ忘れ」ってやつです。これをやるとブラウザでは見ることできなくなります。

絶妙に意味不明な解説です。「/」が「タグの終り」ださうです。>は何なのでせうか。「/」がないと「タグは成り立」たないさうです。<html>はタグではないのでせうか。

タグの閉じ忘れをやるとブラウザでは見ることできなくなるさうです。それは單にブラウザのエラー訂正機能に不具合があるだけだと思はれますが。tableの終了タグを記述し忘れると、Netscape Navigator 4.x以前では一切表示されません。しかしこれはNavigatorの實裝が間違つてゐるのです。

「html」はこれがHTML文書であることの定義です。

その文書がHTML文書であることを定義するのは、文書型(DOCTYPE)宣言です。html要素は、HTML文書の定義ではなく、HTML文書の中身を明示してゐるものです。

「head」 は文字通り、頭の部分つまり上部ってことです。

例によつてナイスな意味不明ぶりです。一般には「header」の略だとされてゐます。

「title」はページのタイトルを表記します。なくてもOKですが、ないとわかりにくいのでなるべく入れましょう。「title」は必ず「head」の中に入れましょう。 そうしないと上部にでません。ここの画面の外にも「HTML講座」ってでてますよね?それです。

大嘘

title要素は、HTML文書に於ていかなる場合にも省略出來ない、唯一の要素です。なくてもOKは間違ひです。信じてはいけません。

それにしても、ここの画面の外とは、無茶な言ひ方です。画面の外に表示されてゐたら、見えません。

「body」の中には本文を入れましょう。 ちなみに「br」は改行、「p」は1行あけて改行です。これは例外的に2つ一組じゃなくて単独でOKです。「/p」はいりません。

brはインライン要素で、ブロック要素内での強制改行。

pはブロック要素で「パラグラフ」を意味します。1行あけて改行なんて無意味なものではありません。

改行1行あけて改行を區別して別々のタグを用意する必然性は無い、と云ふ事にこの手の「講座」の筆者は、なぜ思ひ至らないのでせうか。頭を使つてゐないからです。

ちなみにHTML 4.01以前では、pの終了タグはp要素の終了が明かである所で省略可能であるに過ぎません。また、XHTMLでは、終了タグは全て省略禁止です。brにも終了タグが必要となります。

と云ふか、なんでこの筆者はいらない筈の「/p」を、自分でHTML文書を書く際に平氣で使ふのでせうか。「言行不一致」です。

それから筆者はサンプルで、body直下にインライン要素を記述してゐますが、HTML 4.01 Strictでは文法違反です。Transitionalでは「可」ですが。

では上記のテキストフィールドの文書を全部コピーしてメモ帳に張り付けましょう。

他の「入門」やら「講座」やらに比べれば、この筆者は親切です。もつとも、手入力させようが、コピーさせようが、間違つたものを教へてゐる事に違ひはありません。

それで拡張子を「.txt」から「.html」に変更してブラウザで確認しましょう。その後に、IEならブラウザの「表示」→「ソース」でメモ帳が開きますので、文章を適当に変えていろいろ試して下さい。変更したらちゃんと保存しましょう。

環境をWindowsだと決めつけるなら、最初に決めつけておいた方が良いでせう。Macintoshを使用してゐる閲覽者がこの文章を讀んで、決してとまどはないとは言へません。

基本的なことはこれでOKです。でもこれだとどこにも繋がらない一枚だけのページです。次はインターネットの醍醐味であるリンクについて説明します。下のテキストフィールドは見て下さい。

「下のテキストフィールド見て下さい。」の誤りだ、と指摘するのは揚げ足取りですか。それから、リンクはハイパーテキストの醍醐味ではないかと。せいぜい「ウェブの醍醐味」が良い所なのでは。

見ればわかるようにリンクには「a href="ファイル名 or URL"」 を入れます。

日本語として、絶妙に變であるやうな氣がします。

 画像などを表示させたいときは「img src="ファイル名 or URL"」です。

屬性「alt」の屬性値に代替テキストを記述する事は必須です。この事を明記してゐないので、この解説は「不可」です。

何事も最初はマネから入るのが一番上達すると思います。 では、がんばって下さい。

駄目なソースを眞似しても、駄目HTML書きが一人増えるだけです。どのやうなHTML文書が良いHTML文書なのかを説明しないで「眞似しろ」と言ふのは危險です。

■ファイルをアップする場所

自分のプロバイダに無料でホームページスペースを提供してる場合はいいのですが、そういうプロバイダはそんなに多くないと思います。

これでは、ユーザがISPにリソースを提供してゐる事になつてしまひます。話が逆です。

そういうときはフリーのホームページスペースを使用しましょう。有名なところとして「geocities(以下ジオ)」や「tripod(以下鳥)」などがあります。ちなみにここは鳥さんです。

tripod(讀み:/traipod/、カタカナで表記すると「トライポッド」)は「三脚」を意味します。日本人にしか通じない變な方言を作るのは止めませう。幾らアングラだからつたつて。

ジオはかなりめんどくさいのでやめたほうが良いです。おそらく世界でも屈指の取り難さでしょう。ジオで一個のアカウント取る間に鳥で20個は取れます。20個も取ってナニするんだよ?ってのは聞かないように。(笑)

そこまでGeoCitiesを非難する事はないやうに思ひますが。と言ふか、意味もなくアカウントを取り捲つて、日本人ユーザの評判を落すのはやめませう。

さて今度は今取ったばかりのアカウントにFTPソフトを使って接続しましょう。FTPソフトはベクターなどで適当にDLしましょうね。フリーでもシェアでもたいして変わりませんのでサーバーにアップできれば何でもOKです。NEXTFTPかFFFTPがお勧め。

アカウントには接續出來ません。今取ったばかりのアカウントFTPサーヴァに接續しませう、と書いた方が良いのではないですか。

それから、サーヴァからローカルにファイルを持つてくるのは「get」、ローカルからサーヴァにファイルを持つていくのは「put」と呼びたい所です。

アップした後は、そのURLに行ってリンク先や画像が表示されているかなどをきちんと確認しましょう。

URLに行く、と云ふ言ひ方で一般に通用するのですかねえ。

■最後に

 ここまで読んできた人はよほど変な間違いをしていない限り、ネット上に自分のページを持ててると思います。

間違ひをするのはだ、と決めつけるやうな言ひ方をするのは、どうかと思ひます。何でそんなに自分の解説に自信を持てるのでせうか。下手に「私の説明に從つたのに間違へるとは變だ」と言ふのは危險です。言ひたければ、責任を取りませう。

私なんか、しよつちゆう勘違ひ間違ひすれ違ひ((c)篠原美也子)をやらかします。

ここでは本当に最低限のことしか解説していませんが、おそらく多くの人が画像を使ったり、掲示板を付けたり、音楽を鳴らしたりしたいと思います。そういう技術は必要に迫られたときにポツポツ覚えていって下さい。

と云ふか、安易にそんな事をするな、と書いた方が良いと思ひます。個人的には、ウェブで音楽を鳴らさうとするのは止めて呉れ、と言ひたい。

「この講座に関する質問は一切受け付けません」

まあ、正しい態度ではあると思ひます。初心者の「どうすればいいんですか」「助けて下さい」攻撃は、殆ど「荒し」と紙一重ですから、忌避したくなるのは當然です。

ニュースと謎解きで充分多忙ですのでここでの質問受けてたらたぶん過労死しますから。(笑)質問は全て無視しますのでご勘弁を。

しかし、そんなに忙しいのならば、なぜこんな「講座」を作つてみたのでせうかねえ。謎です。

■お役立ちリンク

ZAP博士のホームページ作成講座へのリンクの行き先が、ZSPCになつてゐます。謎。

また、とほほのWWW入門(※http://tohoho.wakusei.ne.jp/www.htmに移轉)に、これだけでも充分ですね〜。と云ふコメントが附されてゐます。既に述べた通り、「とほほのWWW入門」は信用ならない「トンデモほーむぺーじ入門」サイトです。