ホームページを自分で作る際のポイント４つ

こんにちは。シレオクリエイト立川です。

今回は「ホームページを自分で作ってみよう！」と決意をしてみたものの、何から手をつけていいかわからないという方に向けて、作成する際に気をつけるポイントをご説明いたします。

あくまで自作をする場合のポイントで、プロがお客様のサイトを制作する際は、もちろんこの工程だけではありません。その点はご留意ください。

いきなり制作に入らない

やってしまいがちなミスとして、とりあえずWordPressやJimdo等のホームページ作成サービスを導入して、いきなり制作を進めることです。

ぼくが様々な方の自作ホームページを改修させていただく中で最もよくある失敗例として、ホームページを誰に見せたいのか、何を伝えたいのかがよくわからないという点です。

なんとなく作ったホームページというのは、はっきり言ってしまうと素人が見てもすぐにわかります。

いきなり作り始める前にしっかりポイントを押さえましょう。

【１】誰に見て欲しいのかを明確にする

まずは誰に見て欲しいのかを明確にしましょう。

年齢層や性別、どんな生活スタイルなのか、なぜこのサービスに興味を持っているのか、等々、お客様象をイメージし、「ペルソナシート」を作成します。

なぜここが大切かというと、極端な話、「10代女性」がターゲットなのか、「50代男性」がターゲットなのかで、ホームページで与えたい印象が大きく変わります。

メインターゲットが10代女性なのに、高級ホテルのホームページのようなデザインや文章には決してしないと思います。ここを明確しておくと、ホームページの方向性もしっかりしますので、面倒くさがらずに取り組みましょう。

こちらは過去の記事「ホームページを作る前にやること。誰に見て欲しいかを明確にする。」で詳しく説明させていただいておりますので、ご興味のある方はこちらをご参照ください。

この段階では、ターゲット像をあまり具体的にしすぎる必要はありません。

あくまで想像の範囲なので、実際に運営をしてみると必ず相違がでます。この段階であまりにもターゲットを絞りすぎると、的外れなものになる可能性が高くなってしまいます。

事業をもう何年も行なっていて、具体的なターゲット像が描ける方は、具体的に作成していただいてもちろん大丈夫です。

【２】参考となるサイトを探す（3〜5つ程度）

ここで参考となるサイトを探します。

自分の事業と同業種で、検索上位にあるものから、3〜5つ程度ピックアップします。

検索上位にあるサイトはちゃんと理由があります。

コンテンツが豊富にあったり、ユーザーにとってわかりやすい作りになっていたり、きちんと更新されていたり等々。

それらを徹底的に研究し、いいなと感じたサイトを保存しておきましょう。

チェックポイントとしては、

• どんなコンテンツ（メニュー）があるか
• キャッチフレーズや文章になっているか、自社や自社のサービス等をどう見せているか
• どんな写真を使用し、どう見せているか

このあたりを押さえましょう。本当はもっと沢山ありますが、いきなり参考にしたいサイトと同レベルのホームページを作ることは基本的には不可能なので、大筋を押さえていきましょう。

また、参考サイトを複数用意する理由としては、サイトによって「このサイトはサービス内容ページがわかりやすい」とか「こっちのサイトは社員紹介のページが良かった」等々、サイトごとにいい部分が違うケースが多々あるためです。

かといって参考サイトが多すぎると混乱の元になるため、ぼくの場合はいつも3〜5程度にしています。

【３】下書きをつくる

ペルソナシートも作ったし、参考サイトも見つけたし、満を持して制作だ！といきたいところですが、ちょっと待ってください。

まずはホームページの下書きを作りましょう。これは「ワイヤーフレーム」と呼ばれるものもので、ホームページのレイアウトを定める設計図になります。

例えば家を建てるとき、設計図なしでいきなり建て始めたら大変なことになりますよね？

ホームページもこれと一緒で、設計図なしに作り始めると大変なことになります。

ちなみにワイヤーフレームでは下記の内容を決めます。

Where: どこに（画面の上下部、左右部などの位置を決める）
What: なにを置いて（ロゴ、メニュー、コンテンツなどを決める）
How: どのように動作させるか（リンクや出力などの仕様を決める）

お恥ずかしながら、ぼくはweb制作を始めたてのころ、このワイヤーフレームを作らずにいきなり制作をしていました。

もちろん出来は惨憺たるものでした。

ワイヤーフレームをちゃんと作るようになってからは、制作するサイトのクオリティも上がりましたし、スムーズに制作ができるようになったので、面倒なようで全体の制作時間はむしろ短くなりました。

ワイヤーフレームの作成に使うツールとしては、個人的にはAdobeXDがオススメです。

専門スキルや知識は特に必要ないですし、直感的に操作できるので非常に使いやすいです。無料からはじめれられるので、興味のある方は導入を検討してみてください。

そういったツールに苦手意識がある方は、PowerPointやノートに書き込むといった方法でもOKです。

あくまで自社サイトのための設計図でお客様に提出するものではないので、ツールにこだわり過ぎる必要はありません。

それでもしっかりツールを使って作成したい！という方は、こちらのサイトに各ツールの紹介が載っておりますので、ご参考いただければと思います。

【2022年版】ワイヤーフレームツールおすすめ11選を徹底比較！（無料あり）

【４】制作する。遠慮なくパクリまくる！

ここまできてようやく制作に移れます。大変お待たせいたしました。

ここで大切なことは、【２】の工程で見つけてきた参考サイトを「パクりまくる」ことです。

もちろん常識の範囲内での話です。

web制作の経験がない方が、はじめからオリジナリティーを入れようとすると、ほぼ間違いなくダサい仕上がりになります。これまで沢山の自作サイトを見てきて確信を持って言えます。

偉そうに言ってますが、ぼく自身初期の頃に制作したサイトは、目を覆いたくなるほどひどかったです 笑

もちろん参考サイトのようにキレイに作るのは最初は厳しいと思いますが、色合いや写真の見せ方、サイズ、見出しの位置、大きさ、文字のフォントやサイズ等、できる範囲でパクリまくりましょう。

ホームページ制作のいいところは、お手本となるようなサイトが検索すれば簡単に沢山出てくるところです。

まとめ

以上ホームページを制作するにあたっての４つのポイントを解説してきました。

まずは自分で作ってみて、思うようにできなければ、その時はプロに相談するのもアリだと思います。

ただ「美しいデザインのホームページ」であることと「お客様を集められるホームページ」は別次元のお話なので、制作会社に依頼する際は、その点は十分ご留意ください。

今回取り上げた工程ができるようになれば、プロに依頼をする際にも要望が具体的になり、より良いホームページを作ってもらえるようになります。

簡単な作業ではありませんが、その分挑戦してみる価値はあると思いますので、ぜひチャレンジしてみてください。

それではまた！