10秒で書けるあなたのページ
1.index.htmのリンク文字を、右クリック→[対象をファイルに保存]。
2.自分のPC画面に現れた新しいアイコン「index.htm」(「index」かも)を、右クリック→プログラムから開く→Notepad→メモ帳が開く。
3.タイトルのところに、あなたのサイト名を入力する。
4.本文のところに、あなたのハンドルと、「の、ページです」を入力する。
5.「index.htm」という名前で保存する。
6.アイコンをダブルクリック。メモ帳で作ったのに、IEで開き、あなたの名前が表示されているはず。これであなたの「最初のページ」はとりあえずできた。
自分のサイト、と呼ぶには、まだ、WEBサーバーにアップするという簡単な操作が一つ残っているが。嘘は言っていない。
この10秒間で、あなたは以下のことを学んだ(かもしれない)。
1.HTMLページを右クリック→[ソースの表示]で、使われているHTMLやCSSが見える。(charset=shift_jisの場合には)
(なお、このファイルは、EUCコード限定の《ジオシティーズ》には適さない)
2.ファイルの最初には、DOCTYPEとかHTMLとかheadとかmetaとかが必要だが、それはコピーして使いまわせる。
3.CSSはファイルのあの位置にまとめて書けばよい。
私・阿檀は、DOCTYPE宣言が無い、なんていうのは日常茶飯時、bodyタグもない、「基礎工事が済んでいないような」HTMLファイルをたくさん見てきた。あなたは、この10秒間の冗談に付き合わされたかわり、あの方達よりは有利なスタート地点に立っている。
あとはこの「基礎工事だけが終わった」ファイルを、ちょっとずつアナタ好みに書き換えていくだけ……。がんばれミ^。^彡っヾ。
▼以下の例の、HTML/CSSは自由に流用してください。画像はいちおう自作ですが、画像素材サイト様でもっとステキな画像がたくさん配布されているので、ご自分で探して、規約をきちんと読んで使うようにしてください。
(a)基本パターン
↓
(b)body部分に背景画像を加える。
↓body{(略)background:url([画像URL]);}
メイン部分両側にラインを引く
↓#main{(略)border-left:[色コード] 1px solid;border-right:[色コード] 1px solid;}
(c)「body背景+メイン部分背景」
・#main{(略)background:url([画像URL]);}
(d)トップにロゴ画像を置く。
・HTMLに画像タグ追加(<img src="[画像URL]">)
(e)画面左右端に背景を置く。
・divを1つ増やして、背景を重ねる。
(f)透過pngを使う(サムネイル未作成)
以下、サイト主阿檀の備忘をかねております。
真面目に勉強したい方は、
⇒http://10prs.com/
⇒http://www6.plala.or.jp/go_west/beginner/
⇒http://www.shoshinsha.com/hp/
HTML/CSSについて調べるときは、
⇒http://www.htmq.com/
⇒http://www.tagindex.com/
⇒http://www.tohoho-web.com/www.htm
世界の標準を極めたい!という方は、
⇒http://www.w3.org/
画像関係
⇒http://www16.plala.or.jp/kiitoksia/
クロスブラウザスクリプトなど
⇒http://amenti.usamimi.info/