Web制作のデザインを依頼したいものの、どこに依頼したらいいかわからないという企業は多いのではないでしょうか。

「Web制作を依頼するには、どうすればいいのか」

「自社に合うWeb制作が依頼できるところはどこなのか」

などと、Web制作のデザインを依頼したいと考えている企業担当者に向けて、制作の流れやポイント、外注先ごとのメリット・デメリットを解説します。

Webデザインの制作の流れ６ステップ

Webデザインの制作の流れは次のようになっています。

1. 目的・ターゲットの明確化
2. サイト設計
3. ワイヤーフレーム作成
4. デザイン
5. コーディング
6. 公開

目的・ターゲットの明確化

まず、Web制作における目的を明確化しましょう。Web制作は、ホームページやランディングページ、ECサイトなどさまざまですが、今回制作するWebサイト・Webページを通じて、何を達成したいのかを決めます。

たとえば、売上の増加や集客、採用の確保、ブランディングなどがあります。Web制作によって何を求めているのか、また、何がしたいのかを具体的な数値目標にしておくと良いでしょう。たとえば、採用の応募者数を年間で〇人増やすなどといったものです。

また、Webサイト・ページを誰に見てもらいたいのか、誰に情報を届けたいのか、ターゲットも明確にしましょう。さらに、ターゲットが何を求めているのか、どんなニーズがあるのかをもとにサイトに入れるべき情報を明らかにしていきます。

サイト設計

Webサイトを誰に、何のために制作するのかを決めたら、Webサイトでどんなことを伝えたいか、優先順位とともに洗い出し、サイトマップにしていきます。

サイトマップはWebサイトの全体ページや階層を示したサイト全体の地図のようなものです。

サイトマップ作成の手順は、次のとおりです。

1. サイトに必要な情報を集める
2. 情報をカテゴリ分けする
3. サイトの階層別に記載する

サイト階層は、コーポレートサイトなら「トップページ」－「会社概要」といったようにページ別に記載していきます。

ワイヤーフレーム作成

サイトに入れるべき情報が固まってきたら、サイトの設計図「ワイヤーフレーム」に起こします。ワイヤーフレームは、四角い枠や線などを使って「Webサイト内の、どこに、何を、どう表示するのか」というレイアウトを落とし込みます。

関連記事：ワイヤーフレームの作り方｜目的と注意点、おすすめツールを徹底解説

ワイヤーフレームは白や黒、グレーといった無彩色で表示し、デザイン要素が必要ありません。デザイナーだけでなく、制作に携わる人なら誰でもツールを活用することで作成できます。

関連記事：おすすめのワイヤーフレームツール9選を紹介！特徴と機能を一覧で徹底解説

デザイン

ワイヤーフレームが固まったら、ワイヤーフレームの配置をもとにデザイン制作を開始します。デザイン制作を前に、ターゲット・ペルソナに合わせた配色を決め、アイコン・写真など必要な素材を用意しておきます。

デザインを依頼する際には、Webサイトの目的やペルソナ設計、どんなテイストにしたいのかといった企画・戦略部分はもちろん、画像素材もある程度準備しておくとスムーズです。

コーディング

デザインが決定したら、Webページに表示させるためのコーディング作業に入ります。HTML、CSSといったマークアップ言語を主に使い、サイトの必要に応じてJavaScriptを使って、ページ上に動きを加えるなどします。

コーディング完了後は、PCやタブレット、モバイルそれぞれで正しく表示できているかどうかの確認をします。表示できない場合には修正を繰り返し（デバッグ作業）、エラーが出ないように調整します。

公開

サイトの表示や機能に問題がなければ、Webサイト・ページを公開します。公開後も、Web制作の目的に応じて、広告運用をしたり、SEO対策をしたりして、集客やCVR向上のための施策を実施し、Webサイトの効果を高めます。

関連記事：Webデザインを外注／依頼する流れ6ステップ！ 費用や注意点も解説

Webデザインのポイント3つ

Webデザインのポイントは次の3つです。

• 配色のバランスに気を付ける
• レイアウトの原則に沿う
• ユーザービリティ（使いやすさ）を最大限考慮する

配色のバランスに気を付ける

Webサイトで使うカラーは、3色に抑えることで全体のバランスが良くなります。背景のベースカラーとサイトのメインとなるメインカラー、アクセントカラーの3つです。

その比率は、ベースカラー・メインカラー・アクセントカラーで、おおむね「70:25:5」が良いとされています。

レイアウトの基本原則に沿う

レイアウトの基本原則として、次の4つがあります。

• 近接
• 整列
• 反復
• 対比

それぞれ次のことを徹底することで、Webサイト上の情報が見やすくなり、ユーザーは求める情報にたどり着きやすくなります。

ユーザービリティ（使いやすさ）を最大限考慮する

Webサイトでは良く使われている基本的なルールがあり、「ユーザビリティ」と言われています。Webサイトの使いやすさ、わかりやすさであり、それらを担保するための基本原則があります。

ユーザビリティは次の5つから定義されます。

さらにユーザビリティは、たとえば下記のように次のような数値が目安となっています。

• フォントの一般的なサイズ・・・13～14ピクセル（最低でも12ピクセル以上）
• 行送り・・・120％前後
• 行長・・・1行あたり全角40文字くらい

しかし、ページのレイアウトやサイズによっては異なることもあり、状況に応じて活用すると良いでしょう。

このほか、Webサイトを利用するすべての人が年齢や身体的制約、利用環境などに関係なく、Webで提供されている情報に問題なくアクセスでき、コンテンツや機能を利用できるようにすることが求められます。こうしたことを「アクセシビリティ」と呼び、視覚障がいのある方、肢体不自由の方、高齢の方に読み上げブラウザやマウス操作以外の代替手段を提供するなどの配慮が必要です。

こうしたアクセシビリティの具体的な内容や指針については、国際標準として「ウェブコンテンツ・アクセシビリティ・ガイドライン」（WCAG）2に定められています。

参考：WCAG2概要｜Web Content – WCAG 2

Web制作のデザインを依頼できる外注先

Web制作のデザインを依頼できる外注先には次の2つがあります。

• フリーランス
• 制作会社

それぞれのメリット・デメリットを踏まえて、特徴を紹介します。

フリーランス

Webデザインを外注する依頼先として、フリーランスデザイナーがあります。フリーランスデザイナーは、Webサービスをもとにしたエージェントサービスやクラウドソーシングサービスのほか、知人の紹介などにより見つけることができます。

フリーランスのメリットは、費用が大幅に抑えられることです。同じ内容をWeb制作会社に依頼したとしても、フリーランスに依頼する場合の倍以上の費用が掛かることがあります。

関連記事：Webデザインの費用／料金相場は？ 制作会社とフリーランスどちらに依頼すべきかも解説

また、フリーランスは個人で制作するため、社内での調整や持ち帰り検討が必要なく、スピーディーで柔軟な対応が期待できます。

ただ、こうしたメリットは一定のスキルを持つデザイナーに依頼するからこそで、スキルの低いデザイナーや自社の依頼内容にマッチしていないデザイナーを選定すると、期待するクオリティの納品は厳しいでしょう。また、依頼後はどんなクオリティであっても、制作費を支払う必要があり、個人のため納期遅延や廃業のリスクがあることも注意が必要です。

フリーランスデザイナーに依頼する場合は、一定のスキル・実績（経験）があり、依頼内容に合ったデザイナーを選定することが重要です。

制作会社

制作会社に依頼する場合は、一定のクオリティが期待できます。さらに、Web制作以外のマーケティングやプロモーションのサポートも企業の得意分野に応じて、期待できるでしょう。

しかし、一方で制作会社に外注するとフリーランスと比較して費用が大きく掛かります。制作期間もフリーランスと比べると大幅に掛かるため、スピーディーな依頼にはあまり向いていません。

Web制作の規模が大きく、個人で対応しきれない場合や、Web制作以外のサポートも依頼したい場合に制作会社に依頼することをおすすめします。

関連記事：ホームページのデザインを依頼できる会社は？コストを抑える方法も紹介

Web制作のデザインの依頼先を選ぶポイント

Web制作のデザインの依頼先を選ぶポイントは次の3つです。

• 実績
• 得意分野
• コスト

実績

まず、Web制作のデザインの依頼先を選ぶポイントとして実績が挙げられます。これまでにどんなWebデザインを制作しており、どんな実績を持っているのかをしっかりチェックしましょう。

基本的に実績にないことは、依頼できないとみたほうが無難です。実績の中に依頼したい内容に近いものがあれば、依頼先の候補としておきましょう。

得意分野

依頼したい内容と依頼先の得意分野がマッチしているかというところも重要なポイントです。たとえばデザインにこだわったサイトを作りたい場合、デザインのクオリティが高いところを選ぶと良いでしょう。

得意分野を持っている、あるいは明確にしているところほど、実績や経験が豊富で様々なノウハウを蓄積していることがあります。何が得意なのか、自社とマッチしているのかを確認しておきましょう。

コスト

コストも重要なポイントです。コストは費用だけでなく、制作期間などの時間コスト、意思疎通が円滑かどうかのコミュニケーションコストなどさまざまなものがあります。

費用はもちろん、時間コスト・コミュニケーションコストなどがなるべく抑えられ、制作に集中できるような依頼先を選ぶとよりスムーズです。

以下では、主に初めて外注する企業に向けて、発注先の探し方や契約の方法など外注の流れをわかりやすく解説しています。無料でダウンロードできますので、ぜひご覧ください。

【お役立ち資料】
はじめての外注マニュアル

xdesigner.jp

Web制作のデザインを依頼するならクロスデザイナーがおすすめ

本記事では、Web制作のデザインを依頼する際の流れやポイント、外注先や依頼先を選ぶポイントについて解説してきました。

Web制作を依頼する際には、実績・分野・コストの3つが重要なポイントです。

コストを抑えながら、クオリティの高いWebデザインを期待できる依頼先に外注できると良いでしょう。しかし、制作会社に依頼すれば費用が大きく掛かり、フリーランスは一定のスキルを持つデザイナーを見つけることはとても難しくなっています。

厳正な審査を通過したデザイナーが在籍するクロスデザイナーなら、スキルの高い即戦力デザイナーを最短即日で提案することも可能です。

登録デザイナーとの合意にもとづいて、正社員採用も可能です。スカウトや人材紹介機能もあり、ハイスキルなデザイナーの採用機会を最大限サポートしています。

エージェントに相談いただければ、最短3営業日でのアサインも可能。週2〜3日の柔軟な依頼もでき、自社の業務量に合わせた効率的な外注ができます。

以下より、サービス資料も無料でダウンロードできます。即戦力デザイナーをお探しの方は【お問い合わせ】ください。平均1営業日以内にご提案します。