10月 082011
 

細かい説明は抜きにして、まずは簡単なページを作ってみましょう!
うちのサイトのタイトルどおり、「コピー&ペースト」だけで作れます。

  1. エディタにHTMLを記述する
  2. 作業用フォルダに保存する
  3. ブラウザで作ったページを見てみる

エディタにHTMLを記述する

エディタ(メモ帳やTeraPad等)を起動して、以下の「背景が灰色」の部分をコピーしてテキストエディタに貼り付けましょう。

<?xml version=”1.0″ encoding=”Shift_JIS”?>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”ja”>
<head>
<title>サイトのタイトルを書く部分です。</title>
</head>
<body>
<p>
ここに書いた文字がブラウザで表示されるんですねぇ。
好きなところで改行させるには<br/>
って書けばOK。
</p>
</body>
</html>

これだけです。こんなに短くて大丈夫なのです。

作業用フォルダに保存する

次は、上で作ったファイルを保存しましょう。

ファイルを保存するには、メモ帳・TeraPadどちらを使っていても「ファイル→名前をつけて保存」を選びます。
保存場所を「C:\homepage」等、先ほど作った作業フォルダにします。
ファイル名ところにtest.htmlと入力し、ファイルの種類はすべてのファイルを選択します。
ファイル保存
最後に「保存」ボタンを押せば、ファイルの保存は完了です。

 

ブラウザで作ったページを見てみる

たった今作ったHTMLファイルをブラウザで表示してみましょう。

作業フォルダ(C:\homepage等)を開くと、test.htmlというファイル(作ったHTMLファイル)が出来ています。 それをダブルクリックすると、以下のようにページが表示されます。
ブラウザで表示

これで、ホームページが1つ完成です。 予想よりは簡単かと思います。
でも、さっきコピペしたサンプルはなにやらごちゃごちゃアルファベットが並んでたなぁと心配になる人もいるかもしれませんがご安心を。

実は、さっきのサンプルの<body>~</body>の中に表示したい文字を書けばOKなんです。

つまり、他の部分はほとんどコピペで使いまわせるということです。
簡単なページが出来たら、画像を表示させたいリンクを張りたい表を表示させたい背景色を変えたり壁紙を表示させたい文字の色や大きさを変えたい
こんな希望が出てくるかと思いますが、これも「うちのサイトに載っているサンプルをコピペして一部をちょっと書き換えるだけ」で簡単に出来ます。
その辺は、コピペ用サンプルページに具体例(サンプル)と詳しい説明がありますのでそちらをご覧ください。

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>