1. トップ
  2. コラム
  3. ホームページ作成
  4. これ1つでわかるホームページの作り方。初心者向けWebサイト作成の手順ガイド

これ1つでわかるホームページの作り方。
初心者向けWebサイト作成の手順ガイド

ホームページの作り方 初心者なるほどガイド

ホームページの作り方には、ズバリ下記の3つの方法が存在します。

①ホームページ作成ソフトで自作する ②専門技術で自作する ③プロの業者に依頼する

技術や知識がなくてもホームページを簡単に作成できるソフトを使う方法。
一般的な会社やお店のホームページを、できるだけ費用を押さえながら、公開後も自分や社内で更新・編集していきたい場合に向いている。

詳しく見る

HTML、CSS、JavaScript、WordPressなどの専門技術を使う方法。
技術を習得してWeb制作のプロを目指したい場合に向いている。

詳しく見る

ホームページ作成業者に依頼する方法。
費用を数十〜数百万円かけて、こだわりのデザインで規模の大きいホームページを作りたい場合に向いている。

詳しく見る

本記事は、あなたがこの中のどの作成方法に向いているかや、それぞれ具体的にどのように進めればよいのかなどを解説する、初心者向けコラムです。ホームページを作るにあたり押さえておくべきことを、基礎からていねいに説明していきます。

ホームページ作成ははじめの一歩が肝心です。思ったようなホームページにならず、無駄な費用を払うことになったり、後悔する事態を避けるために、ぜひ本コラムの内容を確認してみてください。

また、10個の質問に答えるだけであなたに合ったHP作成方法がわかる診断も用意しました。もし、とても忙しい場合は、この診断を先にやってみることもおすすめします。
1分でわかる!ホームページの作り方診断はこちら

\私たちがこのコラムを書きました/

佐野彰彦

簡単ホームページ作成ソフト「とりあえずHP」を運営する株式会社smallwebの代表取締役。著書に「ウェブ担当者1年目の教科書」など。

牧野健人

ホームページ作成・改善を専門とする株式会社リラクスの代表取締役。売り上げ・利益に繋がるホームページの作成が得意。

動画でわかるホームページの作り方

本コラムの内容をダイジェスト形式で動画にまとめました。自分に合ったホームページの作り方や初心者向けソフトを使った具体的な作成手順まで1本で理解できます。「文字よりも動画・音声で学びたい」という方は、ぜひこちらをご覧ください。(動画部分をクリックするとそのまま再生されます)

初心者が知るべきホームページの作り方の基礎知識

ホームページ作成の大まかな流れ

「ホームページを作る」ためには、まずその手順を理解しておくことが大切です。

ここであせらずに、まずは大まかに流れを理解しましょう。言葉の意味がわからなくてもいまは大丈夫。以下の手順があることを、ここではなんとなくイメージできればOKです。

ホームページ作成の大まかな流れ

ホームページの内容を考える

当然ですが、ホームページは主に誰に見てもらいたいのか、ホームページにどんな情報を掲載するのかなど、内容を考えることから、ホームページ作成はスタートします。

ホームページに掲載する文章や画像を用意する

ホームページに実際に載せる文章や画像が必要です。たとえば、工務店のホームページであれば、家づくりの特徴、施工事例、お客様の声などを伝えるために、テキストや写真が必要です。

ドメイン・サーバーを用意する

ドメインとは、「インターネット上の住所」に当たるもので、ホームページアドレス(URL)の一部です。例えばホームページアドレスが https://pr.toriaez.jp/ だった場合、ドメインはこの中の pr.toriaez.jp を指します。

URLの構造

サーバーとは、「インターネット上の土地」に当たるものです。ホームページを公開するためにデータを置く場所になります。

デザインを作成する

デザインとは「ホームページの見た目」のことです。ホームページ全体のレイアウトや色使いなどを決定します。後述しますが、すべてオリジナルでデザインを作成することはプロでないと難しいため、「デザインテンプレート」を利用することもできます。

HTML(ホームページのデータ)を作成する

HTMLとはホームページのデータのことで、たとえるなら「インターネット上の家」に当たるものです。こちらも後述しますが、専門技術を習得しないとHTMLを作成することは難しいため、HTMLを扱わずにホームページを作成する方法もあります。

ホームページを公開する

文字通り、ホームページをインターネット上に公開することです。


一般的に、ホームページを作るということは、上記で紹介した手順が必要になります。

しかし、初心者やプロではない方ができること・できないことがあるため、自分に合ったホームページ作成方法を選択することがなによりも大切になります。

次に、そのことを詳しく説明していきます。

ホームページの3つの作り方

HP作成の方法は、大きく言うと3種類

まずは基本となる、「ホームページの作り方にはどんな種類があるか」「それぞれの特徴は何か」を確認していきましょう!

ホームページはズバリ!主に下記の3つの作り方が存在します。

①ホームページ作成ソフトで自作する ②専門技術で自作する ③プロの業者に依頼する

技術や知識がなくてもホームページを簡単に作成できるソフトを使う方法。
一般的な会社やお店のホームページを、できるだけ費用を押さえながら、公開後も自分や社内で更新・編集していきたい場合に向いている。

HTML、CSS、JavaScript、WordPressなどの専門技術を使う方法。
技術を習得してWeb制作のプロを目指したい場合に向いている。

ホームページ作成業者に依頼する方法。
費用を数十〜数百万円かけて、こだわりのデザインで規模の大きいホームページを作りたい場合に向いている。

この3つの作り方を、先ほどの流れと組み合わせるとこのようなイメージになります。

ホームページの3つの作り方を、ホームページ作成の大まかな流れと組み合わせた図

「ホームページ作成ソフトで自作する」場合は、ホームページの内容のみを自分で作成し、あとの比較的むずかしい工程はソフトで自動化します。

「専門技術で自作する」場合は、すべての工程を自分で行うためハードルは高いですが、プロWEB制作者を目指すためには必要な取り組みです。

「プロ業者に依頼する」場合は、おまかせできるため楽ですし、プロならではの品質の期待はありますが、その分の費用がかかってきます。

それぞれに、メリットやデメリットがありますので、さらに掘り下げてみましょう。

以下でそれぞれの作り方の詳細を解説しますが、手っ取り早く「どれが自分に向いているか」を診断したい方は、1分でわかる!ホームページの作り方診断を試してみてください。

①ホームページ作成ソフトで自作する

初心者だけど自作したいならHP作成ソフト
メリット デメリット
  • 特別な技術や知識が必要ない
  • 費用が安い(月額1~3,000円程度)
  • ドメイン・サーバーが用意されている(サービスによる)
  • 使い方のサポートが受けられる(サービスによる)
  • セキュリティ対策が不要(サービスによる)
  • 大規模なホームページ作成には不向き
  • 独自の機能や個性的なデザインは不向き

ホームページ作成ソフトは、小規模〜中規模の企業や個人事業主の方を中心に人気を博しているHP作成方法です。

この方法なら、ソフトに登録するだけで、ドメイン・サーバー・HTMLファイルなどの「ホームページの開設に必要なもの」がすべて自動でセッティングされます

後はそこに文章や画像を投稿すれば、簡単に自分のページを公開することができます。

利用方法は、一般的なブログサービスなどとほとんど変わりません。ID・パスワードでホームページソフトにログインして、そこから文字を入力したり写真をアップロードしたりするだけです。
HTMLなどを直接編集する必要は無いので、初心者の方でも大丈夫です。

ホームページ作成ソフトの中でも特にハードルが低くおすすめなのは、「とりあえずHP」です。
とりあえずHPは、誰でも簡単にホームページを作成できるサービスです。
スマホだけでもホームページを作成できるので、「パソコンに慣れていない」という方でも安心して利用できます。

\「とりあえずHP」の公式サイトはこちら/

とりあえずHPを使ったホームページの作成手順は 初心者向けサービスを使ったホームページの作り方の章で詳しく解説するため、興味がある方はご覧ください。

代表的なHP作成ソフトの比較は下記の通りです。とりあえずHPは簡単さに大きなメリットがありますが、各ソフトにそれぞれの特色があるので、ご自身に合うものをチェックしてみてください。
とりあえずHP 累計2万人以上が利用する初心者におすすめの国産のソフト。ブログを書くくらい簡単にホームページを作成でき、使いやすい。使い方を相談できる有人サポートも充実しているため、個人〜中小企業の方に特におすすめ。
Wix 世界190か国で使われるイスラエル製の人気ソフト。自作系の作成ソフトの中でも機能が豊富で、プロも利用している。使い方を身につけることができれば高度な設定に対応することもできるソフトで、一歩進んだサイト制作を行いたい場合はおすすめ。
Jimdo ジンドゥーは、Wixと同様世界中で利用されているドイツ製のソフト。AIビルダーと呼ばれる自動生成機能などを搭載しており、使い方を身につければ高度な設定の実現も可能。
ホームページビルダー ホームページ作成ソフトの老舗。年配層の方にとって知名度が高く、今も利用が多い。パソコンにインストールして利用するタイプで、Windowsのみで利用可能。
SIRIUS2 ホームページビルダー同様に、パソコンにインストールする形式のソフト。比較的歴史が長く、SEO対策にも対応するソフトとして一部から人気がある。Windowsのみで利用可能。
グーペ 飲食店専用のホームページツールとして開発されているため、店舗のホームページ作成におすすめ。デザインテンプレートはやや少ないが、クーポン機能など魅力的な機能もある。

実際にソフトでホームページを作った人の体験談

土佐 奈穂子 さん/株式会社infullence
起業に合わせてホームページを公開でき、自分でいつでも編集できるのが魅力

起業および会社設立のタイミングに合わせて、ホームページが必要でした。
いくつか試したホームページ作成ツールの中には、操作が複雑だったり、少し編集しようと思うと表示バランスが崩れてしまうものもありましたが、初心者向けのソフト(「とりあえずHP」)へ切り替えたところ、とても簡単で使いやすく、自分にぴったりと感じるものと出会えました。 とくに独自ドメインやサーバーもセッティングされていて、会社設立の際、定款に記載しなくてはならないホームページのURLを素早く発行することができたこともよかったです。
また、月々3000円以内で利用でき、いつでも自分で情報を更新できるので、起業直後の私にとって非常によい選択ができたと満足しています。

— 土佐 奈穂子 さん/株式会社infullence

②専門技術で自作する

スキルを身につけたいならコーディング
メリット デメリット
  • 専門スキルを身につけられる
  • 自由度の高いHPを自分で構築することができる
  • 未経験からWEBデザイナーとして就職する際のアピール材料になる
  • 専門スキルを習得するための時間がかかる
  • 壁に当たっても乗り越える覚悟が必要
  • スクールなどに通う場合は費用がかかる(数十万円程度)

HTML、CSS、JavaScriptなどを使ってWebサイトのデータを作成し、それをサーバーにアップロードしたり、取得したドメインと紐付けたりすることでインターネット上に公開する方法です。

初心者の方がこの方法で自作するにはまずは勉強してスキルを身につける必要があるため、数ヶ月程度は準備期間が必要になるでしょう。

この方法は、自分自身が技術を身につけることが目的の場合には向いています。例えば「未経験だけど、デザイナーやコーダーとして就職したい」というケースなどが挙げられます。

このタイプのホームページ作成については 専門技術(HTML・CSS、WordPress)を使ったホームページの作り方の章で解説しています。

③プロの業者に依頼する

数十万~100万円程かけられるならプロに依頼
メリット デメリット
  • 独自性の高いホームページを作成できる
  • 業者に直接要望を伝えることができる
  • 制作費用が数十万円~100万円程度かかる
  • 公開後の保守や編集代行などにも費用がかかる

先述した2つの方法はホームページを自分で作る方法でしたが、制作会社やフリーランスなどホームページ作成を専門としている業者に依頼する選択肢もあります。

プロが作成するので、クオリティは高くなりやすいです。ビジネスの集客手段として本格的にWebサイトを活用していきたい場合には向いている方法でしょう。

ただし、制作費用として数十万円~100万円程度かかるのが相場であり、なおかつ(自社に専門スキルを持った社員がいないと)公開後の編集の際も業者に依頼しなければいけなくなるケースも多いため、自分で作成・編集できる方法と比べると費用が格段に高くなる点がデメリットです。

また、業者によって対応品質にも差があるため、費用がかかったわりには、「思ったようなホームページに仕上がらない」「イメージしたものと違う内容になってしまった」などの不満につながるケースもあります。

プロに依頼する際の流れ・注意点・費用などは下記の記事で詳しく解説しているため、併せてご覧ください。

実際に業者に依頼してホームページを作った人の体験談

安食 一さん/ゆたか建設株式会社
ブランディングから提案があり、ビジネスの成長に貢献してもらえました

以前は自分で市販のホームページ作成ソフトを使って作成していました。 しかし、自分で作成したものでは、どうしてもデザインが素人っぽくなってしまうのと、全く集客につながっていなかったので、プロにお任せすることに。 ホームページそのものをつくる前に、自社の強みや特徴をどのように打ち出していくか、ブランディングから提案してもらえ、ビジネスの成長に貢献するホームページを仕立ててもらえました。
ただし、自分で気軽に作成していたときよりも、依頼して対応してもらう時間はかかります。たとえばイベントのPRページを依頼した場合、最低でも2-3日はかかります。また、初回の制作費だけでなく、ランニングコストもかかるので費用面でも体力が必要です。
当社の場合は、かかる時間やコスト以上の成果が出ているので、専門業者に依頼して、結果として大正解でした。

— 安食 一さん/ゆたか建設株式会社

1分でわかる!ホームページの作り方診断

本コラムの冒頭で申し上げたように、自分に合っている作り方を選ぶことはホームページ作成において非常に大切です。

例えば、「本当はホームページ作成ソフトで十分だったのに、業者に50万円もかけて依頼してしまった」や、逆に「本当は予算をしっかり確保してプロの業者に依頼しないといけないレベルのホームページが必要だったのに、自分で作って不十分なものになってしまった」といった失敗は決して珍しくありません。

以下のホームページ作成診断では、10個の質問に答えることで、あなたのニーズや状況に適したホームページの作り方が判定されます

1分程度で回答できる分量なので、気になる方はお試しください。

Q1. 作りたいホームページの種類は?

Q2. ホームページを作る目的は?

Q3. ホームページ作成の予算は?

Q4. 公開後のホームページの運営や編集は?

Q5. ホームページを公開するタイミングは?

Q6. デザインへのこだわりは?

Q7. サーバーやドメインは所有している?

Q8. HTMLやCSSの理解度は?

Q9. セキュリティ対策に詳しい?

Q10. SEO対策(検索エンジン対策)は必要?

残りの質問数: 10問 / 10問

診断結果

あなたにピッタリなのはホームページ作成ソフトです!

一般的なレベルのホームページを、あまり大きな費用はかけずに、「初心者でも大丈夫な方法」で作成したいと考えているあなたには、ホームページ作成ソフトがおすすめです。

大手企業のホームページを予算をしっかりかけながら制作する場合は業者への依頼が適していますし、自分でWeb制作の技術を習得することが目的であるような場合にはコーディングの学習が必要になりますが、あなたはそれらには当てはまらず、ソフトを使って簡単に作ることが向いています。

ホームページ作成ソフトを使うと、月額3,000円程度でHPを作成できます。さらに、ページの作成や編集に専門知識が一切必要ないため、ご自身や社内スタッフのみでホームページを運用できます。

また、ホームページ作成ソフトには無料トライアルや無料プランがあるものも多いため、まずはお試し感覚で触ってみるのもよいと思います。

ホームページ作成ソフトには色々な種類がありますが、「初心者でも使いやすいものがいい」と考えていらっしゃる方には「とりあえずHP」がおすすめです。

240種類以上のデザインテンプレートから好みのものを選び、文字と写真を投稿するだけで、簡単にホームページを作成・公開できます。

今なら無料で試すことができますので、興味がある方は「とりあえずHP」の公式サイトからお申し込みください。申し込みフォームに入力すると、すぐに使うことができます。

あなたにピッタリなのは専門技術(コーディング)です!

Web制作のスキルを身につけることが目的で、HTML、CSSなどのコーディング技術を勉強する意欲がある方は、専門技術を学びながら実際にホームページを作ってみることがおすすめです。

Web制作会社などでの実務経験がなくとも、独学でコーディングの技術を身につけて自分なりにホームページを作ることは、Webコーダー、Webデザイナーとして就職活動をする上でもプラスに働きます。

ただし、最近ではWeb制作会社でもソフトを使ってWebサイトを制作するケースも珍しくありませんので、自分のカバー範囲を広げる点では、コーディングと平行してソフトの操作にも慣れておくことにはメリットがあります。

とはいえHTMLやCSSなどの勉強がもっとも重要なので、↓のリンクより専門技術を使ったホームページの作り方を確認した上でご自身でさらに深掘りをされることがおすすめです。

あなたにピッタリなのは
業者への依頼です!

作りたいホームページのレベルが高く予算もしっかり確保できる場合は、Web制作業者に依頼することがおすすめです。

特に、システム的で高度な機能を実装する必要があったり、サイトの規模が大きかったり、SEOで多数のアクセスを集めることが必須になるような場合は、知見のあるプロに頼るのがよいでしょう。

業者に依頼するときの注意点としては、制作が完了した後の更新・編集が社内ではおこなえない(スキルがないといじれない)状態でホームページを構築されてしまう可能性がある点が挙げられます。

公開後の運用も業者に丸投げしたい場合はそれでも問題ありませんが、社内でも運用したい場合は制作に着手する段階で「どこからどこまでを、専門スキルがない社内メンバーでも編集できるように構築するか」を明確にして業者とすり合わせことを推奨します。

初心者でも簡単!
HP作成ソフトを使ったホームページの作り方

この章では簡単HP作成ソフト「とりあえずHP」を使ってホームページを作成する手順を具体的に解説します。

この方法であれば、知識がまったく無い方でも最短で30分程度あれば下記のようなホームページを作成できます

「とりあえずHP」に無料登録

まずはとりあえずHPの無料体験に申し込みます。30日間完全に無料でとりあえずHPを使うことができ、その後も自分で本登録に進まない限りは料金はまったく発生しません。

登録作業は3分程度で完了します。

まず、下記のフォームからメールアドレスを送信してください。

\とりあえずHPを30日お試し/
無料体験申し込みフォーム

とりあえずHPのメール認証フォーム

その後、確認メールが届くので、下記の枠で囲われている箇所のURLをクリックします。

とりあえずHPの認証メール

すると無料体験申し込みフォームが表示されるので、必要事項を入力してください。このフォームを送信すると、自動的にとりあえずHPのツール画面に移動します。

とりあえずHPの無料体験申し込みフォーム

以上で無料登録は完了です。

基本情報の設定

とりあえずHPにログインできたら、まずはホームページの基本情報を設定しましょう。左のメニューの「基本情報の設定」を押し、ホームページ名や説明文などを入力します。入力が完了したら「上記の内容で設定」を押してください。

とりあえずHPの「基本情報の設定」

デザインの選択

次にデザインを選びましょう。とりあえずHPにはプロが作成した200以上のテンプレートが揃っているので、これらを選ぶだけで簡単にデザインを適用させられます。

左のメニューの「デザインの選択」を押すと下の画面が表示され、無料体験の申し込み時の入力内容に基づいてあなたにおすすめのテンプレートが表示されます。

とりあえずHPの「デザインの選択」

また、「業種から選ぶ」「色から選ぶ」「印象から選ぶ」「機能や形から選ぶ」などを利用することで自分で合うテンプレートを絞り込むことができます。

とりあえずHPの「デザインの選択」のフィルター機能

トップページの編集

次にメニューから「トップページの編集」に進みましょう。ここでトップページに掲載する内容を設定できます。

とりあえずHPの「トップページの編集

無料体験フォームに送信した内容を元に、あなたのホームページに適した例文が最初から入力されているため、文章を考えるのが苦手な方も安心です。

下層ページの作成・編集

次にトップページ以外のページの作成と編集を行いましょう。

まずメニューの「ページの作成と管理」を押し、ページの名前やメニューでの並び順などを設定します。完了したら「上記の内容で設定」を押してください。これでページの作成は完了です。

とりあえずHPの「ページの作成と管理」

次に作成したページの内容を編集します。メニューから「各ページの編集」に進み、対象のページを選び内容や公開/非公開の設定などを行います。

とりあえずHPの「各ページの編集」

以上で基本的な手順は完了です!画面右上の「ホームページを確認」を押すと、作成したホームページが表示されます。

上記で解説した項目以外にも、プロフィールやコンタクトフォーム、地図などを掲載する機能もあるので、必要に応じて管理画面から設定してください。

専門技術(HTML・CSS、WordPress)を使った
ホームページの作り方

この章では、HTML・CSS、WordPress等、専門技術を用いたホームページの作り方について解説します。

HTML・CSS

「ホームページを作るためには、HTMLやCSSを習得しなければならない」と思い込んでいる方もいるかもしれませんが、上記で紹介したように、ホームページ作成ソフトは進化していて、HTMLを理解しなくてもホームページは作れます

現在では、HTMLやCSSは専門技術を習得したい人だけが学べばよいものとなっています。

HTML CSS
ホームページの内容そのものを構造化したデータ ホームページの見た目やレイアウトを表現したデータ
HTMLやCSSを記述することを「コーディング」と言います。

これらを駆使することで様々な姿のホームページを構築できます。

実は、ホームページ作成ソフトで作ったページも、裏側はHTMLやCSSで構築されています。つまり「ホームページの正体は、HTMLやCSSで作られている」のですが、それを自分で書く(コーディングする)か、ホームページ作成ソフトにまかせて自動的に作成するかに違いがあるということです。

HTML・CSSによるホームページの作成手順は下記の通りです。

  • テキストエディタを用意する
  • HTMLの基本となるタグを記述する
  • 作りたいページ内容に応じてタグを記述する
  • HTMLファイルとして保存する
  • 作成したファイルをブラウザで表示してみる
  • サーバーにアップロードする

この手順は下の記事で詳しく解説しているため、併せてご覧ください。

なお、上記の工程の最後の「サーバーにアップロードする」については下記の記事で詳しく解説しています。「ホームページをインターネット上に公開するにはどのような手順を踏めばよいの?」と疑問に思われている方はこちらをご覧ください。

WordPress

WordPress(ワードプレス)は、ホームページ作成ソフトの一種で、CMS(コンテンツマネジメントシステム)と呼ばれるものです。ホームページ作成の手段として知名度が高く、2024年2月時点では世界中のホームページのうち43.2%がWordPressによって構築されています(※)。

※ 出典: Usage Statistics and Market Share of WordPress, February 2024

その知名度の高さから、ホームページ作成ソフトの選択肢として、このWordPressを検討する人も多いですが、先ほど紹介した「とりあえずHP」と比較した場合、自分でドメインやサーバーを用意する必要があるなど、完全な初心者の方にとっては、とっつきにくさを感じることもあります。

プロのホームページ作成業者の多くが、このWordPressを活用しており、活用次第では本格的で高機能なホームページを実現することも可能です。

同じような機能を持つCMSには、Movable Type(ムーバブルタイプ)などもありますが、それらと比べてWordPressには下記のようなメリットがあります。

  • 世界で一番使われているため、情報が多い
  • プラグインやテーマ(デザインテンプレート)が豊富
  • WordPress自体は無料

WordPressを利用してホームページを自作する場合は、以下を自分で行う必要があります。

  • 有料のレンタルサーバーを契約する
  • ドメインを契約し、サーバーに設定する(独自ドメイン利用の場合)
  • WordPressをサーバーへインストールする
  • WordPressを利用するための各種設定を行う
  • テーマをインストールする(有料のテーマもある)
  • ホームページの内容を投稿してコンテンツを管理する

レンタルサーバーによっては、WordPressの簡単インストール機能が備わっているため、サーバーを契約すれば、WordPressをすぐに利用することは可能です。

サーバーはホームページのデータをそこに配置してインターネット上で公開できるようにするためのコンピューターのことです。レンタルサーバーは、サーバーを簡単に借りて利用できるサービスのことです。

しかし、レンタルサーバーの選定と契約、ドメインの契約、WordPressを利用するための設定、テーマのインストールなどを自分で行うことになるため、そのようなITサービスの扱いに不慣れな方の場合は、苦労する可能性もありますので、注意が必要です。

WordPressを使ったホームページの作成手順は下記の記事で詳しく解説しているため、併せてご覧ください。

ホームページを無料で作る方法

ホームページを作る際には、基本的に費用が発生します。

ホームページ作成ソフト 専門技術で自作 プロに依頼
月額1~3,000円程度 サーバー代が月額1,000円程度 数十~数百万円程度

特に、プロに依頼する場合は高額な費用が発生しますが、自作する場合は、下記の方法により無料でホームページを作成・公開・維持することも不可能ではありません。

  • 無料のドメイン・サーバーを使う
  • ホームページ作成ソフトの無料プランを使う

無料のドメイン・サーバーを使う場合は、あなたのホームページに広告が掲載される場合や、使用できる容量に限りがある、独自ドメインは取得できないなど、いくつかの制約がありますが、以下のようなサービスが一例になります。

XFREE XREA Free
レンタルサーバーとして国内No.1シェア(※)を誇るエックスサーバーの無料版 GMOグループが提供する無料サーバー

※ 2024年2月時点、hostadvice.com 調べ。

趣味のホームページや、非営利活動などで、ホームページそのものに予算を割くことができないなどの事情がある方にとっては、ひとつの選択肢となるでしょう。

その際、繰り返しにはなりますが、以下のような制約がつく場合がありますので、その点を十分に理解した上で利用するようにしてください。

  • ホームページに広告が掲載されてしまう場合がある
  • 作成できるページ数が限られている場合がある
  • アップロードできる容量に制限がある
  • セキュリティ対策が十分にできない場合がある
  • ホームページの表示速度が遅くなる可能性がある

また、ホームページ作成ソフトを提供するサービス会社が、無料プランを用意しているケースもあります。

Wix Jimdo
イスラエルが開発拠点のソフトで、世界190か国で使われている ドイツが開発拠点のソフトで、Wixと同様に世界的に使われている

上記のサービスは、無料でも利用できるプランがありますが、無料サーバーを利用する場合と同様の制約があります。またサービスの都合で、無料で利用できる機能の制限がさらに厳しくなったり、いずれ無料プランが廃止され、有料プランのみに変更される可能性もあります。

つまり、自社のホームページが使えなくなってしまったり、あなたの意思と関係ないタイミングで、有料化や値上げに半ば強制的に応じることになるなどのリスクも考えられるため、会社やお店などの事業用のホームページは、はじめから納得できる価格の有料サービスを選んで利用することがおすすめです。

有料で作るとしても、とりあえずHPのような安価なHPソフトを使えば月額3,000円程度の費用で作成・運用できるので、事業用のホームページをできるだけ低コストで作り方はチェックしてみてください。

スマホ対応のホームページの作り方

ホームページは、人によってはパソコンでなく、スマホで見る場合もあります。

パソコンは横長の画面ですが、スマホは基本的には縦長の画面ですので、パソコンで作成したホームページをそのままスマホで見るととても見にくくなってしまいます。

ですので、ホームページを作成する際は、パソコンでもスマホでも両方で見やすいように配慮しておくことが大切です。

スマホ対応のホームページとは、上記で説明したように、「パソコンとスマホの両方で見やすく配慮されているホームページ」という意味になります。

ホームページをスマホ対応させる方法は基本的に下記の2種類です。

  • レスポンシブデザイン
  • アダプティブデザイン
ただし、このコラムで紹介した「とりあえずHP」などのホームページ作成ソフトを使えば自動的にスマホ対応させられるためため、特に気にする必要はありません。

レスポンシブデザインはページの表示の仕方を、PC・スマホ・タブレットなどのデバイスのウィンドウの幅に応じて変化させる手法です。

昨今でホームページのスマホ対応を考える場合はレスポンシブを採用することが一般的です。

レスポンシブデザイン

下記は、とりあえずHPで作成されているホームページ例です。レスポンシブデザイン機能搭載のテンプレートを活用しているため、意識せずとも、自動的にスマホ対応のホームページとなります。

レスポンシブデザインの実例

一方、アダプティブデザインはPC用とスマホ用のそれぞれのページデータを作成して、閲覧環境に応じて出し分けをする方法です。

アダプティブデザイン

大切なことは、ホームページをきちんとスマホ対応にすることです。

最近はスマホでホームページを見ている人も増えていますので、レスポンシブデザイン、アダプティブデザインのいずれかの方法を取り入れることで、スマホでも見やすくしておく配慮を忘れないようにしてください。

ホームページのスマホ対応については下記の記事で解説しているので、詳しく知りたい方はこちらをご覧ください。

パソコン・スマホ、それぞれを使ったホームページの作り方

先ほどはホームページの表示をスマホでも見やすくする方法についての解説でした。

次は、ホームページを「パソコンで作る場合」と「スマホで作る場合」について、それぞれ解説していきたいと思います。

ホームページはパソコンでしか作れないと思っている方もいるかもしれませんが、実は現在はスマホでもホームページを作ることが可能です。

パソコンで作成する場合、スマホで作成する場合、それぞれでできることが多少違い、手順が変わってくる場合もあります。それについて解説します。

パソコンでのホームページの作り方

ホームページをパソコンで作る場合、基本的には何かしらの作成ソフトを活用することになります。パソコン用のホームページ作成ソフトには、大きく分類して「ブラウザ型」と「インストール型」の2種類があります。

ブラウザ型とは、インターネットブラウザ(今このページを見るのに使っている、Google ChromeやMicrosoft Edgeなど)を利用するタイプのソフトです。IDやパスワードでログインして、ホームページを作成していきます。

インストール型とは、文字通り、お使いのパソコンの中にソフトをインストールし、ソフトを起動してホームページを作成していくタイプのものです。

ブラウザ型 インストール型
インターネットに接続し、ホームページ作成ソフトのログイン画面から、IDとパスワードで入室してホームページ作成を進めていくタイプ パソコンの中にソフトをインストールして、そのソフトを起動させてホームページを作成していくタイプ
とりあえずHP、Wix、Jimdoなど ホームページビルダー、SIRIUS2など

ブラウザ型

普段使っているインターネットブラウザ(Google ChromeやMicrosoft Edgeなど)を利用して、作成を進めることができるので、初心者の方でも比較的やりやすい方法です。

IDとパスワードでログインすることで、WindowsでもMacでも同じようにホームページ作成が行なえます。

またスマホでも同様にスマホでもパソコンとほぼ同じように操作してホームページを作成できることが多いです(この点はスマホでのホームページの作り方の章で解説します)。

インストール型

インストール型のソフトは、比較的歴史の長いものが多いです。

たとえばホームページビルダーやSIRIUS2がこれに該当するものですが、両方ともにWindows専用のソフトであり、Macでは使えません。また、Windowsであっても、パソコンのOSやソフトのバージョンの組み合わせ次第では、インストールできないこともあります。

あなたのお持ちのパソコンで利用できるかどうが、よく調べてから導入する必要がある点は注意が必要です。

スマホでのホームページの作り方

スマホでホームページを作りたい場合は、スマホ作成が可能なホームページ作成ソフトを利用することが必須になります。

スマホ作成が可能なソフトにも2種類あります。

ブラウザ型 アプリ型
インターネット閲覧する際に使用するブラウザ(Google ChromeやSafariなど)で、ホームページ作成を進めていくタイプ
※パソコン版のブラウザ型と同じ
専用アプリをダウンロード&インストールして、アプリを起動させてホームページを作成していくタイプ

ブラウザ型

スマホでホームページを作るというと、アプリをダウンロードする必要があると思う方も多いかもしれませんが、普段使っているブラウザのみで利用できるタイプのソフトもあります。

ブラウザ型のホームページ作成ソフトは、パソコンでもスマホでも、同様の機能が用意されている場合も多く、併用して使いたい場合などは非常に便利です。

たとえば、基本的な作成はパソコンで行い、お知らせの更新や写真のアップはスマホで手軽に行うなどの使い方も可能になります。

もちろん、スマホのみでホームページを作成することも可能です。

アプリ型

一方、アプリ型は専用のスマホアプリをダウンロードして利用するタイプです。パソコンのインストール型と形式的にはとても似ています。

AndroidやiPhoneなど、機種やOSによって使えるアプリが異なります。スマホの機種と変更したり、OSのバージョンを上げたりした際に、以前使用していたアプリが使えなくなってしまうなどのケースも起こる場合がありますので、そこは注意が必要です。


スマホで作成を検討している場合は、ご自身のスマホ環境に合っている作成方法を選ぶことが大切です。

例えば、ブラウザ型ソフトである「とりあえずHP」は、スマホ1台でも本格的なホームページを作成できます

とりあえずHPをスマホから操作している様子

上記は、とりあえずHPをスマホで使っている画面です。文字や写真をスマホから投稿するだけでホームページが簡単に作成できます。

とりあえずHPの場合、スマホで作ったとしても、できあがるホームページは自動的にパソコンとスマホの両方に対応したものになります。

そのため、「パソコンを持っていないけど、スマホ1台でホームページを作成・運営している」という利用者の方も増えていて、とても便利だと話題になっています。

「スマホでサクッとHPを作成・編集したい」「そもそもパソコンを使う習慣があまりない」という方には、とりあえずHPはおすすめのソフトです。今なら無料お試しも可能なので、興味がある方は↓から詳細をご覧ください。

スマホで手軽にホームページ作成!「とりあえずHP」

より充実したホームページを作成するための4つのポイント

ホームページは単に形を作ることだけではなく、掲載する内容を魅力的にすることが大切です。特にホームページを通じて集客につなげたり、反響を得るためには、以下の4つのポイントに注力していきましょう。

  • ①目的をはっきりと
  • ②ページ構成をわかりやすく
  • ③デザインは事業イメージと合わせる
  • ④文章や写真に力をいれる

①目的をはっきりと

あなたが、ホームページを作成する目的は何でしょうか?

  • 起業するにあたり、まずは名刺代わりのホームページが欲しい
  • 会社やお店の信頼感を伝えたい
  • 自社の取り組みや活動などの情報発信を行いたい
  • ホームページから、新規のお客様を増やしたい
  • ホームページで、商品を販売したい

など、どんな目的でホームページを公開するかをはっきりとイメージしておくことは大切です。また同時に、ターゲット(ホームページを見に来てほしい人は誰なのか)も明確にしておきます。

そうすることで、ホームページの内容をしっかりと組み立てやすくなるので、目的とターゲットを書き出しておくことがおすすめです。

たとえば、ホームページを通じて新規のお客様を増やしたい場合や、商品を販売したい場合は、SEO対策※も意識したホームページ作成を行うことも必要になります。

※ SEOはGoogleなどの検索エンジン上であなたのWebサイトが上位に表示されやすくするための取り組みのことで、集客手法として非常に効果的です。SEOの詳細についてはホームページのSEO対策とは?自分で行うヒケツを初心者向けに解説をご覧ください。

この点については下記の記事で解説しているので、併せてご覧ください。

②ページ構成をわかりやすく

ページ構成は、本にたとえると「目次」や「章立て」に当たるものです。

ホームページ全体の読みやすくするためには、このページ構成をしっかりと組み立てることが有効になります。ページ構成は、サイト構成ともいいます。

ホームページの構成は、下記の図のように、ツリー状の図で書き出してみるとイメージしやすいです。

サイト構成図例

上図は、ごく一般的な会社ホームページの構成の例です。

ホームページの玄関にあたる「トップページ」があり、その下に連なる形で、「事業紹介」「会社概要」「お知らせの一覧」などのページがあります。

また、「お知らせの一覧」の下にはさらに、「お知らせの個別ページ」が複数ページ並ぶ形となっています。

このように、ページ構成を書き出しておき、ホームページ全体の構造をイメージした上で、各ページの内容を作っていくと、ホームページの訪問者にとって、とてもわかりやすいものとなります。

よいホームページは、ページ構成がしっかりと考えられているものであると言っても過言ではありません。

ホームページの構成ついては下記の記事で解説しているので、詳しく知りたい方はこちらをご覧ください。

③デザインは事業イメージと合わせる

ホームページのデザインにこだわりたい方も多いと思います。

かっこいいホームページにしたい、かわいいホームページにしたい、赤が好き、青が好きなど、自分の好みでホームページのデザインを考えることも悪いことではありませんが、それよりも大切にすべきなのは、あなたの事業や活動のイメージと、ホームページの印象を一致させることです。

また、文字の読みやすさ、ボタンの押しやすさなど、操作のしやすさについても、ホームページの訪問者にとっては大切な部分になります。

自分自身が主観的に気に入ることと、ホームページの訪問者にとってわかりやすいことが、必ずしも一致するわけではないので、注意が必要です。

そのことを念頭において、ホームページをデザインする必要があります。

ホームページのデザインの作り方は、一般的に以下の2通りになります。

  • テンプレートを使う
  • オリジナルのデザインを作成する

テンプレートを使う

ホームページ作成ソフトやWordPressを使う場合は、あらかじめ構築されたデザインがテンプレートとして用意されているため、これらから任意のものを選択するだけで完結します。

たとえば とりあえずHPには、以下のようなプロがデザインした200以上のテンプレートを備わっています。

とりあえずHPのデザインテンプレート

自社の事業に合うホームページのデザインを、業種やイメージから検索して選ぶことができます。プロがデザインしたテンプレートから選んで、ホームページの内容を組み立てていくことで、素敵なホームページがリーズナブルに仕上がります。

オリジナルのデザイン

プロデザイナーではない限り、オリジナルのデザインを作成することは、かなりハードルは高いと思いますが、作成する場合は、Adobe XDFigmaなどのツールを使ってデータを作成します。

下記の記事では、デザインのポイントやツールの紹介、便利な参考サイトなどについて解説しているので、詳しく知りたい方はこちらをご覧ください。

④文章や写真に力をいれる

ホームページの訪問者にとって、もっとも関心があるのは、ホームページに掲載している内容、つまり文章や写真です。

実際に、今、あなたは、このページの文章や画像に価値を感じてくださっているからこそ、このページをここまで読んでくださっているのではないでしょうか?

あなたがこれから作成するホームページも、掲載する内容に力を注いでいくことで、より充実した価値のあるホームページに育っていくはずです。

文章はプロのライターに依頼する手もありますが、自分自身の言葉で書くことがおすすめです。「文章はあまり上手くないので苦手」という方もいますが、ホームページに掲載する文章は上手いか下手かよりも、自社の事業や活動の魅力を、頻度高く発信することがより重要です。

また、写真もプロカメラマンに依頼するも一案ですが、最近では高性能なデジタルカメラも比較的安価に入手できる時代ですので、自社で撮影することもおすすめです。写真の用意が難しいという方は、素材画像を配布しているサイトから、自社イメージに合うものをダウンロードして利用することもできます。

ホームページに掲載する内容に、活気や熱量が感じられたり、一生懸命さが伝わることで、ホームページの訪問者が反応してくれるようになります。

ホームページ公開後の運用のポイント

ホームページは作って終わりではなく、公開後も継続的に情報を更新したり、お問い合わせに対応していくことが必要です。

下記では、一般的にホームページの公開後に押さえておくべき項目をまとめておきました。ご参考ください。

情報の更新 最新のお知らせ、新商品のページ、日々の活動の報告など、会社や事業の魅力を伝えるために、情報を追加したり更新していきましょう。
お問い合わせ対応 ホームページ内に、お問い合わせフォームを設置する場合は、ホームページ訪問者からいつメールが届くか気にしておく必要があります。お問い合わせが来たら、速やかに返信対応ができるように、通知設定などを工夫しておくこともおすすめです。
SEO対策 SEOは、検索エンジンでホームページが上位に表示されるようにするための取り組みです。集客や販売を目的とする場合は、SEO対策の強化を常に意識したホームページ運営をしていきます。
アクセス解析 自分のホームページにどのくらいのアクセスが集まっているか、どのページがよく見られているのかなど、アクセスデータを把握することで、よりよいホームページへ改善するヒントが得られます。 とりあえずHPは、オリジナルのアクセス解析ツールが装備されている他、Googleアナリティクス(Googleが提供する解析ツール)の設置も対応しています。
ドメイン・サーバーの更新 一般的なホームページでは、ドメインやサーバーの契約が切れてしまわないように更新手続き漏れに注意が必要です。 とりあえずHPの場合は、サービス利用自体を継続すれば、ドメイン・サーバーも自動的に継続されるので安心です。

下記の記事では、一般的なホームページ運営でやるべきことを紹介しています。とりあえずHPの場合は不要なことも多いのですが、参考程度に併せてご覧ください。

ホームページの作り方についてのよくある質問

初心者でもホームページを自分で作れますか?

はい、作れます。

ホームページの作り方にはいくつかの種類があり、その中のホームページ作成ソフトを使う方法であれば、HTMLやCSSなどのコーディングスキルやドメイン・サーバーなどの知識がまったくなくともホームページを作ることができます。

詳しくはホームページ作成ソフトで自作するの章をご覧ください。

ホームページを作るにはいくらかかりますか?

ホームページ作成ソフトを使う場合は、月額利用料として1,000~3,000円程度かかります。(詳細はこちら

ホームページ作成業者に依頼する場合は、制作費用として20万円 ~ 100万円ほどかかるのが一般的です。(詳細はこちら

株式会社smallweb
サイト運営:株式会社smallweb

個人・中小企業を中心に2万人以上が利用している初心者向けのホームページ作成ツール「とりあえずHP」を開発・提供。
10年以上にわたりホームページ作成ツールを運用してきたノウハウに基づき、ホームページの作り方や運営の仕方、インターネットの基礎知識などについて、初心者向けにわかりやすく解説することを目的に当サイトを運営。

簡単に自分で作れるホームページ作成ソフト

無料お試しはこちら