1. トップ
  2. コラム
  3. ホームページ作成
  4. ホームページの作り方を初心者向けに解説!Webサイト作成の手順ガイド

ホームページの作り方を初心者向けに解説!
Webサイト作成の手順ガイド

「開業に際してホームページが必要」
「会社・お店のきちんとしたホームページを作って、信頼感を担保したい」
「部活・サークル・趣味などのホームページを作りたい」
このように考えつつも、「でも、ホームページなんてどう作ればよいかわからない」「ホームページ作成業者に頼むと何十万円もかかりそう」と困っている方は、とても多いです。

この悩みを解決する上では、まずホームページの作り方にはいくつかの種類があることを知り、その中のどれが自分に合っているのかを正しく理解することが非常に大切です。

なぜなら、ホームページは作り方によって費用が10倍以上変わりますし、作るために必要となる作業や公開後の更新・編集の仕方、できあがるホームページの質などがまるで異なるからです。

その点を事前に理解していないと「本来なら数千円~数万円で必要十分なホームページを作れたはずなのに、それを知らずに50万円もかけて業者に依頼してしまった」や「とりあえずサクッと作ってみたけど、全然問い合わせにつながらない」といった失敗につながるケースは決して珍しくありません。

そんな失敗を避けて、事業のため、あるいは趣味や勉強のためなどあなたの目的に合ったホームページを作ることをサポートするべく、このコラムではホームページの作り方について基礎から丁寧に解説します。

10個の質問に答えるだけであなたに合ったHP作成方法がわかる診断も用意しているので、ぜひ活用してみてください!
1分でわかる!ホームページの作り方診断はこちら

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

牧野健人

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

佐野彰彦

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

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

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

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

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

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

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

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

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

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

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

初心者だけど自作したいならHP作成ソフト
メリット デメリット
  • スキルが必要無い
  • 時間をかけずに作れる
  • 費用が安い(月額1~3,000円程度)
  • サポートを受けられる
  • 保守が必要無い
  • 完全に自由にサイトを作れるわけではない
  • 本格的に(毎月数十~数百万円の費用をかけて)Webマーケティングを行う場合には不向きな場合がある

世の中には、専門知識がまったく無くとも簡単にHPを自作できるサービスが多数あります。費用も月額1~3,000円程度と安価です。

また、そうしたサービスはメールや電話でのサポートを受け付けていることも多く、わからないことがあったら直接質問できるため、途中で挫折する可能性が低い点もメリットです。

例えば下記のようなケースには適した方法だと言えるでしょう。

  • 小規模で予算が限られる企業の公式サイトを作りたい
  • お店のサイトを作りたい
  • 士業やコンサルタントの事務所のサイトを作りたい
  • 塾・教室・幼稚園のサイトを作りたい

一方、専門技術でオリジナルのサイトを作る場合と比べるとやや自由度が下がり、月間数十~数百万円の費用をかけて本格的にWebサイトを活用したマーケティングを行いたい場合は不向きな場合があります。

ホームページ作成ソフトにはさまざまなサービスがありますが、特におすすめなものとしては下記などが挙げられます。

とりあえずHP 初心者向けに特化した国産のソフト。ブログを書くくらい簡単にホームページを作成でき、有人サポートもあるため、知識に自信が無い方におすすめ。
Wix 世界190か国で使われるイスラエル製の人気ソフト。構造化データやrobots.txtなどの高度な設定にも対応しており、一歩進んだSEO(検索エンジン最適化)をおこないたい場合はおすすめ。
Jimdo AIによるホームページやの自動作成機能などを搭載した高性能なドイツ製のソフト。Wixと同様世界中で利用されている。
グーペ お店のホームページに特化したソフト。クーポン機能、予約システムなどを搭載。デザインテンプレートは少なめなので、それでも構わない場合は店舗経営者の方に非常におすすめ。
上述したソフトであれば、どれも専門技術が無くてもホームページを作成できますが、「初心者なので、とにかく簡単なサービスを使いたい」という方には「とりあえずHP」がおすすめです。

\とりあえずHPの公式サイト/

とりあえずHP

とりあえずHPは数あるサービスの中でも特に「簡単さ」にこだわっているため、「他のサービスで挫折した」という方でも安心して使うことができます

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

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

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

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

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

専門技術で自作する

スキルを身につけたいならコーディング
メリット デメリット
  • 専門スキルを実践の中で身につけられる
  • 未経験からデザイナーやコーダーとして就職する際のアピール材料になる
  • 費用が安い(サーバー代が月額1,000円程度)
  • 必要なスキルを身につけるのに時間がかかる
  • スクールに通って勉強する場合には費用が数十万円かかる

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の無料体験申し込みフォーム

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

フォームを送信するとメールが届きますので、下記の箇所をクリックして無料体験を完了させます。

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

すると、すぐにとりあえずHPのログインページやIDなどが記載されたメールが届きますので、アクセスします。

とりあえずHPの無料体験申し込み完了メール

ログインページにIDとパスワードを入れて「ログイン」を押してください

とりあえずHPのログイン画面

基本情報の設定

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

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

デザインの選択

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

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

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

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

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

トップページの編集

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

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

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

ページの作成・編集

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

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

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

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

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

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

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

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

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

HTML・CSS

HTMLやCSSはホームページを作る上で基礎となる技術です。

HTML CSS
ホームページが持つ内容の構造を定義するための技術 ホームページのデザインを定義するための技術
HTMLやCSSを記述することを「コーディング」と言います。

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

実は上述したホームページ作成ソフトで作ったページもHTMLやCSSで構築されています。つまり、いずれにせよホームページというものはHTMLやCSSによって構成されますが、それを自分で書く(コーディングする)か、サービスによって自動的に生成するかに違いがあるということです。

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

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

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

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

WordPress

WordPressはコンテンツ管理機能つきのホームページ作成ソフト(CMS)です。これを使うことで、HTML・CSSのみで構築するよりも格段にページの投稿や更新がしやすくなります

ホームページ作成の手段として非常にメジャーで、2023年6月時点では世界中のホームページのうち43.2%がWordPressによって構築されています(※)。

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

使い方に柔軟性があり、PHPやReactといった専門的な技術を使って開発を行うケースもあれば、上述した簡単ホームページ作成ソフトのように一切コーディングを伴わずに扱うことも可能です。

同じような機能を持つソフトはMovable Typeなど他にもありますが、それらと比べてWordPressには下記のようなメリットがあります。

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

また、ほとんどのレンタルサーバーにはWordPressを簡単にインストールできる機能が備わっています。

そのため、レンタルサーバーを契約すればすぐにWordPress製のサイトを公開することが可能です。

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

逆に言えば、サーバーの用意やそれに付帯する基本的な設定などは行う必要があるため、完全に不慣れな方の場合はとっつきづらさを感じる可能性があります。

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

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

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

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

特に、プロに依頼する場合は外注費が不可欠なので無料で済ませることはできません。

しかし、自作する場合は、下記の方法により無料でホームページを作成・公開・維持することも可能です。

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

ホームページ作成ソフトは前述の通り初心者でも簡単にHPを作成できるサービスで、下記のように無料プランが用意されているものもあります。

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

また、無料のレンタルサーバーとしては下記が有名です。

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

※ 2023年5月時点、hostadvice.com 調べ。

これらは、ホームページを無料で準備したい方にはおすすめの選択肢と言えるでしょう。

ただし、HP作成ソフトの無料プランや無料のレンタルサーバーには下記のような厳しい制約がついていることが多い点には注意が必要です。

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

そのため、個人の趣味のサイトを作るような場合には無料作成も選択肢に入りますが、お店や事務所、会社などの事業用のホームページは有料で作成する方がおすすめです。

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

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

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

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

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

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

レスポンシブデザイン

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

アダプティブデザイン

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

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

ホームページはパソコンでもスマホでも作ることができます。ただし、どちらを使うかによって「できること」や「具体的な手順」が変わってくる場合があります

この章では「パソコンの場合」と「スマホの場合」という観点からホームページの作り方について解説します。

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

ホームページをパソコンで作る場合、特に制限無くどのような手段も選択できます。

まず、パソコンからホームページ作成ソフトを使うケースについてですが、多くのソフトがパソコンをメインに設計されているので、ほぼ間違いなく機能のすべてを使用できます。

また、ソフトにはブラウザ(今このページを見るのに使っている、Google ChromeやMicrosoft Edgeなどのこと)から使うものと、ダウンロードして使うものがあります。

ブラウザ型 ダウンロード型
ホームページを開くときのように、ブラウザでソフトにアクセスして使う パソコンの中にソフトのデータをダウンロードして、デスクトップでソフトを開いて使う

一つ注意が必要なのが、ダウンロード型のソフトは使えるパソコンが限定されている場合があることです。

例えば、SIRIUS2やホームページビルダーなどはMacでは使えません。また、Windowsであっても、構成が古い場合はうまく機能しないことも考えられます。

それに対してブラウザ型のソフトはWindowsでもMacでも問題無く使えるのが一般的です。(ただし使うブラウザのバージョンがあまり古いと推奨環境外に当てはまるケースもあり得ます)

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

一方で、作成ソフトを使わずにHTMLなどを用いて自作する場合は、専門技術(HTML・CSS、WordPress)を使ったホームページの作り方の章で触れた通り、パソコンにテキストエディタとサーバーとの通信ソフトをダウンロードして、ホームページのコードを記述した上でサーバーにアップロードします。この作成方法はスマホではできないため、パソコンが必須になります。

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

スマホではHTMLなどを書いてサーバーにアップロードすることができないため、スマホ対応しているホームページ作成ソフトを使うことが必須になります。

そして、スマホ対応ソフトには、アプリ型とブラウザ型があります。

アプリ型 ブラウザ型
AndroidやAppleのアプリストアからスマホアプリをインストールして使う Google ChromeやSafariなどのブラウザでソフトを開いて使う

「スマホで作る」というとアプリ型をイメージされる方が多いと思いますし、実際にアプリ型のソフトも多いですが、注意点として、アプリの場合はパソコン版と比べて機能などが大きく制限されていることが多いです。

というのも、パソコンソフトとスマホアプリでは仕組みがまったく異なるため、同じ機能を持たせる難易度が高いのです。

それに対してブラウザ型は、ソフト自体はパソコンでもスマホでも同じもので、それをどちらの端末から開くかという違いしかありません。そのため、スマホでもパソコンと同じようにホームページを作成できることが多いです

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

とりあえずHPの場合、スマホで作ったとしても、できあがるホームページは自動的にパソコンとスマホの両方に対応したものになります。そのため、「パソコンを持っていないけど、スマホ1台でホームページを作成・運営している」という利用者の方も何割かいらっしゃいます。

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

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

作り方を決めるだけじゃない!
ホームページ作成の4つの手順

ホームページを作る上では、「作り方」だけでなく下記のポイントも検討する必要があります。

  • 企画
  • 構成
  • デザイン
  • 実装
効果的なホームページを作成するために、これらもしっかりと押さえていきましょう。

企画

開設の目的やターゲット像など、ホームページ作成の前提となる部分を検討する段階です。

ここが疎かになると、せっかく作ったホームページが意味をなさなくなってしまうため注意が必要です。

例えば商売・事業の集客が目的であればSEO※に適した手段・構造でホームページを作成すべきですし、Webページ上で商品を直接販売したいのであればショッピングカート機能を実装する必要があります。

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

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

構成

ホームページの内容を具体的に検討する段階です。これは、下記の2つの視点から考えることができます。

  • ホームページ全体の構成(サイトマップ)
  • ページ単位の構成

全体の構成は、下記の図のように「Webサイト内にどのようなページを持たせるか」を検討するものです。

サイト構成図例

ページ単位の構成は、各ページ上に具体的にどのような要素(文章や画像などのコンテンツや、ナビゲーションなど)を掲載するかを検討するものです。

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

デザイン

ホームページのデザインの作り方は、大きく分けて下記の2パターンがあります。

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

テンプレート

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

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

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

「デザインのことがわからない」「デザイナーに発注する予算が無い」などの場合にはこのようなテンプレートを活用することがメインの選択肢になるでしょう。

オリジナルのデザイン

オリジナルのデザインで進めたい場合は、 Adobe XDFigmaなどのツールを使ってデータを作成します。

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

実装

ホームページをインターネット上で公開できるようにWebページとして実装する段階です。

この点は本コラムの 専門技術(HTML・CSS、WordPress)を使ったホームページの作り方の章で解説した通りです。

また、ホームページ作成ソフトを使う場合は、管理画面から操作するだけで自動的に実装が完了するので、この工程は省略されます。

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

ホームページは作って終わりではなく、公開後の適切な運用が不可欠です。特に下記は基本的な項目になるので、内容を押さえておくことがおすすめです。

掲載内容の更新 ホームページ上の情報が常に正しい内容に保たれるように更新したり、会社やサービスの魅力をアピールする上で必要なコンテンツを新規で追加したりします。
お問い合わせ対応 コンタクトフォームを設置する場合は定常的に連絡が入る可能性があるため、内容に応じて対応しましょう。受信にすぐに気づくように、通知の設定をしておくことがおすすめです。
SEO SEOは検索エンジンでホームページが上位表示されるようにするための取り組みです。SEOの基本は ホームページのSEO対策とは?自分で行うヒケツを初心者向けに解説をご覧ください。
アクセス解析 ホームページへのアクセス状況は、 Google アナリティクスなどの専用ツールや とりあえずHPなどのアクセス解析機能を持ったホームページ作成ソフトなどを利用することで計測できます。どのページがどのようにどれくらい見られているかなどを把握し、課題を発見→改善のサイクルを回しましょう。
ドメイン・サーバーの更新 ホームページが公開された状態を保つには、ドメイン・サーバーの契約が切れないようにする必要があります。「とりあえずHP」などのホームページ作成ソフトを使う場合はその契約だけ維持すれば自動的にドメインやサーバーも更新されるので大丈夫ですが、レンタルサーバーなどを利用する場合は各社のヘルプページなどを参照しながら適切に更新しましょう。

下記の記事では、上記を含むホームページ運用の基本をより掘り下げて解説しているので、併せてご覧ください。

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

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

はい、作れます。

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

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

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

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

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

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

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

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

無料でHPを作る