ブログ

BLOG

Webサイト制作の流れを6ステップで解説!

DP広報部 Other Blog

はじめに

Web制作会社にWebサイト制作を依頼する際、どのような流れで進むのかイマイチ想像がつかない、という方も多いのではないでしょうか?

Webサイト制作を効率的に進めるためには、最初に「全体像」を把握しておくことが重要です。
依頼をする前に少しでも全体像を認識していれば、心積もりも変わってくると思います。

そこで本記事では、弊社に依頼して頂いた場合の、Webサイト制作の流れをご紹介したいと思います。

Webサイト制作の流れ

1.ヒアリング・要件定義

弊社ではこのフローを何よりも大切にしております。

  • webサイトをどのような目的でサイトを制作したいのか?
  • 誰にどうなってほしいのか?
  • 抱える課題は何なのか?
  • どんなイメージのデザインがいいのか?。

お客様の課題解決の為に最適なクリエイティブをご提案するためには、時間をかけたヒアリングとお客様が抱える課題・悩みの整理から目的を明確にし、共通認識を持つことが必要です。

2.ご提案・お見積もり

ヒアリング内容をもとに、Webサイトの目的に応じたコンテンツや機能を定めたサイトマップと、制作スケジュールを作成し、お見積もりをご提示させていただきます。

3.ご契約・WF制作

ご契約後は、WF(ワイヤーフレーム)というWebサイトの設計図を作成します。

WFとは、Webサイトのレイアウトや構成を図解化したもので、ページごとの要素やコンテンツの配置、ナビゲーションの位置、ボタンやフォームなどのUI要素の配置などを示す図面です。

WFを制作することで、Webサイト全体の構造が把握でき、デザインの基盤となります。

4.デザイン制作

完成したWFに沿って、デザイン作成を開始します。
デザインは、Webサイトの印象を決定する非常に重要な要素であり、ユーザーの印象や行動にも大きな影響を与えます。

TOPページのデザインはサイト全体の軸となるため、まずはTOPページのデザインを確定させた後に、その他の下層のページ作成を進めていきます。

ただ見た目がいいだけではなく、ブランディングとユーザーにとって使いやすく効果的なデザインを制作します。

5.コーディング・システム開発(CMS構築)

デザインができたら、Webサイトとして機能するようにシステムの実装とWebブラウザで表示できるように構築します。

システム開発には、Webサイトの見た目を実装する「フロントエンド」と、サーバーなど裏側を実装する「バックエンド」に分かれています。

フロントエンド

デザイン通りの見た目をWebブラウザ上で表示するための工程です。
HTML、CSS、JavaScriptといったソースコード(プログラミング言語で記述されたテキスト)を記述し、Webサイトに表示されるテキスト、装飾部分を実装していきます。

バックエンド

WordPressなどのCMS(コンテンツ・マネジメントシステム)の構築や、サーバー設定などを行い、外部からWebサイトを見れるようにする工程です。
CMSを設定することで、コンテンツの更新が簡単にできるようになるため、Web制作会社に依頼せずとも、お客様自身で更新できるようになります。

6.確認・公開・保守管理

様々なデバイス・ブラウザで検証・確認を行い、公開作業をさせていただきます。

ですが、Webサイトは公開すればそれで終わりではありません。
ドメイン・サーバーの管理、定期的な更新やメンテナンスなどの作業が必要になります。

データプロでは公開後も更新のお手伝いやバナー等の制作保守やドメイン・サーバーの代理管理も行っております。

まとめ

以上が弊社のWebサイト制作の流れです。
工程は少なく見えますが、制作に入ると考えることや決定することが多く感じるかもしれません。
しかし、考えた分だけ良いWebサイトになることは間違いないはずです!

この記事が皆さんのお役に立てましたら幸いです。


データプロでは皆さまの情報をオンライン上で多くの方々に届け、活動を広げるお手伝いをさせていただきます。
ご質問やご相談がございましたら、お気軽にお問い合わせください。