FC2ホームページを使ってWebサイトを一般公開する

最終課題

FC2ホームページに自分のサイトをアップロードし、そのURLを僕あてに送信 送信先メールアドレス -> sy_tanaka@vivivit.co.jp 本文にURLのみ記載し、特別な理由がなければ本文・件名ともになくて大丈夫です。

http://sniresnriesa.web.fc2.com/index.html

Yahooジオシティーズを使ってアップロード

  1. Yahoo!japanアカウント登録
  2. Yahoo!ジオシティーズにアクセス http://geocities.yahoo.co.jp/

  3. 無料ホームページを開設ボタンをクリック

  4. あとの手順は以下

  5. メニューの左方にある「ディレクトリ作成」ボタンをクリックでassetsフォルダを作成

  6. assetsフォルダをダブルクリック
  7. assetsフォルダ内にcssフォルダを作成
  8. assetsフォルダ内にimagesフォルダを作成
  9. cssフォルダをダブルクリック
  10. cssフォルダ内に、メニュー左方にある「アップロードするファイルを選択」をクリックして、app.cssをアップロード
  11. メニュー一番左の左矢印(ディレクトリをひとつ上にもどる)ボタンを押して、assetsフォルダに戻る
  12. imagesフォルダをダブルクリック
  13. imagesフォルダ内に使用する画像をアップロード
  14. 一番上の階層に戻って、アップロードするファイルを選択ボタンからindex.htmlをアップロード
  15. index.htmlをダブルクリック
  16. サイトが表示されていれば完成!!

宿題

FC2ホームページの登録を完了する!

概要

今日、そして次回(最終回)にわたり、今まで作ってきたWebページを一般公開します。 今回利用するのはFC2ホームページ(http://web.fc2.com/)です。 FC2ホームページはHTML, CSS, Javascriptなどのアップロードに対応している無料サービスで、手軽にオリジナルサイトがつくれます。

まだページができてない人は、今日はページのブラッシュアップを行ってください。 完成してるなーという人は下記の手順でサイト公開してみてください。

※公開したサイトは必ずポートフォリオに載せましょう。採用担当者の食いつきが違います。 他の方法ではGithub-page(https://pages.github.com/)とかもありますが、こっちはプログラムの知識が若干必要なためやや敷居が高いです。ただ、業界標準の作られ方をしているので、勉強する価値はあります。興味がある人は調べてみてください。(Gitとかターミナルの操作は必須となります。)

ステップ

  1. FC2アカウントを取得
  2. FC2ホームページへアクセス
  3. ファイルをアップロード
  4. 公開完了

詳細手順

  1. FC2アカウントを取得してください。持ってる人はログインしてください。
  2. FC2ホームページ(http://web.fc2.com/)にアクセスしてください
  3. 無料プランで登録
  4. サイトのアカウント名を決定(これがURLになります)
  5. カテゴリ、タイトル、詳細を決定して利用規約同意チェックマークをつけ、登録ボタンをクリック
  6. ホームページ作成ボタンをクリック
  7. ホームページ管理の下にあるファイルを作成アップロード
  8. すでにindex.htmlがアップロードされているので、右クリック(副クリック)で削除をクリック

ファイルアップロード

ここからさきは実際にサイトを公開するにあたって必要なファイル(index.htmlとかassetsフォルダとかapp.css)をアップロードしていきます。といっても、自分のPCにフォルダつくるのと全く同じ感じです。 profile3を例に解説します。もちろん、assetsやcssといったファイル・フォルダの名前は自分が今つくっているディレクトリの名前に合わせる必要があるので、その辺は適宜よろしくお願いします。

  1. メニューの左方にある「ディレクトリ作成」ボタンをクリックでassetsフォルダを作成
  2. assetsフォルダをダブルクリック
  3. assetsフォルダ内にcssフォルダを作成
  4. assetsフォルダ内にimagesフォルダを作成
  5. cssフォルダをダブルクリック
  6. cssフォルダ内に、メニュー左方にある「アップロードするファイルを選択」をクリックして、app.cssをアップロード
  7. メニュー一番左の左矢印(ディレクトリをひとつ上にもどる)ボタンを押して、assetsフォルダに戻る
  8. imagesフォルダをダブルクリック
  9. imagesフォルダ内に使用する画像をアップロード
  10. 一番上の階層に戻って、アップロードするファイルを選択ボタンからindex.htmlをアップロード
  11. index.htmlをダブルクリック
  12. サイトが表示されていれば完成!!