ホームページ(Webサイト)はどう作ればよい?作成手順をご紹介

ホームページを使ってインターネットで集客したい、認知度を上げたいと行った事はありませんか?
最近ではホームページを活用したいという法人や個人が増えています。

しかし、実際にホームページを作るとなると「何から初めて良いかわからない。」「どうやって作ればよいかわからない」という人が多いのです。

そこで今回はホームページを作るために必要な物の紹介、作成手順を紹介していきます。
また、誰でも簡単にホームページを作る方法も紹介していますので、最後までご覧いただけましたら幸です。

ホームページの作り方にはどんなものがある?

それではまずホームページを作るにはどのような方法があるのでしょうか?
3つの方法を紹介していきますので参考にしてください。

HTML/CSSを覚えて自分で作る

ホームページはHTMLとCSSという言語で作られており、それらの言語を書くことによってホームページを作ることができます。
HTMLやCSSは比較的覚えやすい言語で独学でも時間をかければある程度は書くことができるようになるでしょう。
また、自分でHTMLやCSSを覚えて作る為、完全にオリジナルのホームページを作ることができます。

ただし、HTMLやCSSを自分で調べながら作る必要があるため時間がかかります。

CMS(WordPress)を使う

ホームページの作成にはHTMLやCSSだけが使われているわけではありません。
CMSを使ってホームページを作ることもできます。CMSとは、コンテンツマネジメントシステムのことであり、WordPressが有名です。

CMSはブログやメディアの運営に適していますが、ホームページとして活用することも可能です。
導入にはPHPなどの専門知識が必要になりますが、WordPressを簡単に導入できるサービスもあります。
WordPressには沢山のテーマが用意されていますので自分好みのテーマを選んで運用すると良いでしょう。

ホームページ作成ツールを使う

ホームページ作成サービスとは、HTMLやCSSの知識がなくともホームページを作れるサービスです。
テンプレートを選んでテキストと写真を入れるだけでホームページを作ることができます。

デザインテンプレートも充実しており、ドメインやサーバーを準備しなくても無料でホームページを作る事が可能です。
また、有料プランを契約する事で機能を拡張したり用途の幅を広げることもできます。

人に作ってもらう

HTMLやCSSを覚えたりWordPressを使って自分で作る以外にもホームページを作る方法はあります。

例えば、ペライチなんでもマーケットはHTMLやCSSが使える人がスキルを売り副業感覚でホームページを作ってくれるので、安くてキレイなホームページを作る事が可能です。
様々な人がホームページ作成をしてくれるので、過去の実績などを確認しながら選ぶと良いでしょう。

ペライチなんでもマーケットでホームページを作ってもらう

自分でコードを書くことのメリット・デメリットは?

では、実際に自分で1からコードを書くことにした場合には、どのようなメリットとデメリットがあるのでしょうか。
メリット・デメリットに分けて紹介していきますので参考にしてください。

メリット

自由度が高い

自分でコードを書く場合、知識さえあれば自分の思い通りにホームページを作ることができるので自由度はとても高いです。
また、デザインスキルを持っていればきれいなホームページを作るのも可能です。
自身でホームページを作る最大のメリットはこの自由度の高さと言えるでしょう。

安い

続いて紹介するメリットは費用が「安い」という点です。
自分でコードを書いてページを公開する為にかかる料金は、基本的にサーバー代とドメイン代のみです。

そのため、出費を必要最低限に抑えることができます。

表示速度が速い

HTMLとCSSで作られたサイトは、WordPressなどに比べてサイトの表示にかかる時間が短いです。

サイトが表示されるまでに時間がかかってしまうと、訪問者がサイトを見ることやめてしまう可能性があるので、表示速度は速い方が良いです。

デメリット

時間がかかる

もし自分自身にHTMLやCSSの知識がなかった場合、まずは勉強することから始めないといけません。

そして勉強をしてもなかなか簡単に作ることはできないため、最初はとても苦戦するでしょう。そのため1つのホームページを作るのには多くの時間がかかってしまいます。

知識を要する

上で述べたようにHTMLやCSSなどホームページそのものを作るための知識以外にも、サーバーやドメインの設定などページを公開するための多くの知識が必要になります。

また、きれいなホームページを作ろうと思うならデザインの知識やPhotoshopの使い方を覚える必要があります。

想定外の不具合が起こることがある

自分自身で作る場合に、必ずしも完璧な状態でホームページを公開できるとは限りません。
自分では正しいと思っていても、どこかでミスをしていて不具合が発生してしまうことも。
自分でミスを見つけられれば良いのですが、何が原因なのか分からず苦戦してしまう...ということもあるかもしれません。

ホームページを作るのに必要な環境は?

ホームページを作るためには、パソコンだけがあれば良いというわけではありません。
公開するための様々な環境が必要になります。

サーバー

サーバーとは、サービスを提供するコンピューターのことです。
サーバーは情報を提供する役割を持っており、自分で作ったホームページの情報をサーバーに預けることによって、インターネットでホームページを見れるようになります。

サーバーには、自社サーバーとレンタルサーバーがありますが、個人でホームページを作る場合にはレンタルサーバーを利用するのが一般的です。レンタルサーバーの例として、「エックスサーバー」や「ロリポップ!」などがあります。

ドメイン

ドメインとは、URLの一部であり、ホームページにはインターネット上の住所にあたるものです。
ドメインがなければホームページを公開することはできません。

ドメインはサーバーを借りる際にセットで取得することもできますが、オリジナルのドメインを別で買うこともできます。
オリジナルドメインは「お名前.com」や「ムームードメイン」などで買うことができます。

テキストエディター

テキストエディターとは、HTMLやCSSを書くためのツールです。
元々パソコンに用意されているメモ帳で書くこともできるのですが、テキストエディターは書くことの補助をしてくれるので、メモ帳で書くより簡単です。

テキストエディターの多くは無料でダウンロードして使うことができます。
テキストエディターの例として、AtomやVisual Studio Codeなどがあります。

FTPクライアント

FTPクライアントとは、FTP(File Transfer Protocol)を使用してファイルの送受信を行うソフトウェアのことです。
FTPソフトを使うことによって、作成したホームページファイルをサーバーにアップロードすることができます。
FTPソフトもネット上で無料でダウンロードすることができます。FTPソフトの例としてFileZillaやCrossFTPなどがあります。

ホームページを作るための手順

では、実際にホームページを作るためには何から始めれば良いのでしょうか。ここでは順を追って説明します。

①企画

ホームページを作ろうと思ったら、まず何を作るのかを企画します。
この企画次第でどんなホームページなるか決まりますのでしっかりと考えておきましょう。

情報の洗い出し

ホームページの目的・テーマは何か、誰に見てもらいたいのか、コンテンツの内容、コンセプト、デザインイメージなど、あらかじめ方向性や内容といった情報を洗い出します。

これらの情報を事前に洗い出しておく事で、ホームページの目的とさせることができます。

  • 誰に向けてのページなのか
  • コンセプト
  • コンテンツ内容
  • どんなデザインにするか

必要なページを決める

情報の洗い出しが終わってホームページの目的がはっきりとしたら、その目的を達成する為に必要なページを決めましょう。
飲食店の認知度UPが目的なら「トップページ、メニュー、アクセス、お問い合わせ」といったページが必要になるでしょう。

また、認知度UPだけでなく予約も取りたいのであれば予約ページも必要になりますよね。
このように必要なページを決めておくことで、抜け漏れを防ぎ目的を達成できるホームページを作っていく事が可能です。

②設計

企画が完成したら、ホームページの設計をします。

どのページに何を載せるのか、どのような構成・デザインにするのか、スマートフォン用のページも用意するのか、ある程度ざっくりとホームページの枠組みを決めます。

全体の構成を決める

「どのページからリンクを設置するか」「どんなカテゴリーを準備するか」「どういった記事を掲載するか」といったホームページ全体の構成を決めます。

特にページ数の多いホームページを作る予定の場合は全体の構成をしっかりと作っておかないと、後から必要なページが無かったり矛盾が生じたり様々な問題が起こる可能性がありますのでしっかりと決めておきましょう。

ワイヤーフレームを作る

ホームページ全体の構成ができたら次は各ページのワイヤーフレーム作ります。
ワイヤーフレームとは「ページ内にどんな情報を配置するか決めるフレームワーク」です。

ワイヤーフレームを作ることで認識やイメージのズレが生じなくなり、次の工程である制作をスムーズに進めていく事ができます。

③制作

設計が出来たら実際に制作に移ります。
いきなりコーディングをするのではなく、まず始めにデザインを作ります。

デザインを作る

ホームページのデザインはワイヤーフレームを元にして作っていきます。
ワイヤーフレームでは大まかな配置しか決めていませんでしたが、デザインの工程ではどのような色やフォントで何をどこに配置するのかなどを細かく決めていきます。

デザインにはワイヤーフレームを更に深掘りした「デザインカンプ」と呼ばれるデザインの原案を作る事が多く、次の工程であるコーディングはこのデザインカンプを元に作られていきます。

コーディングをする

デザインが完成したら、コーディングを開始します。
テキストエディタを使ってHTMLで構成を作り、CSSでホームページの見た目を整えます。

問い合わせ機能などをつけたい場合、メールフォームなどを設置しましょう。自分のパソコン上で完成したら、FTPソフトを使ってサーバーにアップロードして公開します。

④ページの公開

コーディングまで済んだらページの公開をします。
ページを公開するにはHTMLやCSSなどのデータをアップロードするウェブサーバーを準備する必要があります。
また、ホームページに割り当てる独自ドメインも必要です。

サーバーを準備する

ホームページを公開するにはまずサーバーの準備をします。
作成したホームページをインターネット上に保存する土地のような物がサーバーだと考えてください。

サーバーはレンタルサービスがあり、月額を払うことで借りることができます。

独自ドメインを準備する

ホームページの公開にはサーバーの準備につづいてドメインの準備が必要です。

ドメインはインターネット上の住所のようなものですが、ホームページを運用するには自分自身でドメインを取得しDNS設定をしないといけません。
DNS設定はドメインとサーバーを紐付けるための設定で、ページを公開するためには必要になります。

簡単にホームページを作るなら作成ツールを使う

ホームページを自分で作るにはHTMLやCSSなどの言語を覚える必要があるとお伝えしました。しかし、ホームページ作成ツールを使えばHTMLやCSSなどの知識を覚える必要がありません。

テンプレートを選ぶだけ

ホームページ作成ツールはテンプレートを選んでその中に写真やテキストを入れるだけでホームページを簡単に作る事ができます。
もちろん、プロがデザインしたテンプレートだからクオリティの高いデザインが豊富です。

面倒な設定不要

ホームページの作成ツールなら独自ドメインの設定やサーバーの設定が不要です。
もちろん、それらにかかる費用も必要ありません。
面倒な設定不要ですぐにページを公開する事ができます。

ホームページ作成ツールなら「ペライチ」

おすすめはホームページ作成ツール「ペライチ」です。
シンプルな操作で使いやすくおすすめです。
ホームページ作成ツールは海外製のツールが多く、テンプレートのデザインが海外向けですが、ペライチは国産のツールで日本人好みのデザインテンプレートが沢山あります。
さらにサーバーやドメインの設定をしなくてもホームページを公開できますから本当に簡単です。

ペライチはホームページ制作で何から手を付けていいかわからないといった初心者に特におすすめなツールです。


ペライチ公式サイト

ホームページがかんたんに作れるペライチ

おどろきの簡単さ、早さ、安心を提供!
だれでもあっという間に ホームページが作れます。