WEBサイトの作り方のパターンを徹底紹介!!【2023年最新版】
WEBサイトの作り方にはどんなパターンがあるのでしょうか?
WEBサイトを外注して作るにしろ、自作するにしろ、作り方の全体像が掴めなければ判断できません。
この記事ではWEBサイトの作り方をパターンに分けて紹介し、それぞれのメリットやデメリット、おすすめの人まで明らかにしていきます。
WEBサイトの作り方について悩んでいる方、そもそもWEBサイトの作り方を知らない方はぜひ参考にしてください。
- スクラッチ開発とは?意味やメリット・デメリットをまとめてご紹介!!
- CMSとは?WordPressなど代表的なCMSの種類を一覧で解説!!
- 【ノーコードでWEBサイト作成】ホームページ作成サービスおすすめ10選
目次
主なWEBサイトの作り方は4パターン
制作方法 | 制作費用 | 制作期間 | メリット | デメリット | おすすめな人 |
フルスクラッチ開発 | 外注:数百万〜数千万円 | 半年以上 | ・自分の思い通りの機能を導入できる ・簡単にコンテンツの制作や更新可能 ・機能追加や保守に対応しやすい | ・開発に最も時間と費用が必要 ・高度な知識とスキルが必須 | 数百万円〜数千万円で時間をかけても完全オリジナルのWEBサイトを作りたい人 |
既存CMSを使用 | 自作:無料〜2万円 外注:数十万〜数百万円 | 数ヶ月 | ・簡単にコンテンツの制作や更新可能 ・プラグインを使えば簡単に機能を追加可能 ・情報が多いため安心して利用できる | ・ページの表示速度が速くはない ・高度な開発には知識とスキルが必須 ・セキュリティリスクがある | ・慣れているCMSがある人 ・ブログやオウンドメディアを作成したい人 ・数十万円〜数百万円でオリジナルのWEBサイトを作りたい人 |
静的サイト | 自作:勉強費用 外注:数万〜数十万円 | 数週間〜数ヶ月 | ・ページの表示速度が速い ・セキュリティリスクが低い ・大量アクセスに強い | ・制作や更新に知識・スキルが必要 ・ユーザーごとに異なる情報を表示できない ・情報更新に手間がかかる | ・1ページだけのWEBサイトをオリジナルで作りたい人 ・自力でのWEBサイト作りに興味がある人 |
作成サービス | 自作:数千円 外注:数万〜数十万円 | 数日〜数週間 | ・専門的な知識やスキルが不要 ・外注よりはるかに安くホームページを作れる ・完成〜公開までの速度が速い | ・デザインがある程度決まっている ・機能の拡張性に制限がある ・本格的に使うなら月額課金になる | ・労力とコストを最小限に抑えたい人 ・デザインや機能の制約が問題にならない人 ・早くWEBサイトが必要な人 |
2023年現在、主流のWEBサイトの作り方は以下の4パターンです。
パターン1:フルスクラッチ開発
パターン2:既存CMSを使って作成
パターン3:HTML・CSSなどのコードを書いて静的サイトを作成する
パターン4:ホームページ作成サービスを利用する
以前は別パターンも使われていましたが、現在では選択する人が少なくなりこの4パターンに絞られています。
それぞれ順番に説明していきます。
パターン1:フルスクラッチ開発
制作方法 | 制作費用 | 制作期間 | メリット | デメリット | おすすめな人 |
フルスクラッチ開発 | 外注:数百万〜数千万円 | 半年以上 | ・自分の思い通りの機能を導入できる ・簡単にコンテンツの制作や更新可能 ・機能追加や保守に対応しやすい | ・開発に最も時間と費用が必要 ・高度な知識とスキルが必須 | 数百万円〜数千万円で時間をかけても完全オリジナルのWEBサイトを作りたい人 |
フルスクラッチ開発とは、完全にオリジナルなシステムをゼロから開発する方法です。
費用が高いので、ECサイトのような大がかりな開発で主に検討されます。
自社システムとの連携が必要な場合や、独自機能・複雑なカスタマイズが必要な場合にも検討されます。
フルスクラッチ開発のメリット
自分の思い通りの機能を導入できる
フルスクラッチ開発の一番のメリットと言える部分です。
既存の自社システムに連携したWEBサイトを構築したり、完全オリジナルの機能を開発したり、自分の要望に合わせた思い通りの機能を導入することができます。
他の方法では利用するCMSやサービスによってある程度の制限を受けるので、完全に自分の要望通りにするのは不可能です。
簡単にコンテンツの制作や更新可能
オリジナルの管理画面を作ってもらうことにより、コンテンツを簡単に制作・更新することができます。
後述する既存CMSでは管理画面の仕様は選択したCMSによりますが、フルスクラッチ開発ではここも思い通りに開発してもらうことができます。
機能追加や保守に対応しやすい
システムは一度開発して終わりではありません。
追加したい機能が後から出てきたり、予期せぬバグやエラーを解消したり、継続した対応が必要になってきます。
フルスクラッチ開発の場合は、開発元がシステムの内容を全て把握しているため、機能追加や保守対応がやりやすいです。予算や納期に応じて柔軟に対応してくれるでしょう。
フルスクラッチ開発のデメリット
開発に最も時間と費用が必要
フルスクラッチ開発の一番のデメリットと言える部分です。
ゼロから開発するので、最も時間と費用がかかります。
例えば、ECサイトのフルスクラッチ開発は制作期間は6〜8ヶ月、費用は500〜数千万円が相場です。
これだけの時間と費用を許容できる会社はかなり限定的なため、誰にでも選択できる方法ではないのが実情です。
高度な知識とスキルが必須
ゼロから開発するので、非常に高度な知識とスキルが必須です。
フルスクラッチ開発を外注する場合は、必ず開発実績や担当者の印象を見て、要望に合ったWEBサイトを確実に制作できる会社を選びましょう。
フルスクラッチ開発は独自性が高いぶん、一度外注すると追加発注もその会社へ行うことが多いです。
開発において『技術的負債』という言葉がありますが、技術力や対応に不満のある会社と取引してしまうと、その『技術的負債』を抱えたWEBサイトを運用していくハメになります。
フルスクラッチ開発がおすすめな人
フルスクラッチ開発は必要な費用が多いだけに、数百万円〜数千万円のまとまった予算で、時間をかけても完全オリジナルのWEBサイトを作りたい人だけにしかおすすめできません。
大抵のWEBサイトであれば他のパターンで代用できるので、基本的には後述する他のパターンを検討することをおすすめします。
フルスクラッチ開発についてもっと詳細に知りたい方は『スクラッチ開発とは?意味やメリット・デメリットをまとめてご紹介!!』を参考にしてください。
パターン2:既存CMSを使って作成
制作方法 | 制作費用 | 制作期間 | メリット | デメリット | おすすめな人 |
既存CMSを使用 | 自作:無料〜2万円 外注:数十万〜数百万円 | 数ヶ月 | ・簡単にコンテンツの制作や更新可能 ・プラグインを使えば簡単に機能を追加可能 ・情報が多いため安心して利用できる | ・ページの表示速度が速くはない ・高度な開発には知識とスキルが必須 ・セキュリティリスクがある | ・慣れているCMSがある人 ・ブログやオウンドメディアを作成したい人 ・数十万円〜数百万円でオリジナルのWEBサイトを作りたい人 |
CMSとはContents Management Systemの略で、文字通りWEBサイトのコンテンツを構成する要素(テキストや画像、レイアウト情報 など)を一元管理できるシステムのことです。
世の中に既に流通しているCMS(以後、既存CMSと呼ぶ)を使ってWEBサイトを作成することで、フルスクラッチ開発よりコストを抑えることが可能です。
既存CMSは、主にオープンソース型とパッケージ型に分けられます。
オープンソース型CMSは世界シェアNo.1のWordPressを筆頭に、Joomla!、Drupal、Concrete5 などがあり、ライセンス費用がかからないため安価に導入できます。
パッケージ型CMSはHeartCore、NOREN、Sitecore、Adobe Experience Manager などがあり、システムベンダーのサポートや保証が受けられます。
既存CMSを使って作成するメリット
簡単にコンテンツの制作や更新可能
各種CMSには、管理画面内でコンテンツを簡単に制作・更新できる仕組みが備わっています。
使い心地はMicrosoft Wordのような文書作成ソフトに近く、プログラミングに関する知識がなくても大丈夫です。
不慣れなうちは使いにくく感じかもしれませんが、慣れてしまうと非常に扱いやすいく、スムーズにコンテンツを制作していくことができます。
プラグインを使えば簡単に機能を追加可能
既存CMSには、機能拡張用のプラグインが数多くあります。
WordPressであれば、問い合わせフォームを簡単に作成できるContact Form 7やエディターを拡張できるAdvanced Editor Toolsなどはとても有名ですね。
少し知名度が低いプラグインでも、ある程度の更新頻度やダウンロード数があるものは有用な場合が多いです。
ただし、プラグインは稀に他の機能に干渉してバグを起こしたり、入れすぎると動作が遅くなる原因になったりするので、必要以上に入れることは避けた方が無難です。
情報が多いため安心して利用できる
WordPressのようなオープンソース型CMSは、ネット上に非常に多くの情報が公開されています。
何かトラブルが起きたとしても、基本的には誰かが解決策をネットに公開しているため、初心者から上級者まで安心して利用できます。
また、ほとんど日本語の情報で解決できることも嬉しいポイントです。筆者もWordPressのバグで英語の情報を参照したことは殆どありません。
一方、パッケージ型CMSではシステムベンダーからサポートが受けられるため、自分で解決できない問題が発生したらサポート窓口に相談することができます。
このように、CMSには情報が多いため、誰でも安心して利用できるでしょう。
既存CMSを使って作成するデメリット
ページの表示速度が速くはない
後述する静的サイトと比較するとやり取りするデータ量が多くなるので、ページの表示速度は遅くなります。
ただ、必ずしも遅いかと言うとそうではありません。
例えば、WordPressでは画像データを軽量化するプラグイン(EWWW Image Optimizer)や、ページをキャッシュするプラグイン(WP Fastest Chache)などを使うことによって、サイトの表示速度を改善することができます。
このような対応を行えば、サイトの表示速度はかなり改善されます。
速くはないけど、やりようはあるということです。
高度な開発には知識とスキルが必須
プラグインを使っても実現できない高度な開発には、プログラミングやCMSに関する知識とスキルが必須です。
あまり知識を持たずに開発しようとすると、最悪の場合サイトが表示されなくなるなどのトラブルになるので注意してください。
プラグインで実現できない高度な開発を必要とする方は、信頼できるプロに依頼することをおすすめします。
セキュリティリスクがある
どのWEBサイトにも共通することではありますが、悪意のあるユーザーから狙われる可能性があります。
リスクを過剰に怖がる必要はありませんが、WordPressであればSiteGuard WP Pluginなどを使ってセキュリティリスクは低減させるようにしましょう。
ちなみに、セキュリティリスクではありませんが、問い合わせフォームを持つWEBサイトには結構な量のスパムメールが来たりします。
こういう運営上のストレスについても、バリデーションを構築するなどで低減させるのがおすすめです。
既存CMSを使って作成することがおすすめな人
慣れているCMSがある人
慣れているCMSがある人には無論おすすめです。
コンテンツを一元管理するという性質上、どのCMSでも大枠の機能や構造は似ています。
従って、もし慣れているものとは別のCMSを導入する場合でも、学習コストは低くなります。
何か慣れているCMSがある人は、既存CMSを積極的に検討すると良いでしょう。
ブログやオウンドメディアを作成したい人
ブログやオウンドメディアを作成したい人には、特にWordPressを利用することがおすすめです。
WordPressはブログやオウンドメディアに必要な機能を網羅しており、オープンソースであるため料金は無料。有料テーマとレンタルサーバーを使っても、数万円で本格的なものを作ることが可能です。
ちなみに、はてなブログやアメブロなどで作成する方法もありますが、本格運用するのであればやはりWordPressを使って立ち上げておきましょう。
数十万円〜数百万円のまとまった予算でオリジナルのWEBサイトを作りたい人
主に法人向けの話ですが、数十万円〜数百万円のまとまった予算でWEBサイトを作りたい人は、既存CMSを使ったWEBサイト制作をプロに依頼することがおすすめです。
プロに依頼すれば、オリジナルのデザインやカスタマイズされた管理画面の運用や、SEO対策を講じた本格的な集客にも対応可能です。
CMSについてもっと詳細に知りたい方は『CMSとは?WordPressなど代表的なCMSの種類を一覧で解説!!』を参考にしてください。
パターン3:HTML・CSSなどのコードを書いて静的サイトを作成する
制作方法 | 制作費用 | 制作期間 | メリット | デメリット | おすすめな人 |
静的サイト | 自作:勉強費用 外注:数万〜数十万円 | 数週間〜数ヶ月 | ・ページの表示速度が速い ・セキュリティリスクが低い ・大量アクセスに強い | ・制作や更新に知識・スキルが必要 ・ユーザーごとに異なる情報を表示できない ・情報更新に手間がかかる | ・1ページだけのWEBサイトをオリジナルで作りたい人 ・自力でのWEBサイト作りに興味がある人 |
HTML・CSSなどのコードを書いてサイトを作成する方法で、表示内容が固定されることから『静的サイト』と呼ばれます。
静的サイトでは、「いつ」「どこで」「誰が」見ても同じ情報が表示されることが特徴です。(今までご紹介したパターン1, 2では、条件に応じて表示内容を変えることができる動的サイトを制作しています。)
基本的には、最初から静的サイトを前提として考えるのはおすすめしません。
理由としては、デメリットに記載している『情報更新に手間がかかる』ことが挙げられます。
他のパターンを検討し、それでも静的サイトが良いという時に利用すると良いでしょう。
静的サイトのメリット
ページの表示速度が速い
静的サイトのメリットは何と言ってもページの表示速度が速いことでしょう。
Googleは以下のように、読み込み時間が長ければ長いほど離脱率が上昇することを報告しており、オンライン上では現実の何倍も時間にシビアでなければなりません。
読込時間1~3秒:離脱率32%上昇
読込時間1~5秒:離脱率90%上昇
読込時間1~6秒:離脱率106%上昇
読込時間1~10秒:離脱率123%上昇
(thinkwithgoogle.com を参照)
表示速度が速いというのはそれだけで非常にメリットがあります。
セキュリティリスクが低い
静的サイトにはそもそも固定した表示内容についての情報しかありません。
従って『悪意のあるサイトへ誘導される』『サイトの情報を書き換えられる』ということ以外、主だったセキュリティーリスクはありません。
動的サイトが悪意のあるユーザーから攻撃された場合は、管理画面のパスワードが解読されるなどより高いリスクがありますが、静的サイトは比較的安心と言えるでしょう。
大量アクセスに強い
静的サイトでは『サーバーに情報をリクエスト → 情報がレスポンスで返される → 表示する』という単純な処理しか行われないため、サーバーに負荷がかかりにくく大量アクセスに強いです。
サーバーダウンも起こりにくいため、そこはメリットと言うことができるでしょう。
静的サイトのデメリット
制作や更新に知識・スキルが必要
制作や更新には、少なくともHTML・CSSのスキルは必要となります。
FTPソフトとテキストエディタを準備して制作や更新することになるので、ある程度の知識やスキルは必要になってきます。
そもそも、定期的に更新が必要なページに静的サイトは向いていませんが、触る必要がある場合は最低限のHTML・CSSの知識やスキルは身につけると良いでしょう。
ユーザーごとに異なる情報を表示できない
静的サイトは表示内容が固定されるため、ユーザーごとに異なる情報を表示するようなWEBサイトにはできません。
また、動的サイトであれば可能な会員登録も、静的サイトではできません。
静的サイトできるのはJavaScriptを使って動きをつけることくらいなので、静的サイトで無理なことは動的サイトにして実現する必要があります。
とは言え、静的サイトから動的サイトへの変更は可能なので、最初から作り分けておく必要はありません。
情報更新に手間がかかる
静的サイトでは情報をリアルタイムで更新できません。
例えば、「弊社は創業10年」という文字列を入れたとしましょう。
1年経過した後、「弊社は創業11年」という文字列に変更する必要がありますが、静的サイトではこれを手動で入力するしか更新の手段がありません。
また、新しい要素を追加する場合、管理画面が存在しないので、コードをいちいち書いて更新するため手間がかかります。
一方、動的サイトであれば、計算する関数を作って呼び出すことで文字列を自動更新することが可能で、新しい要素を追加するときも管理画面からの追加で完了します。
静的サイトがおすすめな人
ランディングページなどの1ページだけのWEBサイトをオリジナルで作りたい人
ランディングページなどの1ページだけのWEBサイトをオリジナルで公開したい場合は、静的サイトで作ると良いでしょう。
ただし、ページ内に更新頻度の高い要素を入れる場合は、動的サイトにしておく方がおすすめです。
ちなみに、静的サイトを作ったあとで、動的サイトに変更することは可能です。
従って、まず静的サイトで作って、問題があれば動的サイトに組み込むという方針で問題はないでしょう。
自力でのWEBサイト作りに興味がある人
「勉強用で自力でWEBサイトを作りたい!」という方はまず静的サイトから始めるのがおすすめです。
プログラミングを学ぶときは、大体「Hello, world!」 やそれに類する文字列を画面に表示することから始めるのですが、静的サイトではそういったハードルの低いところから試していくことができます。
ただ、急に作り始めるのではなく、ProgateなどでHTML・CSSのことをある程度学んだ上で着手することをおすすめします。
パターン4:ホームページ作成サービスを利用する
制作方法 | 制作費用 | 制作期間 | メリット | デメリット | おすすめな人 |
作成サービス | 自作:数千円 外注:数万〜数十万円 | 数日〜数週間 | ・専門的な知識やスキルが不要 ・外注よりはるかに安くホームページを作れる ・完成〜公開までの速度が速い | ・デザインがある程度決まっている ・機能の拡張性に制限がある ・本格的に使うなら月額課金になる | ・労力とコストを最小限に抑えたい人 ・デザインや機能の制約が問題にならない人 ・早くWEBサイトが必要な人 |
ホームページ作成サービスは、インターネット上でWEBサイトを作成・公開できるサービスです。
サービスの事業者はASP(Application Service Provider)とも呼ばれ、ホームページのASPとしてはペライチやジンドゥー、STUDIOなど、ECサイトのASPとしてはShopifyやSTORES、BASEなどがあります。
一昔前はホームページ作成ソフトがこの位置を占めていたのですが、今はより便利なホームページ作成サービスが主流です。
サーバーやドメインを自分で用意する必要がなく、簡単な操作で制作を進められるので、初心者にはおすすめの作り方です。
(なお、ホームページ作成サービス内のシステムはCMSに分類されますが、ここではサービスとしての性質を優先してホームページ作成サービスという分類を使っています。)
ホームページ作成サービスのメリット
専門的な知識やスキルが不要
ホームページ作成サービスは、直感的な操作で誰でも簡単に利用可能です。
また、サポート体制も充実しており、わからないことがあれば窓口に問い合わせることも可能。
専門的な知識やスキルは不要で、初心者でも簡単に制作することができます。
外注よりはるかに安くホームページを作れる
ホームページ作成サービスは月額数千円から利用することができます。
WEBサイトを作るスキルがなければ通常は外注を検討することになりますが、その場合はどれだけ安くても数万円は必要です。加えてレンタルサーバーを借りる場合は、別途月額のサーバー代も必要です。
外注よりはるかに安くホームページを作れることは大きなメリットでしょう。
ただし、長期的に見ればWEBサイトを外注する方が安い場合もあるので、事前に試算しておくことをおすすめします。
完成〜公開までの速度が速い
ホームページ作成サービスは、豊富に用意されているテンプレートを使うことによって、公開までの速度をかなり速められます。
例えば、1ページのみのランディングページを作るとして、テンプレートを活用すれば即日公開することも可能です。
普通にコードを書いて制作する場合もコピペ等で時間短縮できますが、単純なコピペだけで進められるわけではなく、ホームページ作成サービスほどの速度で開発するのは難しいです。
こういった大胆な時間短縮は、ホームページ作成サービスならではだと言えるでしょう。
ホームページ作成サービスのデメリット
デザインがある程度決まっている
ホームページ作成サービスはある程度決まったレイアウトを基に、画像やテキストを入れていくことになります。
従って、利用するサービスごとにある程度決まったデザインになってしまいます。
ただし、デザイン自体の完成度は高いので、決まった型さえ許容できれば大きく問題になることはないでしょう。
一度各サービスの公式ページに掲載されいてる制作事例を見て、デザインを許容できるか検討してみると良いでしょう。
機能の拡張性に制限がある
サービスに導入されていない機能は使えないので、拡張性に制限があります。
とは言え一般的なWEBサイトで使われる機能は網羅されており、最低限の機能だけを必要としている場合はあまり問題にはなりません。それ以上の機能を望む可能性がある場合は、物足りなくなることがあるということです。
「ホームページ作成サービスを使ったが、望んでいる機能がなくて困っている」というのはありがちな悩みなので、検討しているサービスの機能は事前にしっかりとチェックしておきましょう。
本格的に使うなら月額課金になる
大抵のサービスには無料プランが存在しますが、本格的に使おうとするとほとんどの場合は月額課金が必要です。
月額料金は数千円程度からですが、自分の運用期間を想定して事前に費用の試算をしておくことをおすすめします。
ちなみに、他のパターンを検討したとしても、レンタルサーバーを借りる場合はそこで月額料金が発生します。余程大規模な開発をしない限りは、中期的にはホームページ作成サービスの方が料金は安く済む傾向があります。
ホームページ作成サービスがおすすめな人
労力とコストを抑えたい人
ホームページ作成サービスでは、豊富なテンプレートや安価な料金設定で、労力とコストを抑えて運用していくことが可能です。
実際、ホームページ作成サービスのほとんどの制作事例は、労力とコストを抑えたい中小規模の会社です。(ECサイトの場合は、開発費用と時間がかかるぶん、大企業の利用事例もあります。)
「事業を始めてまとまった資金がない」「WEBサイトがとりあえず必要」という場合は、非常におすすめです。
デザインや機能の制約が問題にならない人
ある程度決まったデザインや機能でも、完成度が高ければ問題ないという場合は、ホームページ作成サービスはおすすめです。
最近はどのサービスも改善が進んだため、デザインがある程度決まっていると言っても、ホームページ作成サービスだと気づかないクオリティのWEBサイトも存在します。豊富なテンプレートを利用することで、簡単に高品質なWEBサイトを作ることも可能です。
一方で、機能については注意が必要です。サービスに導入されていない機能は使えないので、拡張性に制限があります。これを念頭に置いて、十分に検討してから使うことをおすすめします。「ホームページ作成サービスを使ったが、望んでいる機能がなくて困っている」というのはありがちな悩みです。
早くWEBサイトが必要な人
とにかく早くWEBサイトが必要という緊急性が高い人も、ホームページ作成サービスを作ると良いでしょう。
特にテンプレートを使うとかなりの時間短縮が可能です。普通にコードを書いて制作する場合もコピペ等で時間短縮できますが、ホームページ作成サービスほどの速度で開発するのは難しいです。
コンテンツ量さえ多くなければ、数日もあればサイトを公開できます。
ホームページ作成サービスについてもっと詳細に知りたい方は『【ノーコードでWEBサイト作成】ホームページ作成サービスおすすめ10選』を参考にしてください。
まとめ
WEBサイトの作り方の4パターンの詳細を紹介してきましたがいかがだったでしょうか?
それぞれのメリット、デメリットがわかったことにより、自分のニーズに合った作り方が見えてきたのではないかと思います。
これらの情報を基に、あなたにとってベストなWEBサイトを選択いただければ、筆者として大変嬉しく思います。
株式会社Abentryでは上場企業から中小企業まで様々な業種で得た
ノウハウをもとにWEB制作を行なっています
・自社のホームページを立ち上げたい…
・今のサイトを本格的にリニューアルしたい…
・実績のある制作会社に依頼したい…
専門の担当者が貴社のWEBサイトを改善します!
まずはお気軽にご連絡ください(問い合わせ無料)
WEB制作の流れを詳細に知りたい方は『【プロが教える】WEB制作の流れとは?公開までの5ステップを徹底解説!』を参考にしてください。