サクッとHPを自作したい初心者のための、HP作成手順

自分自身も創業1年と独立間もないこともあり、創業したばかりの経営者の方や、起業準備中の方からいろいろと相談を受けることがあります。融資の件、銀行口座の件などいろんなテーマがありますが、そのなかでも多く相談を受けるのが自社HPに関することです。

もちろんビジネスモデルによってその必要性は異なりますが、自分のようにBtoBの事業をされる方にとっては、自社の信頼性向上のためにも、あるほうが良いと考えています。とはいえ創業初期のタイミングでここにあまりお金をかけすぎるのは避けたほうが良いので、できるだけ自作するのが好ましいでしょう。私も今回の起業ではじめて自作しました。

というわけで、HPを自作される初心者向けに、HPの作り方やそこで漏れがちなタスクなどを整理してみたいと思います。あくまでサイト制作をしたことがない人向けの基本的な内容ですので、ご容赦ください。。

HP制作の手順

今回は、レンタルサーバでWordPressのテーマを使って、比較的オーソドックスなHPを作成する、という想定で記載しています。まさに今ご覧いただいている当社のHPもそれに当たります。

手順1:ドメイン取得、サーバ構築

まずHPを作る際には、その住所となるドメインと置き場所となるサーバが必要です。ドメインは「お名前.com」などで空きドメインを調べてみてください。SEOや信頼性の観点で、できるだけ「co.jp」ないしは「jp」ドメインを取得することをおすすめします。ここであまり独自性を出す必要はありません。

サーバについては、「エックスサーバー」か「お名前.com」の安価なプランで良いと思います。SSLなども無料オプションがついているので、それを使いましょう。バックアップ取得も自動でできるように設定しておくと良いです。

手順2:WordPressインストール、テーマの購入

サーバの契約が終了したら、WordPressをインストールしましょう。上記のようなサーバであれば、数クリックで簡単にインストールすることができます。

次に、自分が作ろうとしているHPの完成図に近いテーマを探し、それを購入します。自分はTCDテーマを使いました。だいたい2万~3万円くらいで購入できます。

手順3:テーマのカスタマイズ

テーマを購入したら、インストールしたWordPressの管理画面にログインし、テーマファイルをアップロードしてください。これでHPのベースが完成しますので、そのうえで、画像やテキスト、カラーなどを自分のイメージに近づくようにカスタマイズしていきます。

初心者があまりテーマをいじりすぎるとおかしくなってしまうので、ゴリゴリにカスタマイズするというより、できるだけテーマに合わせたコンテンツ配置をしていくほうが無難です。

本来ならサーバ構築時にテスト環境と本番環境のふたつを作成しておくほうがベターですが、そこまでやるのは大変という方も多いでしょうし、そもそも新規ドメインであれば作成中で見られてしまうリスクも小さいので、本番環境のみでも良いかと個人的には思います。ただし、WordPress管理画面の表示設定で、「検索エンジンがサイトをインデックスしないようにする」にチェックを入れておきましょう。

手順4:サイト公開

カスタマイズが終了したら、サイトを公開します。といっても本番環境で構築している場合は、先の手順で説明した表示設定でチェックボックスを外せばOKです。

漏れがちタスクのチェックリスト

手順としては上記の通りなので、さほど難しくはないのですが、とはいえケアすべき周辺情報はたくさんあります。これらが漏れてしまうと運用面や集客面で期待する効果が出なかったりしますので、ここをしっかりつぶしておく必要があります。

問い合わせフォームの設置

CF7というプラグインで良いと思います。問い合わせ発生時のサンクスメールと通知メールの設定を忘れずにやりましょう。設定しておかないと問い合わせが来ても気づけません。また、Flamingoというプラグインを入れておけば、過去の問い合わせデータをWordPress管理画面上に蓄積しておくことができます。

Notionで問い合わせデータを管理したい場合は、「CF7 to Notion」というプラグインを入れることで、連携することができます。

スパム対策の実施

Google reCAPTCHAというツールを使うことで、スパムメールをブロックすることができますので、やっておきましょう。

Cookie取得同意の設置

GDPRはじめデータプライバシー法に準拠するために、Cookie取得同意のプラグインが必要です。「Cookie Notice & Compliance for GDPR / CCPA」あたりを入れておくと良いです。

セキュリティ対策の実施

WordPress管理画面は、初期状態ではURLが決まっているため、誰でも管理画面URLを推測できるようになっており、セキュリティ上リスクがあります。「SiteGuard WP Plugin」などを使い、管理画面のURLを変更しておくほうが良いです。

表示高速化

大きいサイズの画像や動画を多用すると、表示速度が悪化し、サイト閲覧時にストレスを与えてしまい離脱につながる可能性があります。「EWWW Image Optimizer」を入れて、WebP対応しておくことで、表示速度を改善することができます。

効果測定ツールの実装

GoogleAnalyticsを入れるのがいちばん良いですが、それすら難しければ、JetpackやWP Statisticsなどを使って簡易でも良いので基本的なトラフィックは計測できるようにしておきましょう。

ファビコン、OGPの設定

SNSで自社HPをシェアすることもあると思いますから、OGPをきちんと設定しておきましょう。同様にファビコンも設定しておくと良いです。もしロゴデザインを外注する場合は、ロゴデザインとセットでファビコンやOGPも依頼しておくと良いです。

SEO対策(基礎)の実施

できればGoogleサーチコンソールは入れて、サイトマップ送信やインデックスのリクエストはやりましょう。合わせて、「All in One SEO」などのプラグインを使って、各ページのtitleやdescriptionを設定しましょう。ここがしっかり対応されていないと、せっかくHPを作っても検索エンジンに存在を認識してもらうことができません。

自動バックアップの設定

サーバ側でのバックアップに加えて、WordPress上でもバックアップを取得しておくとベターです。「BackWPup」などのプラグインを入れておくと良いです。

ここまで記載した内容を、チェックリストにしておきます。

  • 問い合わせフォームの設置
  • スパム対策の実施
  • Cookie取得同意の設置
  • セキュリティ対策の実装
  • 表示高速化
  • 効果測定ツールの実装
  • ファビコン、OGPの設定
  • SEO対策(基礎)の実施
  • 自動バックアップの設定

まとめ

今回は、当社で使用したWordPressを使って自社HPを作る手順やチェックリストをまとめましたが、もちろんその他ツールでも構いません。ただ、どれを使うにしても、上記のようなチェックリストの対応が漏れてしまうと良くないので、自作する際にはぜひ気を付けていただければと思います。

当社では、新規事業の立ち上げ支援をメインとしていますが、新規事業を立ち上げる際にサービスサイトやLP制作は欠かせませんので、実はかなり多くのWeb制作案件も行っています。今回のようなWordPressでのHP制作などももちろん対応可能ですので、お困りごとがあれば、ぜひお気軽にご相談ください。

関連記事