作ったファイルをアップロードしてみよう

作ったファイルをアップロードしてみよう

ホームページのファイルを作成することができたら、実際にインターネット上に公開します。

この時点ですべてのページを完璧に完成指定なくても大丈夫です。

インターネット上に公開することで、どのように表示されるか確認しながら作りこんでいけば良く、そちらの方が修正などもしやすいので、まずは自分のホームページとなるものを実際にパソコンに表示してみましょう。

FTPソフトを使ってファイルをアップロードする

作ったHTMLファイルをレンタルしたサーバーに転送することによってWEB上で自分のサイトを見ることができます。

ホームページを作成する上で初めに分からなくなることが多いのがこのFTPツールによるサーバーへのファイルの転送です。

ここではFFFTPという無料ソフトを使った設定方法を紹介します。

最初の設定ができればその後は面倒はないので、しっかり設定していきましょう。

FTPソフトに必要な設定をしていきましょう

転送したいファイルがあるフォルダを開き転送設定をしていきましょう。

レンタルサーバはFC2WEB を例に挙げて説明したいと思います。

FFFTPのインストールは完了しているものとしてデスクトップのショートカットから起動してみましょう。

起動したら、「新規ホスト」から設定していきます。

■ホストの設定名

これは設定名なので任意で決めて大丈夫です

■ホスト名

ホスト名には 「アカウント名.web.fc2.com」 と設定します。

■ユーザー名

ユーザー名はFC2webで登録したアカウント名(ID名)を設定します。

■パスワード

ホームページ管理画面で設定したFTPパスワードを入力します。

■ ローカルの初期フォルダ

ここは空白のままでも大丈夫です。FFFTP起動時にどのフォルダを表示するかを設定します。

■ ホストの初期フォルダ

ここも空白のままでも大丈夫です。FFFTP起動時に、サーバ側でどのフォルダ(ディレクトリ)を表示させるかを設定します。

■OKを押す

設定が終わったら、OKを押して設定を完了してください。

うまく設定できていれば、左側にローカル(パソコン)フォルダのファイルが、右側にはサーバ側のフォルダが表示されます。

ホームページのHTMLファイルを保存しているフォルダに移動し、TOPページとして作ったindex.htmlファイルの上で右クリックして「アップロード」をクリックします。

これで左側のindex.htmlファイルが右側にも表示されていると思います。

うまく転送することができましたか?
これでホームページのアップロードは完了です。

インターネット上で確認してみる

では実際にインターネット上でホームページがどのように表示されるのかを見てみましょう。

index.htmlファイルを転送した場合、あなたのURL「http://アカウント名.web.fc2.com/」か,、「http://アカウント名.web.fc2.com/index.html」のアドレスにファイルの内容が表示されます。

上記のURL(アドレス)をアドレスバーに入力してみましょう。

トップページとなる「index.html」のファイルが表示されます。

きちんと表示されていますでしょうか?

表示されない場合は、ファイルがうまくアップロードされていないか、アドレスが間違っている可能性もあるので、立ち戻って再度確かめてみてください。

ここまででがホームページファイル作成から公開までのひと通りの手順になります。

これから先はテキストの大小のメリハリをつけたり画像を掲載するなどしてホームページを作っていくことができます。

またそれ以上に重要なのがどのようなホームページを作るのかというところです。

ホームページのテーマやコンテンツをしっかり決めて作りだせれば、ホームページを完成させることができます。

またホームページの大枠が完成すれば、広告収入を得られるアフィリエイトサービスにも参加が可能です。

登録時に簡単な審査があるので、サイトのテーマを決めてある程度完成したものでなければ審査に落ちてしまうこともあるので、登録する前に以下の点をクリアしておきましょう。

  1. ホームページのテーマが決まっている
  2. トップページとサブページが合計5ページ以上ある
  3. 各ページには文章が入っている(200字以上位が目安)

あとは内容が公序良俗に反しないものであれば審査に合格できると思います。

ホームページコンテンツの作り方 ホームページの作り方【HTML編】
  1. ホームページのテーマを考える
  2. タイトルを考える
  3. デザイン・構成を決めよう
  4. 色の効果・印象などの考え方
  5. サブページの作り方
  6. サイト内移動について
  1. いろんな文字を表示させてみよう
  2. 画像を表示させてみよう
  3. リンクをつけてみよう
  4. ウェブカラーリスト
  5. テーブルの使い方と作り方
  6. HTMLでできるいろんなこと
広告収入について ホームページの作り方【CSS編】
  1. 広告収入の仕組み
  2. 広告収入を始めるメリット
  3. 広告の種類と特長
  4. プログラムに参加する
  5. ホームページの審査について
  6. お勧めの厳選プログラム
  7. 広告の設置手順
  1. スタイルシートでビジュアルアップ
  2. 文字を装飾してみよう
  3. リンクを装飾してみよう
  4. ボックスを作ってみよう
  5. 背景画像を作ってみよう
このエントリーをはてなブックマークに追加
Yahoo!ブックマークに登録
Clip to Evernote

メールを送る

ご質問やご意見ご感想はこちらのフォームをお使いください。

SEO [PR] !uO z[y[WJ Cu