ホームページ制作
PR

自分でつくるワードプレスを使ったホームページ制作の手順

自分でつくるワードプレスホームページ制作の手順
hisashi_demo
記事内に商品プロモーションを含む場合があります

「お金をかけずにホームページを作りたい」

そう思って、ワードプレスを使ったホームページ制作に挑戦しようとしていますか?

自分でホームページを作ろうと、色々調べたりしていますか?

ホームページは自分で作れます。大丈夫です!

ぼくはこのブログをワードプレスを使って自分で作りましたし、このサイト以外にもいくつもホームページを作ってきました。

ワードプレスを使えば、プログラミングを覚えなくても簡単に自分のホームページを作ることができるんです!

のざき寿
のざき寿

こんにちは、のざき寿(ひさし)といいます。

前職はホームページ制作会社でWebエンジニア(WordPress制作)をしていました。

Webライターとしても活動しています。

「ワードプレスを使えば簡単にホームページを作れます!」と言いましたが…

とはいえ..パソコンが得意でない方にとっては、何から手をつけたらいいかわからないですよね。

あなた
あなた

ホームページ制作の全体像がわからないけど…とにかく手を動かしてみよう。

それでもいいんですが、やはり、わからないまま進んでいくのは効率が悪いし間違った方向に行っていても気がつけない可能性が高いです。

ぼくは以前、ホームページ制作会社に勤務していました。ワードプレスを使った中小企業のWebサイト制作を50社ほど経験しています。なのでお伝えします。

のざき寿
のざき寿

ホームページ制作会社では、いきなりデザインやブログラミングをすることはありません。

そういった制作業務の前に、情報整理や設計などの入念な下準備をします。

準備をしないで制作を始めてしまうと、のちに大幅な変更がでてしまったときに制作のやり直しが発生してしまう可能性があるからです。

お金と時間を失ってしまいます。

個人でつくるホームページ制作も一緒です。情報整理と設計をしっかり行なってからの方がいいと思います。

そこでこの記事では、ぼくがホームページ制作会社で学んだ「ホームページ制作の制作工程」を紹介します。

ちょっと専門的なことも出てきますが、制作を簡単にするお助けアイデアも紹介しますので、

ぜひ、最後までご覧ください。

のざき寿(ひさし)
のざき寿(ひさし)
元Webエンジニア
Profile
Webライター・ブログ運用などで活動しています。現在介護職員。ホームページ制作会でWordPress・Webエンジニアをしていました。元よしもとの元お笑い芸人。
プロフィールを読む

ホームページ制作の制作工程

のざき寿
のざき寿

ではさっそく、制作工程を解説していきますね。

設計の工程

ホームページを作る目的を明確にする
  • ターゲットを定める
  • 何を伝えるホームページなのか
ホームページに載せる情報を整理をする
  • 事業内容
  • メッセージ
  • 所在地など

ドメイン・サーバーなどの準備も進めていきます。

ホームページのページ構成を決める

サイトマップを決めて、ホームページのページ構成を考えます。

ホームページへの集客方法も考えていきます。

トップページの設計をする

ホームページの顔になる、トップページのレイアウトやコンテンツのアイデアを考えます。

下層ページのレイアウトを考える

トップページから移動できる下層ページの構成を考えます。

のざき寿
のざき寿

ここまでが設計フェーズ(工程)になります。

次は制作フェーズです。

制作の工程

ライティングをする

ホームページに掲載する文章を考えていきます。

  • キャッチコピー
  • Webライティング
デザインコンセプトを決める
  • メインカラーやサブカラーなどを決める
  • フォントなどの選定
トップページのデザインをする

トップページの設計書をもとに、デザインを作っていきます。

コーディング

ホームページをインターネットで閲覧できるようにしていきます。

  • サーバーにワードプレスをインストールします。
アクセス解析などの設置

ホームページのアクセスを計測するために、Googleアナリティクスを導入していきます。

不具合の調整など

ホームページを公開する前に、不具合がないかなどチェックしていきます。

ホームページ公開

ホームページ公開!おめでとうございます!

お疲れ様でした!

のざき寿
のざき寿

ホームページ制作には、このうような制作工程があるんですね。

この工程は、ホームページ制作会社で行われている実際の工程に基づいています。

ちょっと…大変そうに感じますか?

それとも出来上がるホームページを想像して、ワクワクしてきませんか?

ホームページの設計とは

のざき寿
のざき寿

では、設計の工程から解説していきますね。

ホームページの設計とは
  1. ホームページを作る目的を明確にする
  2. ホームページに載せる情報を整理をする
  3. ホームページのページ構成を決める
  4. トップページの設計をする
  5. 下層ページのレイアウトを考える

では、ひとつづつ解説していきますね。

ホームページを作る目的を明確にする

まず、ホームページを作る目的を整理します。

ホームページ制作の目的になること
  • 集客・認知
  • 販売
  • お問い合わせの獲得

何を、ホームーページの成果にするかを決めていきます。

その上で、目的に応じたホームページの形式を選択していきます。

目的が整理できたら、つぎはホームページのコンセプトを考えていきましょう。

コンセプトを作るために考えること
  • 誰に(お客さん)
  • 何を(商品・サービス)
  • どのように(見せ方や伝え方)

ターゲット・ペルソナを明確にして、「3C分析」などを使って自分の商品を分析することから始めます。

たとえば、ぼくのこのブログだったら、

たとえばこのブログのコンセプトは…

「(誰に)個人ブログを立ち上げたい人へ」「(何を)ブログの作りかた方を」「(どのように)体験談を交えて」

というブログコンセプトになっています。

こうしたコンセプトを軸に、ホームページを形にしていくんですね。

ポイントは自分の伝えたいことではなく「お客さんが知りたいことはなんなのか」を考えていくことが大切だと思っています。

のざき寿
のざき寿

あなたは、どんなホームページをつくりますか?

お客さんを楽しませられるホームページがいいですよね。

ホームページに載せる情報を整理をする

ホームページにはどんな情報を載せますか?

とりあえず…

思いつく限りの情報を洗い出していきましょう!

情報整理を整理の項目
  • 事業者名
  • 所在地
  • 事業内容
  • サービス紹介
  • 活動内容
  • 企業メッセージ

個人事業主で事業をしている場合でも、これらの項目を洗い出しておくといいですよ。

ホームページ制作会社では、これらの情報はエクセルのシートにまとめていきます。

ホームページの情報整理について詳しく知りたい方は、こちらの記事を参考にしてくださいね。

また、この時点で「独自ドメイン」「レンタルサーバー」の契約も進めていきます。

独自ドメイン・レンタルサーバーとは?

あなた
あなた

まだ設計の段階でしょ!?早くない?

って思うかもしれませんが、いざ制作に入ろうとした時に、

  • 使いたいドメインが、先に使われてしまっていて使えない。
  • レンタルサーバーの契約に思ったより時間がかかってしまった

みたいなケースが制作会社ではよくあるので、先に契約を進めていくことがあるんですね。

ページの構成を決める

のざき寿
のざき寿

情報整理で洗い出した内容をもとに、

「どんなページをつくる」かを設計していきます。

一般的なホームページの構成
  • トップページ
  • 会社概要
  • 所在地・地図
  • 事業内容・サービス概要
  • 企業メッセージ(理念・ミッション)
  • 会社沿革
  • 採用情報
  • お知らせ(更新コンテンツ)
  • お問い合わせ(送信フォームの設置)

中小企業のホームページは、だいたいこのようなページ構成になっています。

のざき寿
のざき寿

ホームページ制作会社では、サイトマップと言います。エクセルを使って表にして管理していきます。

トップページ以外を「下層ページ」と言います。

だいたい、10ページ前後ですね。

ページを分けてホームページをつくることが一般的ですが、個人事業主の場合はそれほど情報量がないので、ランディングページのように一枚のページで構成することもあります。

また、個人ブログの場合は、更新するコンテンツが中心です。ブログ型のページ構成を知りたい方は、こちらの記事を参考にしてみてください。

トップページの設計をする

のざき寿
のざき寿

設計の最後の工程は、トップページ設計図を書くことです。

ホームページにおいて、トップページはもっとも重要なページです。

トップページはすべての下層ページへの動線になるように設計していきます。

トップページ構成
  1. ロゴ
  2. グローバルナビゲーション
  3. メインビジュアル
    • キャッチコピー
    • リードコピー
  4. 企業メッセージ
  5. サービス内容
  6. 新着のお知らせ
  7. 採用情報
  8. お問い合わせ

ホームページを通じて、強調したいコンテンツを目立たせるように構成していきます。

ユーザーは「サービス内容」が知りたいと思うので、サービス内容のコンテンツを充実させていきましょう。

トップページで紹介するのは、各ページの概要だけにとどめておき、下層ページへリンクするように設計していきます。

のざき寿
のざき寿

ホームページ制作会社では、フォトショップなどのデザインツールを使ったりします。

ワードやエクセルでも構いませんし、個人でつくるホームページなら紙と鉛筆で手書きしても構いません。

ブログのトップページの構成を知りたい方は、こちらの記事を参考にしてみてください。

ホームページの制作とは

のざき寿
のざき寿

それでは、制作の工程の解説です!

ホームページの設計とは
  1. ライティングする
  2. デザインコンセプトを決める
  3. トップページのデザインをする
  4. コーディング
  5. アクセス解析などの設置
  6. 不具合の調整など
  7. ホームページ公開

ここからはどんどんホームページが形になっていきます。

ライティング(Webライティング)

設計図をもとに、トップページから文章を書いていきます。

ホームページのライティングは、Webライティングを意識して文章を書いていきます。

Webライティング(SEOライティング)とは、Googleの検索エンジンに対して、ホームページが検索上位に表示されるように文章を書く技法です。

会社概要やサービス内容などを伝えることよりも、ユーザーに対して何を伝えるかを意識して文章を構成していきます。

いまいち書き方がわからないと言う方は、他のホームページを参考にするかランディングページの構成を参考にしてみてください。

デザインのコンセプトを決める

デザインのコンセプトに必要なことは、まず「かっこいい・かわいい・やわらかい」などの形容詞を決めます。

その形容詞に合う、パーツや要素を考えていきます。

デザインコンセプト
  • フォント
  • カラー
    • メインカラー
    • サブカラー
    • アクセントカラー
  • 装飾などのあしらい
  • ロゴ
  • 写真やイラストの選定

細かいパーツなど、ホームページで使う素材を集めていきます。

トップページのデザインをする

デザインコンセプトをもとに、トップページのデザインをしていきます。

のざき寿
のざき寿

ぼくはデザイナーではないので、デザインの方法に関しては詳しく伝えることができません…

ホームページ制作会社では、デザインの参考にしたいサイトを検索して、風合いを真似てデザイン制作したりします。

この参考サイトを探すことを「ベンチマーク」と言ったりします。

真似するだけで、コピーしたりしてはいけません。コピーして使用すると著作権の侵害にあたる可能性があるので絶対にやめましょう。

コーディングする

コーディングとは、デザインしたホームページをインターネットで閲覧できるようにプログラミングすることです。

プログラミングに必要な技術
  • HTML
  • CSS
  • JavaScript
  • PHP

これらのプログラミング言語を使って、ホームページを構築していきます。

そして、サーバーにアクセスしてホームページをインターネットで公開します。

公開の時に、ドメインとレンタルサーバーが必要になるわけです。

アクセス解析などの設置

ホームページにアクセス解析を設置することで、以下のようなデータが見れるようになります。

分析ツール
  • Googleアナリティクス(閲覧数などの計測)
  • Googleサーチコンソール(検索キーワードの調査)
  • Googleタグマネージャー(クリック数などの計測)

ホームページの運用・改善策を考えるために、データの分析を行なっていきます。

  • ホームページの訪問数
  • ホームページの滞在時間
  • 成果の件数

これらの成果を計測していきます。

アクセス解析の設置方法についてはこちらの記事を参考にしてみてください。

不具合の調整など

いよいよ最終段階です。

ホームページを公開する前に、不具合がないか・間違いがないか確認します。

公開前のチェック項目
  • 誤字脱字のチェック
  • レイアウト崩れのチェック
  • リンク切れのチェック
  • アクセス解析のチェック

公開前のチェックをしっかり行います。

ホームページ公開

のざき寿
のざき寿

設計・制作、本当にお疲れ様でした。

設計から制作までは、10ページ前後のホームページでも3ヶ月くらいの制作期間がかかります。

制作の工程を紹介してきましたが…

個人でここまで作業するのは現実的ではありません。

ぼくは、はじめに言いました。

「個人でも簡単にホームページを作ることができます!」って。

それを実現するツールが、ワードプレスです。

それでは紹介しますね!

ワードプレステーマ「JIN:R(ジンアール)」を使って

ワードプレスを使えば、ホームページ制作にデザイン・コーディングをしなくてもWebサイトができます。

今まで説明してきた制作工程のほとんどを、ワードプレスが担ってくれます。

ワードプレスには「ワードプレステーマ」という機能があります。

ワードプレステーマを使うと、ほぼデザインが完成された状態からホームページのカスタマイズができるので、大幅に制作工程を短縮することができるんですね。

ぼくがおすすめしているワードプレステーマは「JIN:R」です。

ホームページ制作で大切なこと

一番大切なことは、

  • 何のためにホームページをつくるのか
  • どんな成果を求めるのか
  • ホームページを公開した後どのような運用をするのか

これらのことを忘れてホームページ制作を進めてしまうと、想定とは違った出来上がりになり大切な時間とお金を無駄にしてしまいます。

ホームページ制作の全体像を理解しておくことは、目的達成の手助けになるでしょう。

不要な工程は省略するなどして、ぜひあなたの制作にお役立てください。

記事URLをコピーしました