DOCTYPEってなんですか?

HTML の先頭にはたいてい <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"> のようなおまじないが書かれています。 これはブラウザや巡回ツールに、ここのページの仕様を伝えるためのものです。

Doctype のなかで実際にページをつくるときの留意点だけメモにしましょう。

<! DOCTYPE HTML PUBLIC "-//W3C//DTD
ここまでは皆おなじです。このあとに続く HTML の仕様には次のようなものがあります(一例です)

HTML 3.2 フォントやテーブルに対応。フレームには未対応
HTML 4.0 スタイルシートに対応

最近のウェブでしたら、ほとんど HTML 4.0 です。
HTML 4.0 にはまたさらにいくつかの種類があります(他のものにも派生版がありますが割愛)。
定義 備考
HTML 4.0 Strict  HTML 4.0 仕様に厳密に準拠したもの。FONT など過去の 主要HTMLタグが使用できません。
HTML 4.0 Transitional  スタイルシートなど最新の HTML を含む文書
HTML 4.0 Frameset  フレーム定義を記述した HTML 文書

つまり、普通にフォントやフレーム、スタイルシートを使ったウェブをつくるなら HTML 4.0 Transitional を指定すればよいわけです。


で、結論ですが HTML を新しく書くならば、一般文書の DOCTYPE 部は

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
とし、フレーム割りを記述した html は
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Frameset//EN">

とするのがよいでしょう。現状ではブラウザ互換問題もあって Strict は使わないほうがいいですね。 もっともこれらはまったく指定しなくても差し支えないようです。中途半端に指定するなら、むしろなにも書かないほうがいいかも。


Top
文字化けを防ぐには?

ページを開いたら文字化けしていた..という経験はありませんか?
これを防ぐには<HEAD>の中に次のようなタグを入れておきます

<HEAD>
<META http-equiv="Content-Type" content="text/html;CHARSET=x-sjis">
</HEAD>

これは『文字セット=日本語・シフトJIS』という指定になります
日本語の文字コードセットには JIS・Shift-JIS・EUC という3つの体系があり、Windows などの一般パソコンでは シフトJIS が使われています。

それぞれの体系に合った文字コードセットの指定一覧です

漢字コード 指定
JIS  iso-2022-jp
シフトJIS  x-sjis または Shift_JIS
EUC  x-euc-jp または EUC-JP

表記は SHIFT_JIS でも Shift_JIS でも、shift_jis でも可です。SHIFT_JIS はアンダーバー[_]ですが、EUC-JP はハイフン[-]なので注意しましょう。

※先頭に x- のつくコード指定は、ネットスケープの古いバージョンなどに対応した指定です。普通のパソコン+最新ブラウザなどは Shift_JIS 指定でいいのですが、これだとネットスケープ ver 2 では文字化けします。逆に x-sjis としてあれば新ブラウザでも旧ネットスケープでも文字化けしません(ie3 はなにをやってもダメ)。したがって(厳密には規定された表記ではありませんが)幅広いユーザーに読んでもらうならば x-sjis と指定します。

ここらへんはウェブ作者の考え方ひとつです。形式を重視するか利便性を重視するか..牛飼いウェブは x-sjis で作っていますが、x-sjis は公式なものではないので、(極めて可能性が低いですが)将来使えなくなっても私は関知しませんのであしからず(^^;

Top

検索エンジンにキーワードをセットするには?

世の中には Yahoo! のように専門のスタッフが登録する検索サイトもあれば、goo のようにプログラムで自動的にウェブの内容を集めて登録するものもあります。この自動収集プログラム(ロボットと呼ばれます)にこちらの思うキーワードを与えてやれば、誰かがサーチエンジンで検索をかけたときに適切なカテゴリでヒットしてもらえる可能性が高くなります。

キーワードの指定方法
<META name="keywords" content="牛飼い,アイコン,素材,背景,icon">

ホームページの説明の指定方法
<META name="description" content="自作のアイコン・背景集を取り揃えています">

<HEAD>〜<HEAD> の間に上のタグを入れます。キーワードはカンマで区切ります。

※検索によるアクセスを稼ぐためか、たまに内容とまったく関係ないキーワードを多数セットしているウェブも見かけます。そういうのは第三者からみると非常にみっともないので、やらないほうがいいでしょう。

Top

自動検索エンジンに登録されたくないときは?

検索エンジンの自動収集プログラム(ロボットと呼ばれます)にページを覗かれたくないときは次のようにします。

robots.txt
ドメインのオーナー等でドキュメント・ルート(http://www.ushikai.com などの最上階)にアクセスできるときには、そこに robots.txt という名前のテキストファイルを置き、次のように書きます。

------ この下から -------
User-Agent: *
Disallow: /data/
Disallow: /docs/sample.htm

------ この上まで -------
一行目には対象となるロボットを指定します。 例では全てが対象です。
上の例では http://www.ushikai.com/data/ 以下のディレクトリと
http://www.ushikai.com/docs/sample.htm の ページを情報収集対象から外す設定です。

とにかく全部止めたいときは Disallow: / とします。このように検索から外したいディレクトリやページを書いてゆきますが、書き終わった最後の行は 空白行とします。こうしないと誤動作するものもあるようです。


META タグによる設定
この方法は普通の html ページ単位でセットできます。
ページの<HEAD>〜</HEAD> の間に次のタグを入れます。

<META NAME="ROBOTS" CONTENT="NOINDEX">このページを登録対象から除外
<META NAME="ROBOTS" CONTENT="NOFOLLOW">このページのリンクを辿らない
<META NAME="ROBOTS" CONTENT="INDEX">このページを登録対象にする
<META NAME="ROBOTS" CONTENT="FOLLOW">このページのリンクを辿る

<META name="ROBOTS" content="NOINDEX, NOFOLLOW"> とやると全部シャットオフです。


たとえば トップページに keywords や description (検索エンジンにキーワードをセットするには?を参照)をセットしておき、ここだけを収集させたい場合、 http://www.ushikai.com/index.htm のなかに次のように書きます。

<META name="ROBOTS" content="INDEX, NOFOLLOW">

参考リンク(英語・別窓)→http://info.webcrawler.com/mak/projects/robots/meta-user.html


※ただし設定を無視するロボットもいます。ウェブ巡回ソフトなども設定を尊重するものもあれば、無視するものもあります。完全なものではないということです。


Top

自動的に指定ページに飛ばすには?

ホームページを引越ししたときなど、自動的に指定ページに飛ばしたいことがあります。

<META HTTP-EQUIV="Refresh" CONTENT="1;URL=http://www.ushikai.com/">

上のタグを <HEAD> 〜 </HEAD> の間に入れます。
CONTENT= のあとの数字が「何秒後に移動させるか」の指定です。 URL= に移動先のアドレスを入れます。

万一自動で飛ばない場合を考え、普通のリンクも入れておくと親切です。


Top

ページの余白を調整するには?

BODY タグで次のように指定します
画面の左右の余白 LEFTMARGIN=(ピクセル) MARGINWIDTH=(ピクセル)
画面の上下の余白 TOPMARGIN=(ピクセル) MARGINHEIGHT=(ピクセル)

なにも指定しないと普通はページの上下左右に余白が取られます。テーブルを使いイメージを上下左右の枠ぴったりに出したいときや、文字をぎりぎりに出すときなどに使用します。前がie、後ろがnsでの指定ですので、普通は両方同時に指定します。

いずれもバージョン4以降で有効です。

<BODY bgcolor=white background="images/kujira3.gif" TOPMARGIN=0 MARGINHEIGHT=0>
このサンプルを見る→クリックしてください

Top

ページに音楽をつけるには?


MIDI 音楽を鳴らす例です。
<EMBED src="abc.mid" AUTOSTART="TRUE" LOOP="TRUE" HIDDEN="FALSE">

AUTOSTART を TRUE にすると自動演奏します。
LOOP を TRUE にすると繰り返し演奏します。
HIDDEN を TRUE にすると制御パネルを出しません

MIDI の再生にはプラグインが必要になります。

プラグインは YAMAHA MIDPLUG for XG などで入手できます。
http://www.yamaha.co.jp/xg/download/midplug/index.html

YAMAHA のページではホームページに音楽をつける方法も詳しく解説されています。
http://www.yamaha.co.jp/xg/download/midplug/04_01.html







Top

読めない文字、アクセスできないフォルダ


インターネットをうろついていると、たまに半角スペースの入ったファイル名やディレクトリ(フォルダ)名を使ったウェブに遭遇することがあります。

こうしたウェブはieでは問題なく表示できますが、ネットスケープでは読めません

おそらくieで動作確認しているものと思いますが、半角スペースの入る名前はつけないほうがよいでしょう。全角日本語のファイル名なども、できれば避けたいものです。

ついでにいうと、ページの文章には『半角のカナ文字』は使えませんし(見れない人がいるから)、  のような文字も、実は「機種依存文字」といって一部のパソコンでしか表示できない文字なのです。けっこう制約が多いですよね。

また、サーバーの中には大文字と小文字を厳格に区別するところもあります(というか、大半がそう?)。たとえばファイル名は小文字に統一するなどして、のちのち管理しやすいようにしておくのがベターです。

ある程度長くウェブを公開していると、いろいろな都合でプロバイダを変えることはよくあります。そんなときにあわてないためにも、どんなサーバーに置いても読めるような、なるべく問題のでない作り方をしておくのがおすすめです。

Top
裏側のぞき防止!

URL の最後に html ファイルを指定しないと、index.html (または index.htm)を指定したことになります。

http://www.ushikai.com/
は、
http://www.ushikai.com/index.html
を指定したことと同じ扱いになります

たとえば poko というディレクトリを作って sample.htm というファイルを置き、
http://www.ushikai.com/poko/sample.html
という URL を書いたとします。これ自体は正しい文法です。

これを見たある人が、ブラウザのURL窓に
http://www.ushikai.com/poko/と打ち込むとどうなるでしょうか。

poko のディレクトリの中身が一覧で表示されてしまうのです。
(サーバーの設定により見られないようになっているところもあります)
中には見せたくないファイル、ダウンロードされたくない情報があるかもしれませんね。

これを防ぐには以下のファイルをつくり、index.htm の名前でこのディレクトリに入れておきます

================ ここから ================
<HTML>
<HEAD>
<META HTTP-EQUIV="Refresh" CONTENT="1;URL=http://www.ushikai.com/">
</HEAD>
<BODY bgcolor=white>
<BR>
飛びます、飛びます...<BR>
<BR>
</BODY>
</HTML>
================ ここまで ================

CONTENT=以下の指定により、1秒後にURL= で指定されたアドレスに自動的に飛びます。
赤字の部分のアドレスを自分のトップページに変えて使って下さい

こうしておけばディレクトリの中身を見ようとしても、自動的にトップページに飛ぶわけです。


Top

アクセスを制限するには?

サーバー単位で制限する
本来はすべてにオープンが理想なのですが、運営上どうしても特定のサイトをシャットアウトしたい場合がでてきます。 .htaccess の設置を許可しているサーバーでは、次のようにすることで特定のサーバーからのアクセスを制限できます。

.htaccess に次のような記述を加え、FTP ソフトで ascii モードで転送すれば完了です。

<Limit GET POST>
order allow, deny ←この順番を間違えないように
allow from all ←まずすべてのサーバーからのアクセスを許可
deny from 100.200.300.← IP アドレスが 100.200.300. を含むサーバーからのアクセスを拒否
deny from .abcd.com ← www.abcd.com など、.abcd.com サーバーからのアクセスを拒否
</Limit>←最後は改行してください

これで規制できるのはサーバー単位です。 たとえば abc.com に契約している ushikai をカットしようとして .abc.com/~ushikai などとしても無効です。 また IP アドレスをフルに指定したときに、それがダイヤルアップ接続ユーザーからのアクセスなら接続のたびに IP が変わるので無意味です。

.htaccess はそれが置かれているディレクトリと、その下層のすべてに有効になります。 ですので特定のディレクトリだけ制限するならそこに置けばよく、ドキュメントルート以下全部を制限するなら一番上の階層にひとつ置けばOKです。 さらに詳しい情報は検索エンジンで [ .htaccess ] をキーワードに探してみてください。


ページ単位で制限する
単純な参照制限なら .htaccess 設定やパスワードCGI を利用すればよいのでここでは省略します。
知りたい方はサーチエンジンや CGI 提供サイトを参照ください。
たとえば CGI ならば、『にほんごCGIインデックス』(http://script.lovely.to/) の一覧から
CGIスクリプト → Perl とたどるといろいろリンクされています。

ページへの直接リンクをカットする CGI は意外に少ないのでいくつか紹介します。


CGI ROOM
http://cgiroom.nu/top.htm
ダウンロード→CGI機能拡張 ページで CGI への直接リンク防止スクリプトKEEP OUT を配布。 ほかにもパスワードでのアクセス制限などあり。
ウェブ裏技
http://www.rescue.ne.jp/
アクセス制御 ページで直接リンクを防止する reflimit.cgi を配布。




■お手軽にパスワードをつける方法
JavaScript を使って簡易的なパスワードをつけるには次のようにします。
ただしこの方法は直接リンクなどで所在が判明するとアクセスされます。

まず、一般公開しないページに適当な名前をつけます。たとえば c56kls_bz.htm など(←いま適当にタイプしたもの)。 なるべくわかりにくい名前がよいでしょう。このページへはどこからもリンクを貼りません。リンクを貼らないので一般の人にはページの存在を隠すことができます。

次にこのページを呼ぶスクリプトを書きます。
※パスワード欄に c56kls_bz と入れてOKを押してみてください。

パスワードを入れてください  

<FORM name="pform">
パスワードを入れてください <INPUT TYPE=password name="passtxt" SIZE=20> 
<INPUT TYPE=button value=" OK " onClick="if (document.pform.passtxt.value !='') {location.href=document.pform.passtxt.value + '.htm' } else { alert('パスワードを入れてください') }">
</FORM>


動作のしくみ
パスワード欄に入れた文字+ .htm でページを呼び出すだけです。
つまりページの名前を秘密にしておけば、それを知らない人は見ることができません。

トップページで開きたいときは location.href= の部分を top.location.href= とします。
+ '.htm' を + '.html' などのように自分の環境に合わせ加工してください。


Top

数字を出さずにカウントするには?

いろいろな事情で、カウンタを表示しないでカウントしたい。こういうときには、

  1. 画像タイプのカウンタなら 画像タグで width=1 height=1 を指定し最小にすれば見えなくなります。
  2. フレームを使ったページなら、サイズゼロのフレームにカウンタを置くことで見えなくなります
    (ただし「ソース表示」でフレームのソースを出せば、見る人が見ればわかります)
  3. カウントだけの CGI が無料で配布されているので、それを使います。下はごく一例です。

KENT WEB
http://www.kent-web.com/
カウンタ ページで多機能な Lime Counterを配布。
n +
http://www.imaginet.ne.jp/~nobu/
cgi-lab ページで隠しカウンタ/ダウンロード数カウンタなど配布。

…とまあ、いろいろな方法があります。
せっかく設置するならアクセスログの解析ができるタイプがいいですよ。いろいろ参考になります。




Top

アクセス・ヒットってなんのこと?


ウェブを運営するときに、どのくらいの人が利用してくれるかは気になるところです。
その利用度を計る指標として「アクセス数」とか「ヒット数」という言葉が使われます。

アクセス数
アクセス数とは一定時間内の重複アクセスを除いたページ訪問回数(たいていトップページの訪問数)です。
一度トップページにアクセスし、すぐ再読込みをかけてもアクセスは1回だけとみなされます。
カウンタを設置するときやログを採るときはリロードでのカウントアップ防止つき CGI などを使い、
なるべく正確な資料を収集するようにします。でないと自分の参考資料になりません。

ヒット数
ヒット数とはページに置いてある画像や html ファイル一つ一つの部品が読み出された回数の合計です。

つまりトップページにメニュー画像が10個おいてあると、このページに1名訪れるごとに
アクセス数は+1、ヒット数では トップの html + 画像10点=11ヒット になります。

ですから あるウェブに『当トップページは一日1000ヒットあります!』と書いてあったとして、
そこに画像を9個使ってあれば html とあわせ一回につき10ヒット、つまり一日100アクセスほどの
ページということになります。これにはリロード分も含むので、正直言って「ヒット数」で語られても
あまり目安にはなりません。



Top

アクセス数を上げるには?


牛飼いウェブの開設当初 97年4月1日のアクセス数は67でした。いまはおかげさまで 4,500〜5,000アクセス/日 とだいぶ上がっていますが、アクセスの非常に少なかった開設当初になにをやったかというと、ただひとつ。 内容の充実です。

サーチエンジンへの登録はウェブの体裁がある程度整ってきた頃に Yahoo! にだけやりました。
それ以外のいわゆる勧誘作戦はやらず、ページコンテンツの充実に注力しました。
アクセスアップのためというよりも自分で楽しんでウェブをつくっていったわけです。

考えてみればウェブのアクセス数は、訪問してくれる人がいてはじめてアップするのです。 つまりアクセス数を上げるには訪問する人が増えてくれればよいのですが、この訪問数を増やすという 部分へのアプローチはさまざまです。

たとえば訪問者を増やす=より多く宣伝し呼び込めばよいという考えもあります。
つまり多大な努力でもって他所の掲示板に宣伝書き込みをしたり、サーチエンジンに登録したり、 あるいはページの検索キーワードを工夫したり…ひとつでも多く自分のページのURLを宣伝また宣伝 …まさに頭の下がる思いです。

一方、もうひとつの考え方もあります。
こちらは逆に訪問する人の立場から見たもので『訪問するだけのメリットのあるウェブであれば、 ゆっくりと自然にアクセスは上がる』という考え方です。

自分がまず楽しんで充実させて、その結果よいものができるとそれに伴って人が集まるといった感じでしょうか。 訪問した人が満足やシンパシーを感じてくれれば自発的リンクは自然に増えてゆきます。その結果アクセス数があがるのです。

そんなのは言うのは簡単だ、という声が聞こえそうですが、その通りです。だから一朝一夕にはできないから 地道にこつこつ作るのです。適当に楽しみながらマイペースで時間をかけてつくるのです。 足掛け3年になりますが、正直いって現在のウェブにはまだ至らない点が多数あります。

どちらがいいのか、これは答えが出ません。あくまで運営スタイルの違いであって、こちらがいい、と決められるような事柄ではないでしょう。

個人のウェブでは余暇のうちのごく限られた時間しか運営にまわせません。これはどこのウェブも同様です。 ならばその限られた時間をどう使うか。仮に1時間あったらそれを宣伝に使うか、それともウェブの内容を 充実させることに使うか、このあたりの考え方で二分化するのではないかと思います。

なるべく見やすく、使いやすく、そしてオープンに。
そして毎日いただく『ありがとう』のメールがやる気の元。
こんなやりかたがあってもいいんじゃないかな。と、そんな軽い気持ちで気長にやっています。
なんといったって仕事じゃなくて余暇の趣味のひとつなんですから。


サーチエンジンとアクセスの関係 (2000/07/05)
アクセスをあげるにはそこらじゅうのサーチエンジンに登録するというのが定説なんですが、これは実際どうでしょうか。

2000年7月のある日、各主要カテゴリのトップ部分へのアクセスは累計 9,956件ありました。サーバー単位でのアクセス数ではやはり大手サーチエンジンが上位を占めます。ところが、全体のボリュームとしてはさほど大きくはないのです。

リンク元の集計(2000年7月某日)
ブックマークから直接 6,752
http://search.yahoo.co.jp/ 153
http://www.infoseek.co.jp/ 115
http://www.goo.ne.jp/ 109
http://search.msn.co.jp/ 18
http://www.lycos.co.jp/ 12
上記以外からのリンクによる2,797
合計9,956

個人のウェブからのアクセスは平均一日1〜2回が一番多いので、アクセス回数順での集計では上位にはきません。ところが実際はご覧のようにリンクやブックマークからの来訪数のほうが圧倒的に多く、サーチエンジンからのアクセスは非常に小さな割合にしかなりません。

やはりリンクは有効ということなのですが、しかしリンクの数を稼げばいいというわけではなく、そこから繰り返し訪問していただける「生きたリンク」でないと実際のアクセスには結びつきません。結局のところ内容の充実が大事ということです。


Yahoo! のサングラスマークの話し (2000/07/05)
牛飼いウェブは以前サングラスマークをいただいておりまして、「このマークなんなんだろうなあ...」と、当時その意味をまったく知らずに不思議がってました。その後ようやくスタッフのおすすめサイトということだとわかり、それなりにうれしくは思ったのです。ところが知らない間にこのマークが消えておりました。

その時期が GATEWAY FAQ を外部に全面委譲したときとほぼ一致するんですよ。なので、このサイトは素材じゃなく GATEWAY パソコンの情報で評価されてたのか…とちょっと意外な気もしたものです。FAQ が無くなって登録との内容相違で消されたのかな?素材とパソコン両方に登録してましたから。 まあそれはともかく。

それでサングラスマークの有無ですが、これははっきりいってアクセス数にはまったく影響ありませんでした。Yahoo! の素材カテゴリは新着の登録がほとんど無いので、鮮度が落ちて利用度が下がっているためかもしれません。

ところで FAQ が無くなったときに Yahoo! の登録内容を変更してもらおうと、過去に2度ほど修正依頼を出したものの全然変えてもらえません。。パソコンのウェブではないのにパソコンのカテゴリに登録されたままです。うーむ。どうしようかなあ。


Top



copyright(C) 1999 Y.Kishino all rights reserved
Ushikai and Icons Room