PC・タブレットなどでブラウザーの横幅が大体960px以上の時：リンクをクリックすると、画面左下に"タグ解説ページ"が"別窓で並行表示"されます
横幅が960px未満の時：リンクをクリックすると、"タグ解説ページ"が新規ウインドウで表示されます
"default layout"
"デフォルト・レイアウトのススメ"・・・何のことかさっぱりわからないでしょうが、つまり、"はじめてのHPをUPする時、'あのページ、コンテンツはいいんだけど、レイアウトがどうもねー'と言われないための(最小限の)レイアウト術"ということです。
まず、基本は、"見やすいページ"を作ることです。・・・それができてから、(その上で)インパクトを加えていって下さい。(海外の某HPで、"ネオンブルーの背景に真っ赤な字(!)"なんていうのがありましたが、間違ってもそんなページは作らないようにしましょう)
黒い背景に白い文字・・・センスのいい人が書くと、これほどキマる配色もありません。でも、そうでない人だと・・・
下手をすると、(特に日本語の場合)不気味な感じになったり、MS-DOSの初期画面("コマンドプロンプト"をフルスクリーンにしたような画面)みたいになってしまったりするので、モノトーン好みでも自信のない人は、うすい色(&"あまり自己主張しない柄")から始めた方が無難です。
(どういう色や柄にするかは、HPのコンテンツにもよります。
例えば、私は愛犬のページをUPしているわけですが、黒い毛なのに背景がモノトーンでは絶対に映えないので、"シック(?)なパステル調"にしています。・・・でも、"Coolest Moment"では、"趣味を優先"させてしまいました)
背景をカスタマイズするには、"<BODY BGCOLOR><BODY BGCOLOR>"で色を指定色を指定するか、"<BODY BACKGROUND><BODY BACKGROUND>"でイメージを"タイルのように貼り付ける"かですが、"<BODY BGCOLOR>"で"クールなレイアウト"のページを作るのは、"真にセンスのある"人でないと、はっきり言って難しいです(私も苦労してます)。
・・・ですから、はじめは"<BODY BACKGROUND>"でデザインする方がいいでしょう。
"<BODY BACKGROUND>"で使うイメージは、自分で描いてもいいし、フリー素材も出回っていますが(ダウンロードさせてくれるHPもありますし、グラフィックソフトや素材集のCD-ROMにも入っています)、自作は難しいし、気に入ったフリー素材もなかなか見つからない、ということもあります。・・・そんな時にオススメなのが、"グラフィックソフトでフリー素材をアレンジする方法"です(私も"Sashaのページ"でそうしてます)。
自作のイメージやフリー素材を縮小した場合、しばしば(ブラウザ)画面に継ぎ目が出てしまったりしますが、それだけで"ボツにしようか・・・"と悩む必要はないと思います(私自身、そういうイメージをたくさん使ってますし)。・・・大事なのは、ページを引き立たせるために、いかに背景を"使いこなす"かだと思います。
(背景が"うすい色 & 目立たない柄"と仮定して)
("クリック前のリンク文字色""クリック前のリンク文字色"・リンクボタンに用いているイメージ) 寒色系の背景→ブルー系(グリーン系背景の場合は一般的にはグリーン系)
暖色系の背景→ブラウン系
が無難です。
(一口にブルー系、ブラウン系といっても、いろいろな色調がありますが、実際にブラウズしてみて、背景と合っているか確認して下さい)。また、白にきわめて近い背景の場合は、好みの色でいいでしょう。
背景に溶け込むような色(具体的には、背景よりは濃く、"クリック前のリンク文字色"よりかなり"色あせた"ような色)にするとオシャレです。
(背景に近すぎる色にしてしまうと、見えにくくなってしまいますが・・・)
(Note: IE3ではローカルテスト(自分の作成したHPをUPする前にブラウザで確認すること)時に(ほとんどの場合)リンクボタンをクリックしても色が変わらないので、"<BODY LINK>"の部分だけ"<BODY VLINK>"に変更したHTMLファイルを別に作ってテストしてみて下さい)
タイトルロゴタイトルロゴは"デフォルト"、その他のイラストや写真その他のイラストや写真は、文章と文章の区切りの部分に"挟み込む"ようにして中央に表示中央に表示しておくと無難でしょう。
"<H*>～</H*><H*>～</H*>"("見出しタグ")を使うか、イメージを使うかのどちらかになるでしょうが、当然、イメージを使う方がきれいです。
一般的に？見に来てくれている人が許容できるデータ量は、(回線スピードによっても違いますが、遅い場合だと)一ページ当たり50K、上限は100Kくらいまで(ファイルサイズをぎりぎりまで落としたとして、普通の大きさの写真でせいぜい5、6枚ぐらいまででしょうか)だそうです。
(2003年5月現在、高速回線が普及してはいますが、ISDNやアナログ56kなどで接続している人もまだまだ多いですし、ADSLでもスピードの出ない人、一時的に高速回線で繋げれなくなることもあります。また、高速回線で接続していても、短時間で表示されるページの方がやはり好まれています)
・・・そこで、いろいろ工夫する必要があります。
ファイルサイズ自体を変える方法は "pictures" を見ていただくことにして、ここでは、それ以外のテクニックを書きたいと思います。
ファイルのサイズ(タテ何ピクセル、ヨコ何ピクセルという方)をあらかじめ書いておくと、ブラウザの方でイメージのスペースを空けて先にテキストをブラウズしてくれます。
(Note: カウンタをレンタルしている人も多いと思いますが、カウンタもイメージ(の一種)なので、必ずサイズを指定して下さい。
(特にカウンタの場合、レンタル先のサーバーダウンなどCGIが実行(CGIについての説明は省略しますが、ここでは、アクセス毎にカウンタが計測されること)されない時、カウンタ画像のサイズ指定がないと、最悪の場合、ページ自体が全くブラウズされなくなってしまうこともあります)
小画像の"見本"をクリックすると大画像が表示されるようにしておくと、見たい人以外は余計な(ブラウズ)時間を使わずにすみます。
(以前(回線がアナログ28.8k～56k主流の頃)、私は、"ギャラリー"でトータル400KBもの写真を張り込み、クレームをつけられてしまうという大失敗をしたことがあります。
・・・でも、言ってくれる人って、貴重だと思います。普通は、黙って見に来てくれなくなるだけなんですから)。
このオプションでイメージを保存しておくと、最初は荒く、だんだん鮮明になってくるようにブラウズされるので、見る人にとって必要ないイメージであれば途中で表示を中止することもできます。(NN, IE共バージョンによっては無効)
イメージファイルはいったんブラウズされると、ブラウザを閉じるまでは通常キャッシュされているので、HPの中の特定のページだけファイルサイズが大きい場合など、メニューページなどで先に表示(そのページの表示スピードがダウンしない程度に)させるようにしておくと、ブラウズのスピードがアップします。
(<IMG SRC="file name" WIDTH="1" HEIGHT="1">
としておくと、ほとんど目立ちません)
"how-to HTML files"中の"basic sample"にアレンジを加えたサンプルです。参考にして下さい。