サイト制作は何から始める？Webサイトの作り方を初心者向けに解説

「Webサイトを作ってみたいけど、何から始めればいいのか分からない…」と悩んでいませんか？

サイト制作は作り始める前の準備がとても重要です。

FigmaやIllustratorでサイトのデザインを作る前にやっておくべきことを知らないまま進めてしまうと、途中で方向性がブレたり、修正が増えてしまったりします。

本記事ではサイト制作は何から始めるべきか、初心者向けにWebサイト作りの最初のステップについて解説します。

サイトの「目的」をはっきりさせる

最初に考えるべきなのは「何のために作るのか？」というサイトの目的。

ここが曖昧なまま進めてしまうと、デザインも内容もバラバラなサイトになってしまいます。

例えば、次のような感じ。

• お店やサービスを知ってもらうため
• 商品を購入してもらうため
• お問い合わせを増やすため
• 活動実績をまとめたポートフォリオとして使うため

目的が決まると、「どんな情報を載せるべきか」「どのページを充実させるべきか」が自然と見えてきます。

デザインはその情報を分かりやすく、魅力的にするためのもの。

まずはゴールを決めることから始めましょう。

誰に見てもらうサイトか考える

目的と同じくらい大切なのが「ターゲット」の設定です。

同じサービスを紹介するサイトでも、見る人が違えばデザインや文章の雰囲気も変わります。

若い人向けなら明るくカジュアルなデザイン、企業向けなら落ち着いた信頼感のあるデザイン、といったように、誰に向けたサイトかを決めることで、デザインや内容の方向性が統一されます。

ペルソナやカスタマージャーニーマップまで考え始めると大変なので、そこはサイトの規模と相談する必要がありますが、どういった人に届けたいのかを考えると、デザインがしやすくなるので、そういった意味でも必要な作業です。

ページ構成とワイヤーフレームを作ろう

目的とターゲットが決まったら、次はサイトの中身を整理していきます。

まずは「どんなページが必要か」というページ構成をサイトマップ形式で考えてみましょう。

ページは下記のような感じ。

• トップページ
• サービス紹介
• 料金表
• 会社概要
• お問い合わせ

ページが決まったら、それぞれのページに「どんな情報を、どの順番で載せるか」を決めるためのワイヤーフレームを作ります。

この段階ではデザイン要素は必要ないので、モノトーンで文字や画像をどこに配置するか、簡単に整理するだけでOKです。

ここまでできていれば、デザインに移ったときに迷いにくくなり、作業もスムーズに進むと思います。

まとめ

Webサイトを作り始める前にやるべき準備について解説しました。

いきなりデザインから始めるのではなく、しっかりと準備しておくことで、サイトの完成度を高めるだけでなく、デザイン時に迷いにくくなるという利点もあります。

サイトの作り方が分からない、という方の参考になれば嬉しいです。