簡単な無料ホームページの作り方

はじめてホームページを作る際、テンプレートを自分で一から作成するのは困難かと思われますので、当サイトの簡易サンプルを使用して実際に作成してみることをおすすめします。

当サイトとほぼ同じテンプレートを用意しましたので、何をどうすればいいのかわからない場合は使用してみて下さい。

index.html と index.css の雛形サンプルふたつを使用して、ヤフーのジオシティーズ無料ホームページスペース比較を参照。)で作ることを仮定してご紹介いたします。


お約束事項:こちらのテンプレートを使用して何らかの損害が生じましても責任は負いかねますので、自己責任にてご自由にお使いください。)

スタイルシートの作り方

まず、デザインの部分を指定する「スタイルシート(CSSファイル)」の作り方ですが、右クリックで「空のファイル」を新規に作成します。

すると、自動でファイル名が作成されますので、これを「index.css」に変更します。

これを「index.css」のファイル名に変更してください。

この作成した「index.css」のファイルに、次のソースを上書きします。

右クリックで「ファイル編集」を選択するとデフォルトで挿入されている内容が表示されますが、これを上のソースですべて上書き保存してください。

保存する際、文字コードは「UTF-8」を選択してください。

これでスタイルシートは完成です。

HTMLファイルもコピペで簡単作成

次に コンテンツの部分にあたるhtmlファイルを作りますが、同じようにコピペで作成します。こちらのソースをコピー&ペーストしてください。

htmlファイルの中身

右クリックで「ファイル編集」を選択し、デフォルトで記載されている内容を上のソースを使って全て上書き保存します。

ちなみに、上書きしますので、現在表示されているデフォルトのページ内容は、こちらのテンプレートですべて置き換わることになります。

ファイル名はそのまま「index.html」で保存します。

文字コードはこちらも「utf-8」を選択してください。

このCSSファイルとHTMLファイルを作成すれば、とりあえずはトップページが表示されることと思います。そのまま作れば、テンプレートはこのホームページとほぼ同じ構成になるはずです。

無料テンプレートは、こちらのサイトにも多少ありますのでご自由にお使いください。

あとは、index.htmlファイルに書かれている「あなたのホームページ」などの文字を、実際のサイト名などに書きかえていけばよいでしょう。


ちなみに、まったく同じ作り方でfc2の無料ホームページで作成した場合はこのようなわりとちいさめの広告になります。

fc2の無料ホームページで作成した場合の広告

FC2で作成した無料HP

FC2無料ホームページの作り方

どちらのホームページスペースで作成しても大差ないかとは思いますが、ジオシティーズは有料版にしないと広告が目立ってしまうかもしれません。