くくりさん
レンタルサーバー「くくり」のキャラクター。（本当は、とあるホスティングサービスの中の人）お仕事用のWebサイトやメールアドレスを初めて作る方向けに、役に立つ情報を発信します！
ホームページをつくろうと思うのですが、何から手をつけたらいいですか？
ホームページの作成は、家作りと同じように設計図が必要です。
設計図と聞くと難しく感じるかもしれませんが、簡単にいえば、どこに何をどのように配置するかを描いてみるだけです。
その設計図もどんな家を建てたいかで変わってきます。
今回は、ホームページの設計図と事前準備についてお話しますね～
Contents
ホームページの設計図とは？
ホームページを作るぞー！
さて、何から手をつけよう？
そーなりますよね。
ホームページはいきなり作ることはできません。
ホームページ作成には、家作りと同じように設計図が必要です。
「カワイイ雑貨でいっぱいのオシャレな家がいい！」
そのような方には、雑貨をきれいに並べるためのオシャレな飾り棚が必要です。
「アンティーク家具でクラシックな家がいい！」
そのような方には、照明から壁紙、床まで中世ヨーロッパの旧家のような配色が必要です。
どんなホームページにしたいか？
それが決まれば、ホームページに書く内容や構成などを決め、各ページの大まかな設計図を描き出します。
ホームページの設計図のことを、一般に「ワイヤーフレーム」や「ラフ」などと呼びます。
ホームページの設計図であるワイヤーフレームを作る目的は、次の3つを明確にすることです。
何を？
どのように配置するのか？
これがわかるようになっていれば、手書きでも、エクセルやワードの図形機能を使って描いててもどちらでも構いません。
家は設計図なしではちゃんと建てることはできません。
同じようにホームページも設計図なしで作っていくと、間違いが起こりやすく、リニューアルもしにくくなります。
家を建てたら、何年も何十年もそこで暮らしていくわけですから、手抜き工事があっては困りますよね？
ホームページを作ったら、不具合を起こさずスムーズに運用できることが重要です。
ホームページの設計図であるワイヤーフレームはそのために作るのです。
PR▼▼
初めてでも簡単！たった3ステップでホームページが立ち上がる、シンプル操作のレンタルサーバー「くくり」 【ドメイン永年無料】
ホームぺージの設計図を作る前にしておきたい4つの事前準備
ホームページの設計図には、どこに何をどのように配置するかを描いていきます。
あらかじめ設計のもとになる「こんなホームページを作りたい」という目的を決め、「どんな内容を載せていくのか」というホームページに書くことや構成などを事前に揃えておく必要があるんです。
設計図を作る前に用意しておくものは、次の4つです。
- ホームページの目的を一つに絞ること
- ホームページに何を書くか決めること
- ホームページの構成で導線をつくること
- お店のロゴや画像・写真をそろえること
①ホームページの目的を一つに絞ること
ホームページを作るには、ホームページを作る目的が必要です。
目的が必要な理由は、特に目的もなくあらゆる情報を載せておくと、ホームページに訪問してくださった方がどこを見ればいいか迷うことになり、最終的にホームページから離れることになります。
従って、あなたのホームページに訪問してくださった方に「どんな行動をしてもらいたいか？」という目的をもって作る必要があります。
ホームページの目的として選びやすいのは次の6つです。
- 商品販売サイト（ECサイト）
- 問い合わせ・申し込みサイト
- リスト取得、ユーザー登録用サイト
- 会社の信用性アップサイト
- 人材採用サイト
- カスタマーサポートサイト
ホームページの目的が決まったら、お問い合わせやメールマガジンの登録など、ホームページの中で最終的にして欲しいことも合わせて決めていきましょう。
＞＞ホームページの目的は1つに絞れ！選びやすい6つの目的はこれ！
②ホームページに何を書くか決めること
ホームページに何を書けばいいか？
答えは一つです。
「お客様が知りたい情報を書けばいい」
ただそれだけです。
あなたが、クリーニング店に行きたいと思って検索します。
どのように検索しますか？
- クリーニング 即日
- クリーニング 染み抜き
- クリーニング 革靴
お客様の要望はいろいろですよね。
その要望にぴたっと当てはまるホームページであれば、「お客様が知りたい情報」であるということです。
＞＞ホームページには何を書く？お客様に選ばれ続けるホームページ作り
③ホームページの構成で導線をつくること
ホームページの構成とは、「トップページ」からみて「それ以外のウェブページ」がどこにあるのかという階層を表すことをいいます 。
サイト全体をどんな構成にするのか、コンテンツは何か、またどのような画面イメージ化、他社サイトなどを参考にイメージを作っておきましょう。
ホームページ全体は2つの階層で構成します。
2つの階層とは、「トップページ」を1階層に、「それ以外のウェブページ」を2階層にすることです。
1階層にある「トップページ」は、お客様が知りたい情報を伝えるページです。
お客様に「このホームページはあなたのためのページです」と伝え、2階層にあるページに誘導したり、申し込みといった次の行動をおこしてもらうためのページでもあります。
2階層にある「その他のウェブページ」は、お店のプロフィールや商品・サービス紹介など、お客様が知りたい情報の裏付けや信用性を高めるためのページです。
本来は、1階層の「トップページ」だけで集客から申し込みまで完結できるとベストですが、特に初めてのお客様との信頼関係を事前に構築するために、お店のプロフィールや商品・サービス紹介など「その他のウェブページ」が必要なのです。
＞＞ホームページの構成は2つの階層と5つの基本で劇的にわかりやすくなる！
④お店のロゴや画像・写真をそろえること
お店のロゴ画像やお店の外観・内観、商品の写真などは、当然、用意しておく必要があります。
あなたのホームページがどんなにいいことが書いてあっても、写真・画像がないと寂しいものです。
最近では性能のよいカメラがありますので、自前で撮った写真でもいいですが、できれば、プロのカメラマンに依頼するなど、一切自前の写真を使わないのも一つの手です。
良い写真・画像を使うことは、ホームページの信頼性が高まるからです。
全ての写真・画像をプロに頼むのは難しいという方は、ロゴ作成とトップ画像だけでもプロに依頼することをおすすめします。
ホームページの設計図は配置とサイズを明確に！
ホームページの設計図を作るとき、事前準備した内容や写真・画像をどこにどのように配置させていくかを描いていきますが、その時大切なのは、サイズを書いていくことです。
ページ全体の横幅や、ロゴや写真など各部分の具体的なサイズを書き込みます。
その時使う単位を「px」と書いてピクセルと読みます。
Webで使う写真やイラストなどの画像データは、色のついた小さな点の集まりでできています。
その一つ一つの点をピクセルと呼び、画像の大きさや行間の広さなどは基本的に「px」を単位として表現します。
パソコンのブラウザなら横幅が1000px以上あるのが一般的なので、1000px前後の横幅で設計図を描いていくといいです。スマホなら横幅が750pxぐらいです。
ホームページを作成していく場合は、ページの横幅や図形や余白の大きさなど細かな部分のサイズまできっちりと設計図に書いておきましょう。
例えば、ホームページ作成の担当分けをした場合、サイズがちゃんと書かれていないと、それぞれの担当者がどうしていいか分かりません。
結局、担当者が独断で決めてしまい、ホームページが設計図どおりにならないということがないとは言い切れません。
最終的に出来上がったホームページが「思っていたものと違う」では、すごく残念ですよね？
ホームページの設計図は、事前準備とどこにどのように置くかという配置、サイズを明確につくることが大切です。
まとめ
ホームページ作成の設計図には事前準備が大切なのですね～
配置やサイズを明確にした設計図でちゃんとしたホームページを作成していきます！
ホームページはお客様を迎える家ですからね～
ホームページ作成の設計図をちゃんと作ることで、あなたが伝えたいことがちゃんとつたわるホームページになっていくでしょう。
