カテゴリー
HTML

HTML(Step4-3)

インターネットにデータをアップロード

HTML、CSS、画像の各ファイルの準備ができたら、サーバーにデータをアップロードしていきます。

具体的な手順はいかのようになります。

  1. レンタルしたサーバーのサイトにアクセスしてFTP情報を確認する
  2. FTPソフトの接続設定を行う
  3. FTPソフトからサーバーにアクセスする
  4. パソコン内に保存してある各ファイルをサーバーに転送する

アップロードに必要なもの

サーバーの準備

今回はお名前.comよりドメイン取得とサーバーをレンタルして設定していきます。自分のサーバーがある場合はそちらをお使いください。ドメインはあなたのホームページのアドレスになるので、自分のサイトに合ったものを取得しましょう。

FTPソフトの準備

FTPは、File Transfer Protocolの略で、インターネットを利用してファイル転送を行うための仕組みの総称になります。その仕組みに対応したソフトをFTPソフトと呼びます。

今回は「FFFTP」というソフトを使います。以下よりダウンロードできるので入れておきましょう。

https://forest.watch.impress.co.jp/library/software/ffftp/

FTP情報を確認する

FFFTPにサーバーへの接続情報を設定する必要があります。最初にお名前.comにアクセスして、「ホスト名」「ユーザー名」「FTPパスワード」などの情報を確認しましょう。

まずは、お名前.comにログインして、レンタルサーバーのページに飛びましょう。下の図のようにコントロールパネルにログインしましょう。

ログインできたら、以下のようなコントロールパネルのページが表示されるので、「FTP・SSHアカウント」を選択しましょう。

開くと、管理者アカウント接続状況が確認できると思います。ここで、「アカウント」「パスワード」「FTPサーバー名」の3つをメモしておきましょう。後々、必要になるので、間違えずに控えましょう。

FTTPを起動して接続設定

FTTPを起動すると以下のように画面が表示されるので、「新規ホスト」をクリックしましょう。

ホストの設定画面が開かれると思うので、先ほどの「アカウント」「パスワード」「FTPサーバー名」の3つを使うながら入力していきましょう。

①ホストの設定名

ここには任意の名称を入力します。どのサーバーかわかるように名前を決めておくとわかりやすいと思います。

②ホスト名(アドレス)

先ほどメモした「FTPサーバー名」を入力します。

③ユーザー名

先ほどメモした「アカウント」を入力します。

④パスワード/パスフレーズ

先ほどメモした「パスワード」を入力します。

入力が終わったら、OKを押して設定が完了します。

HTMLファイル他を転送する

設定が完了したら、サーバーにファイルを転送しましょう。下の図のように先ほど①で設定した名前が一覧に表示されるので、接続を選択しましょう。

接続が完了すると、下の図のように自分のPCにあるファイル等が左側に、サーバー側は右側に表示されます。

左側の自分のPC側から今回作ったフォルダを開きましょう。移動するファイル、フォルダを全て選択します。

選択したら、右クリックをアップロードを選択しましょう。アップロードが完了したら、右側のサーバー側にファイルが全て表示されていたら、サーバーに無事転送が終わったということです。

ホームページにアクセス

転送が終了したら、最後にブラウザで確認してみましょう。「http://」にサーバーをレンタルする際に取得したドメイン名を入力して検索しましょう。トップページである「index.html」が表示されていたら、ホームページの公開の完了です。