おためしページを作る。

おためしページ

まずは試しに、ホームページを作ってみましょう。
以下に、ページの骨格となる「ソースコード」というものを、はり付けます。

(ホームページのソースコード) ※食べるソースじゃないよ。
↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
  <title>おためしページ</title>
</head>

<body bgcolor="#fffacd">
  <h1>おためしページ</h1>

  <table border="1" cellspacing="1" width="300" height="240">
    <tr align="center">
      <td bgcolor="#f0f0f0" align="center">ここに<br>絵や写真を入れる。</td>
    </tr>
  </table>

  <p>
    <font color="green" size="4">ホームページ作りました。<br>
    よろしくお願いします。</font>
  </p>
  <br>
  <ul type="disc">
    <li>はじめに</li>
    <li>自己紹介</li>
    <li>友だちへのリンク集</li>
  </ul>

</body>

</html>

↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
(ソースコード終わり)

上に書かれている<!DOCTYPE HTML PUBLICから始まり</html>で終わる、やたらごちゃごちゃとした文章がホームページの設計図になります。
まずは、これをそのまんまコピーして、「メモ帳」にはり付けてみましょう。

作ってみる

青色の英字を図のように上から下まで、マウスを左クリックしながらドラッグします。
次に、マウスを右クリックして「コピー」をクリックしましょう。

文章をコピーしたら、「メモ帳」というソフトを開いて、内容をはり付けます。

メモ帳を開く

パソコンのデスクトップ上(さいしょの画面)で右クリックをして、「新規作成」→「テキスト ドキュメント」と選択していきます。

はり付ける

デスクトップ上に「新しいテキストドキュメント.txt」といったものができてると思うので、それをダブルクリックすれば「メモ帳」が開きます。
ウィンドウが開くので、何も書かれていない真っ白い画面の上で「右クリック」→「貼り付け」と選択してみましょう。

ウィンドウの左上にある「ファイル」をクリックして、「上書き保存」を選択すれば、ホームページ・ファイルの完成です。

名前の変更

最後に、「新しいテキストドキュメント.txt」などと書かれているファイルを「右クリック」→「名前の変更」とクリックして、ファイルの名前を「おためし.html」とでもしておきます。
このファイル名は何でもよいのですが、さいごの英字の部分は必ず「.html」(ドット エイチ・ティー・エム・エル)としておいてください。

このファイル名が「〇〇.txt」のままだとホームページ用のファイルとして扱われないため、必ず「〇〇.html」というふうにしておきます。

うさぎ

ここまで、大丈夫でしょうか?
ちょっと難しかったかもしれませんね。

ためしに、「おためし.html」のファイルをダブルクリックして開いてみてください。
ごくシンプルなものですが、ホームページが開くと思います。

おためしページ
おためしページ

とりあえす、ホームページの作成のし方を感覚的にでも分かっていただけたのではないでしょうか。
お気づきかと思いますが、ホームページは"プログラム"によってめちゃめちゃ論理的に構築されています。
紙に色えんぴつで絵を描くのとはだいぶ手順がちがってきますが、アナログな道具とはちがい、作ったものをとり消したり修正したりといったことが容易におこなえるという利点もあります。

そういう点で、ホームページは論理的で合理的です。
さいしょは少し難しいですが、なれてしまえば便利なツールとなってくれるでしょう。

さいしょのページに戻る inserted by FC2 system