文系新卒1年目が3ヶ月で会社HPをリニューアルした6つのステップ

文系新卒1年目ですが、会社HPのリニューアルをしました

こんにちは。
株式会社アントレプレナーファクトリーでWebマーケティングを担当している宮地誠心です。

現在新卒1年目最後の1ヶ月。まだまだ毎日勉強の日々です。


文系新卒1年目の私ですが、20189月に「会社HPのリニューアル」を任され、外部のパートナーさんの力を借りながらもほぼ自力で、3ヶ月でHPをリニューアルすることができました。

今回はHPリニューアルのステップを6つに分けて解説していこうと思います。

 

HPリニューアルを社内でしたいけれど、エンジニアがいなくて保留となっている会社でもHPリニューアルできますので、ぜひ参考にしてみてください。

 

文系新卒1年目が3ヶ月で会社HPをリニューアルした6つのステップ

HPリニューアルは、ざっくり以下の6つのステップに分けることができます。

①目的を決める
②WordPressテーマの決定
③サイトマップ・ワイヤーフレームの作成
④外部パートナーさんへ依頼
⑤調整作業
⑥公開作業

各ステップともに、しっかりと考えたり、作業したりする必要のある重要なステップです。

ステップ①目的を決める

まずは、HPリニューアルの目的を決めます。

なぜわざわざ時間とお金をかけてHPをリニューアルするのか?

目的を明確化しておかなければ、リニューアル前と同じような構成になってしまったり、リニューアルデザインにブレが生じてしまったりします。

今回は、コンテンツマーケティングによりインバウンドでの集客を増加させるため、情報が古くなったHPを心機一転のリニューアルを図りました。

WordPressテーマの決定

目的が決まった後は、WordPressテーマの決定です。

コンテンツマーケティングを実施していくためのサイト作りで必要なのはCMSContents Management System)です。

システムごと外注する予定がなければ、基本的にWordPress1択です。

ちなみに現在世界約30%のサイトはWordPressでできていると言われており、日本のCMSシェア率に限れば、80%以上を占めていると言われています。

enfacWordPressHPを作成しておりますので、新しいテーマを選ぶところからスタートしました。

企業HPでの利用となると、機能の豊富さやテンプレートの種類、カスタマー対応などの観点から有料テーマの購入をオススメします。

色々なデモサイトを見てイメージに近いかどうかで候補を挙げ絞り込んでいきましょう。

またこの段階から、欲しい機能がウィジェットというツールであらかじめ導入されていれば、それも評価に入れます。

今回のHPリニューアルでは、「kalium」というテーマを購入し利用することとしました。

kaliumはこちらから(https://www.kaliumtheme.com/)

国産のテーマはこちらのサイトでかなり網羅されています。

https://www.webtoolnavi.com/wordpress-theme-ja/

また、WordPressのテーマやプラグインに関する知識はこちらの本がオススメです。

http://ur2.link/un3v

③サイトマップ・ワイヤーフレームの作成

テーマが決まったら、サイトマップを作成していきます。

サイトマップとは、サイトの全体を表す地図のようなものです。

この地図無くしてサイトを立ち上げることは危険ですので、必ず作成します。

(上画像のようにサイトの骨組みを書き出していきます)

サイトマップの完成後、ワイヤーフレーム(Webページ作成時のレイアウト)作成に着手します。ここで、ある程度の文章も作り、当て込んでいきます。

(上の図の様に手書きで書いたり、イラストレーターやパワーポイントで作成していきます)

ワイヤーフレームを元に外部パートナーさんへ依頼をするので、この工程に一番時間をかけました。

④外部パートナーさんへの依頼

ワイヤフレームを作成した後は、外部パートナーさんへ依頼をします。

自社リソースに応じて、依頼内容は変わりますが、今回は元HPのデータ引っ越しと本番環境の実装を外部エンジニアさんへ、新HPのデザインと実装を2名のデザイナーさんへお願いしました。

ワイヤーフレームが作り込まれているほど外部パートナーさんが動きやすくなりますので、③サイトマップ・ワイヤーフレームの作成は、ディスカッションしたり競合を調査したりするなどしてしっかりと磨き込みましょう。

⑤調整作業

外部パートナーさんの作業が一旦完了し、イメージとの調整作業に入ります。

自分のできること、任せることをはっきりして、スピーディーに修正依頼をします。

⑥公開作業

最終調整が完了すれば、公開作業に移ります。

公開時間に決まりはありませんが、なるべく閲覧者が少ない夜遅い時間帯にした方が良いですね。

 

公開後のチェックリスト

HPリニューアルは公開で終わりではありません。

必ず公開後なんらかの不具合が生じますので、その後フォローをしていくこととなります。

HP公開後の見ておくべきチェックリストをまとめました。参考にしてみてください。

①エラー対応:スピード

サイトスピードを確認しましょう。サイト作成時にも測ることはできますので、サイトスピードの対応を公開前か後にするのかは検討してみてください。

サイトスピードが1秒落ちるごとにCVR7%以上落ちると言われています。コンテンツマーケティングを展開するメディアにとってサイトスピードは、検索順位と同じくらい重要です。

今回のHPリニューアルでは、サイトスピードがPC36」・スマホ「1」という数字を叩き出してしまったので、急いで外部パートナーさんへ依頼し改善してもらいました。

結果10数秒かかっていた表示速度が3秒以内に短縮されました。

サイト表示に6秒以上かかっているサイトは改善を早急に検討した方がいいでしょう。

②デザイン改修

サイトを公開して、改めてざっと見渡すとデザインのズレや反映漏れがあります。

デザインの微修正を行います。

③サーチコンソールのサイトマップ再申請・エラー対応

最後にサーチコンソールのサイトマップの再申請とエラー対応です。

HPをリニューアルしたことをサイトマップ再申請により、Googleの検索結果を最新のものへアップデートすることができます。

 

HPリニューアルを通じて学んだ仕事の進め方。「全体像設計」と「パラレルに進めること」の重要性

重要な実装に関しては、外部の方のお力を借りることとなりますが(外部パートナーの皆様本当にありがとうございました!!)、「全体像設計」と「パラレルに進めること」ができれば、文系新卒1年目でも会社のHPリニューアルを実施することは可能ということを証明することができたと思います。

特にサイトリニューアルは、最初の全体スケジュールの解像度を上げていくことが最重要項目です。そして作成されたスケジュールをパラレルに進めていくことも同じく重要項目です。

サイトリニューアル系は、しばらくないと思いますが、今回痛感した仕事の進め方は全てに共通するものですので、習熟したいと思います(なかなかどうしてマスターするのは難しいですが)。

 

また、HPリニューアルを通じて、より会社の理念やミッションと触れ合うことができ、帰属意識が高まり仕事の軸というものが定まったように感じます。

 

enfacラーニングBLOGでは、日々役立つ情報を更新していきます。

ここまで読んでいただきありがとうございます。

enfacラーニングBLOGでは、動画を使った学習「動画ラーニング」を軸に情報を発信していきます。

またenfacでは、「起業家教育・企業内教育のコンテンツを生み出し、新しいラーニングテクノロジーを用いて、人と組織の成功を加速させる」のもと、コンテンツメーカーとして多くの起業家や企業に役立つコンテンツを提供しております。(コンテンツ一覧はこちら

最新の知識を、動画で低コストに手軽に実装できます。

私が担当している『起業の科学』執筆者 田所雅之氏 出演の「enfacスタートアップサイエンス」もぜひご覧ください。

 

自社で動画を使った研修を検討されている方は、ぜひお気軽にご相談ください。

お問合せはこちらから