infi.net の Background Colors RGB to Color Name Mapping
JavaScript による Background Colors
〇ホームページをつくるにあたって注意すべき点が書かれている「ネチケット」を見ておいて下さい。
(Netiquette;ネットワーク・エチケット)に関する各種の情報の提供
ネチケットホームページ
〇インターネットとパソコンに役立つ、ソフトと書籍の情報交換のページです。お気に入りを紹介してください。
さあ!たのしいホームページを作りましょう。
最初にここで作る「サンプル」を見てみることにします。 サンプル
※時間の節約のために!!
このファイルをHTML文書のまま、用意したディレクトリに保存または印刷
して下さい。
文章の中のダウンロードが設定されているファイルを、マウスの右クリックで
同じように、ダウンロードして下さい。接続を切って、ブラウザでこのファイル
を読み込み、メモ帳で SAMPLEファイル等を編集してください。
編集は1つのフォルダ(ディレクトリ)でする方が良いかもしれません。
a:\
┃
my-home = public_html
┃
┏━━┻━━┳━━━━┓
main gif cgi-bin
┃
sub
[1]はじめにWELCOME.HTMを作ることから始めます。
サンプルファイルを用意しています。これを取り出すところから始めましょう。
ではここをマウスの右ボタンでクリックして下さい。出てきたメニューから
「ファイルにして保存」、または、「ダウンロード」を選んで下さい。
ダウンロードの保存場所は、参照をクリックして、HOME にします。
うまくSAMPLE.TXTをダウンロードできましたか。
絶対に右クリックしてください。左クリックすると、カウンターが登録され迷惑をかけます。
次にいくつかの部品を同じ所にダウンロードして下さい。
書籍、インプレスの「ホームページ素材集」のものを使っています。
TITLE.GIF BACK.GIF KEISEN.GIF
MAIL.GIF KOUJI.GIF GUESTB.GIF
[2]次は編集です。
SAMPLE.TXTをメモ帳に読み込んで下さい。読み込んだファイルには、<−−と −−>の間に
説明文があります。
※の所に特に気をつけて書き直して下さい。
../はユニックスのディレクトリの表示です。A:¥ と似ています。
ホームページ用は全部、一カ所にまとめている人は、ファイル名だけにしてください。
※ ジャストネット上では、フォルダは1つだけなので、フォルダを指定してファイルを
ネットスケープで送信すると、ファイルの指定がうまくいきません。
画像などがでなくなります。
ジャストビューでは、フォルダの指定を全部とって、すべて大文字にして送っています。
ですから、フォルダーを1つにした方が、ファイル名が重なったときの対応が
しやすくなります。同じ名前で送ると以前のものを上書きしてしまいます。
※その他の場合、ファイルを指定するとき、指定するファイルから見て、ディレクトリー
を指定します。同じところならファイル名だけでできます。隣のディレクトリーなら
../tonaridr/ファィル名 下のディレクトリーなら ./shitadr/ファイル名 とします。
2つの違いは、
../ の方は自分の上のディレクトリーに行って tonaridr を指定します。
./ の方は自分のいるディレクトリーの下の shitadr を指定します。
my-home にある WELCOM.HTM から gif にある gazou_a.gif を呼ぶときは、./gif/gazou_a.gif
main にある ファイルから gif にある gazou_b.gif を呼ぶときは、../gif/gazou_b.gif
sab にある ファイルから gif にある gazou_c.gif を呼ぶときは、../../gif/gazou_c.gif
となります。
一番良いのは、自分のハードディスク内に public_html 以下を、サーバと同じ環境に
つくることです。送信もやりやすくなります。
[3]できましたら、説明箇所を削除して、「ファイル」・・「名前をつけて保存」・・を選びます。
半角の大文字で、index.html として同じ場所に保存してください。
*ご注意
なお、ジャストシステム以外の方は、小文字で index.html という名前にしてください。
そして、送信するときに、index.html となるように確認してください。
そして、FTP を使って public_html のディレクトリーの下に送信して下さい。
FTP で public_html の下にその他のディレクトリーをつくります。
ジャストシステム以外ではファイル名は、html文中でも、英数小文字で、指定してください。
ですから、SAMPLE.TXT などの中のディレクトリー名とファイル名は、書き換えてください。
もちろん html という拡張子は htm でも動作しますが・・・。
ジャストシステムから他のサーバーにコピーするときは、すべて書き換えなければなりません。
画像ファイルを GIF 形式でつくって下さい。そして、GIF のフォルダに保存して下さい。
部品集の中から、気に入ったものがあれば、また、右クリックでダウンロードできます。
2枚目、3枚目も HOME のフォルダに準備します。文章は HOME に、画像は GIF に保存します。
一度ジャストビューでindex.htmlをよみこんでみます。うまくはたらきましたか。
書き換えては再読み込みをして、確かめながらすすめていきます。
自分のパソコンで、思ったとおり画像やリンクしたファイルが読み込めたらだいじょうぶです。
気に入ったものに仕上がりましたら、いよいよ送信して登録です。
[4]「ホームページ」から「ホームページファクトリー」 に進みます。ホームページ
登録の左のアイコンを選択して、作った「index.html」ファイルを読み込み送信ボタンを押します。
必要な画像ファイルは、右側のアイコンから、追加を選びファイルを選択して送れます。
送られたファイルの一覧が表示されていますから、ちゃんと送られているか確認して下さい。
いろいろ書き換えて、試して下さい。そして、2ページ目、3ページ目と作り上げていきましょう。
当然ですが、ファイルの名前は、わかりやすく整理してつけた方がいいです。
最初にここで作る「サンプル」を見てみることにします。
カウンターについては、画像処理 カウンターのページにいくつかのサイトを紹介しています。
設定方法は、各サイトで異なります。主に無料で提供しているものをあげています。
このホームページで提供中のカウンターについて
サンプルをご御覧になって、使ってみようと思われる方は、メールポストでご連絡下さい。
設定の仕方の概略(日本語)をお送りします。
気に入ったものがありましたらご連絡下さい。
また同時に、WEB裏技のレスキュー方式と新レスキュー方式も行っています。
こちらの方は、記入して、すぐに使えるようになっています。
[5]ちょっとしたポイント
〇画像を多くいれると、読むのに時間がかかります。色数を減らすのも一つの対策です。
〇イラストなどは普通、GIF形式、写真は、JPEG形式にします。
〇画像は、Alt="△△△"の説明を入れて読み込む前にわかるようします。
特にリンクを張るとき注意です。ボタン類は、かえって邪魔になります。
また、width="200" height="100" と入れておくと、先にイメージの場所が確保
されて読み込みやすくなります。
〇バックに模様を入れる場合、文章が読みにくくならないように気をつけます。
〇背景色と文字色は、infi.net の Background Colors などで確認します。
このページの一番上に、JavaScript による Background Colors があります。
インターネットエクスプローラにあわせています。ネットスケープでは見難いかもしれませんが、
ボタンを押すだけで感じがつかめます。
〇飾りの罫線やボタンは、できるだけ同じものを使うと読み込む時間が少なくてすみます。
〇つまり、見ていただく人の立場に立って制作を進めていきます。ものづくりの基本ですよね。
〇タグは2つでセットになっている場合、対になっているのがすぐにわかるように配置します。
〇もう一つは、マネることです。ソースを見せていただいて、まとめ方を学びます。
〇たいせつなことを忘れていました。カタカナの半角はダメ、文字が化けてしまいます。
〇できあがったホームページは、リンク集・検索のページに行って登録しましょう・
やさしいホームページづくりU フレームタイプの作り方
上下に分割した サンプル2
左右に分割した サンプル3
※ 時間の節約のために!!
このファイルをHTML文書のまま、用意したディレクトリに保存または印刷
して下さい。
文章の中のダウンロードが設定されているファイルを、マウスの右クリックで
同じように、ダウンロードして下さい。接続を切って、ブラウザでこのファイル
を読み込み、メモ帳で SAMPLEファイル等を編集してください。
編集は1つのフォルダ(ディレクトリ)でする方が良いかもしれません。
※ ジャストネット上では、フォルダは1つだけなので、フォルダを指定してファイルを
ネットスケープで送信すると、ファイルの指定がうまくいきません。
画像がでなくなります。
ジャストビューでは、フォルダの指定を全部とって送っています。
ですから、フォルダーを1つにした方が、ファイル名が重なったときの対応が
しやすくなります。予防にもなります。
ジャストシステムから他のサーバーにコピーするときは、すべて書き換えなければなりません。
※その他の場合、ファイルを指定するとき、指定するファイルから見て、ディレクトリー
を指定します。同じところならファイル名だけでできます。隣のディレクトリーなら
../tonaridr/ファィル名 下のディレクトリーなら ./shitadr/ファイル名 とします。
2つの違いは、
../ の方は自分の上のディレクトリーに行って tonaridr を指定します。
./ の方は自分のいるディレクトリーの下の shitadr を指定します。
一番良いのは、自分のハードディスク内に public_html 以下を、サーバと同じ環境に
つくることです。送信もやりやすくなります。
[1]フレームタイプというのは画面を分割して表示する方法です。
ここで、出てくるタグはそれほどありません。いくつかを紹介します。
ここでの説明にはタグのカッコは省略していますので、そのつもりで見て下さい。。
FRANESETのタグについて
〇FRAMESET /FRAMESET この間にフレームを宣言します。対応していないブラウザは無視。
〇NOFRAMES /NOFRAMES フレームに対応していないブラウザで見える範囲の指定です。
フレームに対応しているブラウザは無視します。
FRAMESET /FRAMESET の間に入れます。
〇ROWS="*,150" これは、FRAMESET ROWS="*,150"と続けてかく命令で上下に分割します。
この場合、下に150ドッドの幅を確保します。上のフレームは残りに
なります。ご注意 * と 150 の間は、カンマです。
〇COLS="200,*" このは、FRAMESET COLS="200,*"と続けて各命令で左右に分割します。
この場合、左に200ドッドの幅を確保します。右のフレームは残りに
なります。ご注意 * と 150 の間は、カンマです。
〇FRAMEBORDER="yes no" フレームの境界を表示するときは YES です。IE3.0のみ
〇FRAMESPACING=5 フレーム間の余白をピクセルで指定。IE3.0のみ
FRAMEタグについて
〇FRAME ひとつひとつのフレームについて、最初に読み込むHTM文書の指定と
フレームの名前を決めます。
SRC="〇〇〇.HTM" が読み込むファイル、NAME="CONTENTS"がフレームの名前
を決定します。
(例)FRAME SRC="CONTEN-3.HTM" NAME="CONTENTS"
〇NORESIZE これは、FRAME文と同じところに書きます。フレームサイズを固定します。
指定がないと見る人は、自由に範囲を変化できますが、指定するとできません。
〇SCROLLING="NO" これも、FRAME文と同じところに書き、フレームでスクロールしない
ように設定します。
〇MARGINWIDTH="20" MARGINHEIGHT="20" これも、FRAME文と同じところに書き、
フレームの、左右、上下のマージンを指定します。
ターゲットの指定について
〇TARGET これは、リンクを指定するとき使います。
ファイルを読み込むとき、どのフレームに読み込むかを指定する命令です。
何も指定しなければ、アンカーのある同じフレームに表示されます。
TARGET="MAIN" だと、FRAME の命令で NAME="MAIN" とつけたフレームに表示されます。
TARGET="_top" フレーム表示を解除して、全体に表示されます。
TARGET="_blank" 新しくブラウザのウインドウが作られそこに表示されます。
TARGET="_self" ターゲットを指定しないときと同じになります。
TARGET="_parent" そのフレームのFRAMESETが指定されているウィンドウに表示されます。
[2]それでは、はじめましょう。
注意として、フレームタイプでないホームページをつくっておられた場合は、
SAMPLE2 SAMPLE3 のなかの、NOFRAMES /NOFRAMES の間に挿入しますので
消してしまわないようにして下さい。
(1)最初に、「上下に分割したい」か「左右に分割したい」を決めてください。
上下に分割したいときは、つぎの3つのファイルをダウンロードしてください。
SAMPLE2.TXT ここをマウスの右ボタンでクリック
CONTEN-2.TXT ここをマウスの右ボタンでクリック
MAIN-F.TXT ここをマウスの右ボタンでクリック
左右に分割したいときは、つぎの3つのファイルをダウンロードしてください。
SAMPLE3.TXT ここをマウスの右ボタンでクリック
CONTEN-3.TXT ここをマウスの右ボタンでクリック
MAIN-F.TXT ここをマウスの右ボタンでクリック
(2)ファイルのダウンロードができましたら、つぎのようにファイル名を変更します。
上下分割のとき
SAMPLE2.TXT は SAMPLE2.HTM
CONTEN-2.TXT は CONTEN-2.HTM
MAIN-F.TXT は MAIN-F.HTM
左右分割のとき
SAMPLE3.TXT は SAMPLE3.HTM
CONTEN-3.TXT は CONTEN-3.HTM
MAIN-F.TXT は MAIN-F.HTM
ジャストネット以外の方はすべてファイル名は小文字にします。
上下分割のとき
SAMPLE2.TXT は sample2.html
CONTEN-2.TXT は conten-2.html
MAIN-F.TXT は main-f.html
左右分割のとき
SAMPLE3.TXT は sample3.html
CONTEN-3.TXT は conten-3.html
MAIN-F.TXT は main-f.html
(3)もとになるファイルのダウンロードができましたら、それぞれをメモ帳に読み込みます。
メモ帳は、それぞれに立ち上げておいた方が、編集しやすくなります。
フレームタイプでない、index.html がありましたら BODY /BODY の間の内容を
SAMPLE2.HTM または、SAMPLE3.HTM のなかの NOFRAMES /NOFRAMES の間に挿入します
(4)つぎに、SAMPLE2.HTM または、SAMPLE3.HTM をエクスプローラ または、
ネットスケープに読み込みます。
この時点で画面は分割されて表示されます。画像ファイルがあるのに、
画像が表示されないときは、ファイル名の前に、../ を入れてください。
それぞれのファイルを編集してください。これは最初の SAMPLE.TXT と同じです。
(5)全体に思ったように働きましたら、
SAMPLE2.HTM を index.html に
SAMPLE3.HTM を index.html に
と、ファイル名を変更して下さい。ただし、どちらか1つにしてください。
*ご注意
なお、ジャストシステム以外の方は、小文字で index.html という名前にしてください。
そして、送信するときに、index.html になるよう確認してください。
そして、FTP を使って public_html のディレクトリーの下に送信して下さい。
FTP で public_html の下にその他のディレクトリーをつくります。
ジャストシステム以外ではファイル名は、html文中でも、英数小文字で、指定してください。
ですから、SAMPLE.TXT などの中のファイル名は、書き換えてください。
ファイル名は、拡張子も含めて、完全に一致させてください。
もちろん html という拡張子は htm でも動作しますが・・・。
(6)つぎに、ホームページファクトリーを呼び出します。
ホームページ作成を選び、ファイル読み込みでindex.htmlを読み込み送信します。
送られていないファイルがないか、確認します。
もしあれば、ホームページ選択送信を選び、追加、でファイルを選択して送信します。
ファイル名は、関連づけてつけてありますが、仕組みがわかりしだい変更して下さい。
(7)最後に、今送ったファイルが正しく動作するかを確かめるために、
ホームページインデックスから読み込んで確認して下さい。
(8)画面分割のパターンについて、
分割のパターンをいくつか例を作ってみました。参考にして下さい。
@上下に2分割
FRAMESET ROWS="*,150"
NOFRAMES
/NOFRAMES
FRAME SRC="UE.HTM" NAME="UE"
FRAME SRC="SHITA.HTM" NAME="SHITA"
/FRAMESET
A左右に分割
FRAMESET COLS="200,*"
NOFRAMES
/NOFRAMES
FRAME SRC="HIDARI.HTM" NAME="HIDARI"
FRAME SRC="MIGI.HTM" NAME="MIGI"
/FRAMESET
B上下2分割して、下を左右に分割
FRAMESET ROWS="*,150"
NOFRAMES
/NOFRAMES
FRAME SRC="UE.HTM" NAME="UE"
FRAMESET COLS="200,*"
FRAME SRC="SHITA-L.HTM" NAME="SHITA-L"
FRAME SRC="SHITA-R.HTM" NAME="SHITA-R"
/FRAMESET
/FRAMESET
C上下2分割して、上を左右に分割
FRAMESET ROWS="*,150"
NOFRAMES
/NOFRAMES
FRAMESET COLS="200,*"
FRAME SRC="UE-L.HTM" NAME="UE-L"
FRAME SRC="UE-R.HTM" NAME="UE-R"
/FRAMESET
FRAME SRC="SHITA.HTM" NAME="SHITA"
/FRAMESET
D上下2分割して、上下とも左右に分割
FRAMESET ROWS="*,150"
NOFRAMES
/NOFRAMES
FRAMESET COLS="200,*"
FRAME SRC="UE-L.HTM" NAME="UE-L"
FRAME SRC="UE-R.HTM" NAME="UE-R"
/FRAMESET
FRAMESET COLS="200,*"
FRAME SRC="SHITA-L.HTM" NAME="SHITA-L"
FRAME SRC="SHITA-R.HTM" NAME="SHITA-R"
/FRAMESET
/FRAMESET
E左右に分割、左を上下に分割
FRAMESET COLS="200,*"
NOFRAMES
/NOFRAMES
FRAMESET ROWS="*,150"
FRAME SRC="L-UE.HTM" NAME="L-UE"
FRAME SRC="L-SHITA.HTM" NAME="L-SHITA"
/FRAMESET
FRAME SRC="MIGI.HTM" NAME="MIGI"
/FRAMESET
他にもいろいろと面白いものが考えられると思います。
画像やファイルの読みがうまくいかないときは、
../ ./を前に入れてをみて下さい。../ は親ディレクトリー ./ 自分自身です。
〇できあがったホームページは、リンク集・検索のページに行って登録しましょう・
〇編集のテクニック
シフトキーを押しながら方向キーで範囲を指定
コントロールキーを押しながらCキーでコピー
コントロールキーを押しながらVキーで張り付け
コントロールキーを押しながらXキーで切り取り
うまく使うと編集が早くなります。試してみて下さい。
自分で罫線を作る方法
アイコンやボタンは、良いものがいっぱいあります。
フリーに使わせていただけるものを利用して、ページを飾っていきます。
また、自分でイメージエディタなどで、がんばってみてもおもしろいと思います。
その中で、罫線は、<HR>で出来ますが、自作も面白いですよ。
ここで使っている「KEITOMBO.GIF」は自作です。
作り方は、適当なHTMの文書中の何もない所に<HR WIDTH=75%>とかきます。
この文をJustVuewに読み込みます。 罫線が引かれていますので、全体をクリップします。
COPYキーを押して、クリップボードに取り込みます。そのままで、アクセサリの中のペイント
を起動して、張り付けを選びます。必要なところをクリップして、これをイメージエディタでサイズを
はかりながら貼り付けます。絵は、花子の部品を適当に縮小してクリップしてからイメージ
エディタで罫線と一緒にします。次にバックになる色を決めて全体を塗りつぶします。これが
透明にする色になります。ファイルを BMP 形式でとりあえず保存します。
次に、タスカ社のGIXを起動して、今のファイルを読み込み、透明化を選び、透明になる色を
バックの色に指定して、GIF 形式で保存して完成です。試してみてください。
自分でつくった罫線には愛着がありますね。オリジナルのアイデアでページを飾りましょう。
ところで、私は、まだトンボしか作っていません。ごめんなさい。
・・JAVAのアプレットをJustNet上にアップロードする方法・・
この方法は、ジャストネット会員の皆川直人氏から教わりました。ありがとうございました。
yukitaku@jsn.justnet.or.jp
シャストビュウでファイルを送信すると、名前は総て英数字の大文字になります。
従って、JAVAのファイル名も総て英数字の大文字になってしまい、その上に、拡張子class
は、CLA になってしまいます。
結論から申しますと、シャストビュウではできませんということです。ネットスケープが必要です。
もし、お持ちでなければ、右の「ネットスケープへようこそ」をクリックして下さい。
WIN95とWIN3.1用があります。JAVAはWIN95でしか動きません。
ネットスケープは、90日間無料です。大阪日本橋ニノミヤでソフトバンク製4990円でした。
間違わないようにダウンロード後、解凍してインストールします。
ネットスケープのメニューから、オプション、ネットワークの設定で、接続、プロキシサーバーの
設定をします。設定値は、シャストネットで公開されています。
※※※ 9月4日から、フルサービス開始にともない、プロキシサーバーの設定が、
※※※ 不必要になりましたので、設定が完了している場合は、そのまま送信できます。
上から3段とも http://www.justnet.or.jp/ 80
一番下に http://www.justnet.or.jp,jsn.justnet.or.jp 確認して下さい。
ネットスケープでインターネットにつなげるように、プロキシサーバーの設定をして、ジャストネットに
接続しヘルパーアプリケーションをダウンロードします。自己解凍ファイルを解凍後に、セットアップを
実行します。
次に、ネットスケープのオプション、ネットワークの設定で、プロキシサーバーへの接続を一旦解除
します。チェックを上の使わないに入れれば良いのです。
ここが、ポイントです。これをしないと .class ファイルが送れないのです。
この状態で、ジャストネットのホームぺージファクトリーへ進みポストをクリックします。
あとは、もう一度認証がありますが、長いファイル名も追加していけます。
このときアプレットのファイル名は、大文字、小文字をそのままにして送信して下さい。
送信されたファイル名を確認して下さい。ちゃんとなっていますか。
アプレットから呼び出すファイル名が、英数小文字でないと動かないことがありますよ。
最後に、手動でプロキシサーバーを設定のところのチェックを入れてもどしておいて下さい。
※※※ 9月4日から、フルサービス開始にともない、プロキシサーバーの設定が、
※※※ 不必要になりましたので、設定が完了している場合は、もどす必要はありません。
JAVAを、うまく取り入れるのもいいかもしれません。が、動画GIF同様に重たくなります。
ここで使用のアプレットは WEB CAFE のものを使っています。
NTT のデータペース → インターネット → JAVA から検索できます。
KENT100さんのページには、JAVAのアプレットがたくさん紹介されています。
KENT100さんのページ
その他の情報
JAVAの表示のスピードアップ(月刊アスキー 平成8年9月号 P283)
〇Netscape Navigater3.02でjavaのスピードを早くするツールが、アメリカ Astmetrix社に、
SuperCede VM というのがあるそうです。http://www.asymetrix.com/nettools/vm/
☆やってみましたが、うまくいきませんでした。
☆Netscape Navigater4.01日本語では、速くてなめらかです。
〇インターネットエクスプローラでは、表示 → オプション → 詳細設定 →
JAVA JITコンパイラの使用を、ON にします。
☆速くなりました。最初のページの子犬とアザラシの動きがなめらかです。
〇平成8年11月17日の、PC/Computing MVP AWARDSで、
ブラウザのMVPに Internet Explorer3.0が選ばれました。
〇月刊スーパーアスキー と 月刊インターネットアスキー 平成9年7,8月号 に
IE3.02日本語正式版 と NETSCAPE3.02期間限定版 などあり。
〇IEは現在 4.71 日本語がダウンロードサービス中です。 10月1日より
〇ネットスケープは現在 4.03日本語がダウンロードサービス中です。10月22日現在
WIN3.1用 3.0日本語がダウンロードサービス中です。3月26日現在
良いアイディアや情報がありましたらお知らせください。
osk-kino@js2.so-net.ne.jp
このページへのアクセス回数は
回目です。《カウンター10月10日設置》
尚、写真、アプレットの著作権の問題がありますので、ファイルの公開はしておりません。
ご了承ください。
ホームページにもどる