▲TOPへ
はじめてのHTML・CGI


オフラインでHP作成
(※オフラインとは回線を切った状態のことです)


全体の流れ

  1. パソコン内に新しくホームページ用のフォルダを作る

  2. ホームページの作成
    ※この方法で作成すると万が一HPサーバー上のデータが消えても手元にデータがあるので安心です。

1.パソコン内に新しくホームページ用のフォルダを作る

  • フォルダの作り方 (Win一般的な機種の説明のみです。他機種の方、ご了承下さい。)
    ※すべて動作確認をしておりますが、この方法で不具合が生じても責任はとれません。
  1. 「スタート」ボタン(パソコン終了時に使用するのと同じもの)をクリック。
    →「プログラム」というところに、カーソルをあわせる。
    →色々と表示されますが、その中の「エクスプローラ」をクリック。
    →エクスプローラ画面が立ち上がります。

    下記はその手順の図です。




    立ち上がったエクスプローラ画面




  2. その中の(C:)を見つける。(Cドライブのこと)




    下記図のよに(C:)の左横に「+」マークがあったら、その+の部分をクリック。

    00-00004.gif


    下記図のように「−」のときは、そのまま。



    Cドライブの下に、色々なフォルダがあります。


  3. ここに新しいフォルダを作ります。
    作り方は、(C:)というところをクリックして、上段の「ファイル」をクリック。
    →「新規作成」というところにカーソルをあわせる。
    →その中の「フォルダ」を選択。



    →これで新しいフォルダがCの下に作られました。


  4. フォルダに名前をつける。
    右と左に2分割された画面の右側に「新しいフォルダ」が一番下にあります。




    そこに適当な名前の入力が可能ですが、わかりやすくhomepageと入れると良いでしょう。




    入力で間違えた場合、その名前の上でクリックすると、点滅し入力し直せます。

    以上で1の作業は終わりです。
    エクスプローラ画面を終了させて下さい。(右上の「×」で終了)




2.ホームページの作成

  1. InternetExplorer(インターネットエクスプローラ)を立ち上げる。
    オフライン作業を選択できる場合は、オフライン作業で。
    (回線を接続する必要はありません)

  2. 上段の「表示」をクリック。
    その中の「ソース」をクリック。




    →別の画面が表示されます。



    アルファベットだらけの内容、それがそのHPのソース、HPを展開したものです。


  3. 今、表示されているソースをすべて消して、下記と同じものを書いて見て下さい。

    上記の< > も必要です。< > 内は半角文字で。





  4. 書けたら「ファイル」をクリックし「名前を付けて保存」をクリック。




    そのとき「保存する場所」の右側の矢印を左側の表示窓が(C:)になるまで押す。
    Cになったら、下のファイル名の1(上記)で作成したhomepageの部分をダブルクリック。
    その後、ファイル名を入力、とりあえず index.html と入力しておくと良いでしょう。
    ※HPの最初のページは、たいていindex.htmlで、と、指定されていることが多いので。
    このときファイル名はindexだけではなく、index.htmlと拡張子の.htmlも忘れずに入力して下さい。



    (TOPページ以降は、お好きなファイル名で。そのとき拡張子「.html」または「.htm」を忘れずに。)
    たとえばリンクのページを作ったとしたらファイル名を「link.html」などで保存しましょう。
    (ファイル名は半角英数文字で)



  5. そして、フォルダを作るときと同じように、スタートのエクスプローラを選びます。
    Cドライブの中の、homepageを選択、さらにその中のindex.htmlをダブルクリック。
    すると、さきほど作ったHPが表示されます。
    内容は「あいうえお」とだけ書かれいてます。

    「お気に入り」に「追加」しておくとスタートから立ち上げなくても見れます。




    このときのタイトルは「MY HOME PAGE」となっています。
    これは、上記の<TITLE>と同じものが表示されます。
    内容の「あいうえお」は<BODY>のものです。

    この<TITLE>や<BODY>をタグといいます。
    他にも色々なタグがあります。HP作成にあたり最小限なタグは次のSTEPで学べます。

    以上で簡単ではあるけどHPの完成です。



    上図のように出来ましたか?

▲TOPへ