Webデザイナーは普段、どのような仕事をしているのか気になりますよね。仕事の流れやWebデザイナーの実態など仕事内容を詳しく解説します。

Photo By: Matthew Pearce

Webデザイナーの仕事内容は会社によって違う!

「Webデザイナー」と一言で言っても実態としては、会社によって仕事内容が変わってきます。

Webデザイナーの基本的な仕事内容は「Webサイトを制作すること」ですが、「Webデザイナーの仕事の話」の前に、そもそもWebサイトの立ち上げから運用までの流れをざっくりとでも把握していないと、Webデザイナーの仕事内容や役割が理解しづらいと思いますので、先にこの点を解説します。

Webサイトの立ち上げから運用までの流れ

Webサイトを立ち上げて、運用するまでの流れは大きく分けると以下のようになります。

  1. Webサイトの企画・設計
  2. コンテンツ・原稿の作成
  3. Webデザイン
  4. HTMLコーディング
  5. Webプログラミング
  6. Webサイトの運用(更新や修正)
  7. Webマーケティング

これらの内、Webデザイナーの仕事は、「Webデザインだけ」の場合もありますし、「WebデザインとHTMLコーディング」をするケースや、あるいは「全部」ということもあります。

この担当範囲や役割が、その会社のWebデザイナー職によって違うんですね。

ただ、多くの場合は「WebデザインとHTMLコーディングは必須」という感じです。

お客様との折衝やディレクションが必要なケースも

自社のWebサイト制作ではなく、お客様のWebサイトを制作する会社=Web制作会社のWebデザイナーになった場合は、お客様の会社へ伺い、企画・提案からお見積書の作成、契約に関することまでの折衝や、複数のWebデザイナーやWebプログラマーでサイト制作をする場合はディレクションの仕事もあったりします。

ディレクションに関しては、自社のWebサイト制作の場合でもありますね。

先に少し話が出てしまいましたが、Webデザイナーは大別すると「自社のWebサイトだけを制作するWebデザイナー」「お客様のWebサイトを制作するWebデザイナー」に別れます。

「お客様のWebサイトを制作するWebデザイナー」の場合は前述のようにお客様との折衝やディレクション的な業務が多々ありますので、「自社のWebサイトだけを制作するWebデザイナー」よりも対外的なコミュニケーション能力や折衝能力が必要になってきます。

一般的なWebデザイナーの仕事の流れ

Webデザイナーの中で最も一般的な環境と思われる「中小のWeb制作会社に勤務」するWebデザイナーの仕事の流れをご紹介します。

仕事の流れ一覧

  1. Web制作をしたいという企業の情報を得る
  2. ヒアリング・打ち合わせ
  3. 企画・提案・お見積もり、受注確定
  4. Webサイトの企画・設計
  5. コンテンツ・原稿の作成
  6. トップページ・中ページのデザイン作成、検収
  7. HTMLコーディング・Webプログラミング、随時検収
  8. Webサイトの最終チェックと納品
  9. Webサイトの運用(更新や修正)

Web制作会社のスタッフ構成について

各流れの解説の前に、前提としているWeb制作会社のスタッフ構成を定義しますと、中小企業における一般的なWeb制作会社のスタッフ構成は以下のような場合が多いと思います。

  • 営業マン(Webディレクターを兼任することも)
  • Webディレクター兼Webデザイナー
  • Webプログラマー

WebディレクターとWebデザイナーで別々のスタッフが担当されている場合も多々あるかと思いますが、今回は兼任するケースとします。

Web制作の仕事を受注するまでの流れ

Web制作をしたいという企業の情報を得る

まず、営業マンが、Web制作をしたいと考えている企業さんの情報を掴みます。この時、大体は「相見積もり(あいみつもり:通称“あいみつ”)」「コンペ」での提案が必要となります。

Web制作会社への直接指名で受注できるというのは、名の通ったWeb制作会社さんか、実績のあるWeb制作会社、または馴染みのある企業への発注、というのでなければ、中小のWeb制作会社にとってはなかなか難しいというのが実情でしょう。

さて、相見積もりとは、「Webサイトを制作したい企業が、複数のWeb制作会社から見積もりをもらい比較すること」

コンペとは、「複数のWeb制作会社による企画・提案内容を競うプレゼン」です。

「相見積もり」はどちらかというと「価格ありき」で一番安い見積もりが受注できるものが多く、「コンペ」は金額よりも企画の優劣が勝敗を分けやすいケースが多いです。

ヒアリング・打ち合わせ

相見積もりやコンペのどちらにしても、お客様のご要望をお伺いする「ヒアリング」から始まります。

コンペの場合は、事前に「仕様説明会」的なものがあったりします。

この段階ではお客様先へ営業マンと同行し、どのような目的でどのようなWebサイトを立ち上げ、どのように運営していきたいのかを細かくヒアリングします。

このヒアリングで失敗すると、受注の失敗につながったり(専門用語で「失注(しっちゅう)」と言ったりします)、受注できても、お客様の期待に応えられないばかりか、トラブルになってしまうこともあるので、注意が必要です。

合わせて、予算感も話し合いの中でお客様とすり合わせをしておかなければなりません。

企画・提案・お見積もり、受注確定

ヒアリングが終わったら、お客様のご要望や期待にお応えできる企画を立案し、提案します。

ヒアリングから得た「お客様が真に望むもの」を提供できる企画が理想です。もしかすると、その企画は、お客様からご要望のあった見せ方や内容とは違う提案になるかもしれません。場合によってはそういう提案もします。

ただ、予算の問題もあるので、こちらが良いと思う提案を全て受け入れていただけるとは限りません。しかし、こちらとしては「ベストな提案」や「予算に即した提案」など複数案を用意し、お客様にご提案して、選ばれる可能性を高める工夫が必要です。

この「企画・提案業務」自体は、Webディレクター、または、Webディレクター兼任のWebデザイナー自身で行うことが多いですが、営業マンがWebディレクターやWebデザイナーと協力しながら行うこともあります。(営業マンがWebディレクターを兼任している場合もあります)

コンペの場合は、関係者の前に立ってプレゼン、スピーチする必要があるので、プレゼン能力も必要になってきます。

こうして、関係者の努力の末、晴れて受注できたら、いよいよWeb制作が始まります。

Webサイトの企画・設計

Webサイトの制作に入る前にしなければならないのが、Webサイトの企画・設計です。

お見積りやご提案時に、大枠での企画と設計はできていると思いますが、ページ構成(サイトマップ)やコンテンツの配置などについて細部まで詰めていきます。

Webサイトの企画で特に大切なのは「目的」と「ターゲット」を見失わないようにすること

何のためにWebサイトを運営するのか、誰のために情報を発信するのか、ここを明確にしてブレないようにしなければなりません。

ここがあやふやなままWebサイトを制作し始めたり、運用し続けると、望んだ結果が得られにくくなります。

コンテンツ・原稿の作成

Webサイトに掲載するための原稿は、基本的にお客様自身が用意しますが、お客様から依頼を受けてWeb制作会社が原稿やコンテンツを作成することもあります

そのような場合は、Web制作会社が取材に行き、インタビューをして文字を起こすような、ライター的なことをしたり、写真撮影をしたりすることもあります。もはや本当に何でも屋ですねw

また、写真やイラストが無ければ、無料や有料の写真素材、イラスト素材を利用したり、ロゴや地図などの作成を依頼されることも。昔はFlashの作成が多かったのですが、最近では動画の作成が増えてきています。

Webサイトに関することは何でも頼まれることがあると思っていた方がいいです。Webデザイナーは、広く知識や技術の習得が必要です。

なお、コンテンツや原稿の作成は、後述のトップページのデザイン等のWebサイト制作を進めながら並行して行うことも多いです。

トップページ・中ページのデザイン作成、検収

いよいよ「Webデザイン」に取り掛かっていきます。Webデザインをする手順は以下の流れが一般的です。

  1. 「ワイヤーフレーム」を作成
  2. デザイン案を複数案作成
  3. お客様に確認していただき、確定

どこに何を配置するかを決める「ワイヤーフレーム」の作成

まず、いきなりWebデザインをする訳では無く、どこにどのようなコンテンツやグローバルメニュー、ボタンなどの要素を配置するかを決める「ワイヤーフレーム」を作成します。「ワイヤー」という言葉から「紐」的な細いものをイメージされるかと思いますが、“四角の線で囲っただけ”のいわばコンテンツや各要素の「配置図」の作成です。

これをトップページと中ページ(下層ページ)の2ページ分、必要に応じてPC用、スマホ用、タブレット用を用意します。

このワイヤーフレームを作成する際に使うソフトは人それぞれで、PhotoshopやFireworks、Illustratorなどの画像処理ソフト、Web上の無料ツール、はたまた、エクセルやパワーポイントで作るWebデザイナーもいます。ここはそれほど出来栄えは求められないところなので、どのソフトでもいいと思いますが、会社の同僚Webデザイナーと共通のソフトにしていた方が誰でも修正等の対応ができていいかもしれません

この段階で一度お客様に確認していただき、OKが出たら、実際にWebデザインに入ります。

デザイン案を複数作成

デザイン案は複数を求められることが多いと思いますが、1案増えるだけで、その分の作業時間がかかるので、契約時に何パターンのデザインが必要かを必ずお客様に確認しておきましょう。かかった時間分が売上になるような契約にできないと会社にとってマイナスになります。

デザイン案ができたら、適宜社内で上司や先輩からチェックを受けて、お客様にご確認いただきOKが出たら、HTMLコーディングに入ります。

HTMLコーディング・Webプログラミング、随時検収

Webデザインが完成したら、HTMLのコーディング作業に入ります。現在、ほとんどのWebサイトは、文書構造をHTMLで作成し、見た目のデザインはCSS(スタイルシート)で実装しています。

ですので、HTMLとCSSの技術は必須となります。それ以外にも最近はjavascriptやPHP、データベース(主にMySQL)、あとWordPressを使うことが多いです。

Webデザイナーが第一目標とすべきプログラミング言語のスキル

javascriptやPHPはプログラミング言語ですが、ゼロからプログラムを組めるようになるのは難易度が高いため、Webデザイナーはまずは基本だけ分かるようになればOKだと思います。複雑なプログラムはWebプログラマーさんに任せましょう。もちろん、Webデザイナーでこれらを使いこなせる人材になれると重宝されます

第一目標としては、javascriptやPHPのフリーで公開されているプログラムをカスタマイズして利用できるレベルのスキルです。

Webプログラマーさんと連携して開発

データベースが絡むWebサイトになってくると、Webデザイナー単独で構築するのは技術的に困難です。分かりやすい例でいうと、ログイン機能があり会員管理が必要とか、ショッピングサイトなどですね。

このような場合は社内のWebプログラマーさんや外部のWebプログラマーさんと連携してHTMLコーディングをしていきます。

HTMLのコーディング方法は、Webサイトの仕様や使っている言語等の環境的要因と、担当するWebプログラマーさんの「クセ」による人的要因によって変わってきますので、コミュニケーションをしっかり取って構築していきます。

随時お客様にチェックしていただく

Webページが見られる状態になったら、お客様にご確認いただきます。専門用語で「検収(けんしゅう)」と言ったりします。

全て完成してから検収するのではなく、制作途中での検収をすることを「中間検収」と言いますが、この工程でのポイントは、お客様にこまめにチェックしていただくことです。

そうすることで、万が一お客様の思い描いていたものと違う出来の場合に、早期の修正が可能となります。

後々になって「全然違う」となった時には、修正が大掛かりになってしまうこともしばしば。。相違点は早めにつぶしておかないと大幅な作業コストが発生しかねませんので、“未然に防ぐ”工夫をすることが肝要です。

Webサイトの最終チェックと納品

最終チェックは主に様々なPC(Windows/Mac)やスマホ、タブレットの各ブラウザでのチェックとなります。ブラウザはバージョン違いのチェックも必要です。

もちろん、制作過程においても要所要所で複数のPCやスマホ、タブレットの各ブラウザでのチェックをしておきます

ただ、最近のWebサイト制作ではチェックの範囲がとても広くなってきています。スマホだけでもiPhoneやAndroidのOS違いから、バージョン違い、ブラウザ違い、機種による画面の大きさ違いなど、環境が多岐に渡るので、契約時にどこまでの範囲をチェックに含めるか、あらかじめ明確にしておいた方がいいです

Web制作会社ごとに「チェック基準や範囲」が定められていることも多いので、そのような基準や範囲がある場合は、事前にお客様とすり合わせをしておきます。

社内でのチェック完了後、お客様にもチェックしていただきOKが出たら、ようやく納品です。

ここに至るまで、Webサイトの規模にもよりますが、最初のヒアリングから早くて大体2~3ヶ月、3~6ヶ月以上かかることも普通にあります。

Webサイトの運用(更新や修正)

これは契約によるのですが、サイト公開後の更新や修正もWeb制作会社が行う場合があります。

そのような場合は、お客様から連絡や指示があった際に、いただいた原稿をもとに、あらかじめ用意しておいたテスト環境にアップしてから、お客様にご確認いただき、OKだったら本番環境にアップするのが一般的です。

SEOやリスティング広告などのWebマーケティングを行うことも

更に、これも契約によるのですが、サイト公開後のアクセスアップなどの集客や販売、問い合わせ増といった成約に関するWebマーケティング業務をWebデザイナーが担うこともあります

SEO(検索エンジン対策)では、外部のSEO業者とのやりとりや、Webサイト内部の調整を企画立案・実施、リスティング広告(検索連動型広告)では、こちらも外部のリスティング広告業者とのやりとりや、キーワード出稿、広告原稿の作成、日々のチェックや調整、運用までを行うこともあります。

まとめ

  • Webデザイナーの仕事は多岐に渡る
  • お客様との折衝やディレクション業務も
  • Webサイトに関することは広く知識や技術の習得が求められている

中小のWeb制作会社におけるWebデザイナーは“何でも屋”と思われるほどWebサイトに関してマルチな仕事をしているのが実態です。

未経験からWebデザイナーを目指している方にとっては、「うへ~、Webデザイナーって難しそう」と諦めたくなる内容に思われたかもしれませんが、諦める必要は全くありません

どんなに多岐に渡って活躍しているWebデザイナーでも、最初から何でもできた訳では無いのです。

やったことのない仕事や分からないことは、ネットや本で調べたり、先輩や同僚から教わったりして、仕事をしながら経験を積んでいけば必ずマルチに活躍できるWebデザイナーに成長できます。