何をデザインするの?Webデザイナーの仕事内容について

※このページでは広告のリンクを含みます

WebデザイナーはWebサイトを作っていく過程の中で活躍する職種です。
現在、Webサイトを作る工程は企画提案、デザイン、プログラミングなど多岐にわたりますのでWebデザイナーがどの範囲までを担当するかはそれぞれのWeb制作会社で変わってきます。
ここでは、一般的なWebデザイナーの業務内容を紹介したいと思います。

Webサイトの構成図を作る

Webサイトページのレイアウトを考えて書いたものを構成図といいますが、現場ではワイヤーフレームと呼ばれています。

エクセルで作成したワイヤーフレーム

ワイヤーフレームを作る上で必要なスキルは、必要な情報を抜き出せる。その上で必要な情報に優先順位を付けれることです。

バナーを作る

バナーとはサイト上で別のサイトページに誘導させるための役割をもつ画像のことです。

Yahoo!サイト内のバナー(赤枠)

まずWebデザイナーに成り立て時に先輩デザイナーからお願いされることも多いと思います。クライアントによっては同じメッセージのバナーをサイズ違いで100種類ぐらい制作する場合もあります。
Webサイトのページのデザインに比べて作業量が低いのですが、バナーのクリック率が高い効果的なデザインを作れるようになるには量が必要です

Web制作会社などに未経験のWebデザイナーが入社した時に一番最初に任される業務がこのバナーの制作です

Webサイトをデザインする

前述した構成図(ワイヤーフレーム)をもとにサイトのビジュアルデザインをします。デザインルールを決め、デザインテイストの統制をとることもWebデザイナーの仕事になります。

Webデザイン制作画面

また、スマホ等のアプリデザインにUI(ユーザーインターフェース)デザインをします。UIデザイナーという職種もありますが、著者はWebデザイナーのスキルの一つと捉えています

Webデザイナーは、クライアントの目的にあった方法でコーポレートサイト、ブランディングサイト、ECサイト、キャンペーンサイト、お問い合わせサイトなど多くのデザインの経験が必要になります。

関連記事
WebデザイナーとUlデザイナーとUXデザイナーの違いってなに?

Webサイトをコーディングする

コーディングとはコンピュータに読み込ませるためにプログラミング言語で書いてくことを指します。デザインしたものに対してインターネットに読み込ませる必要があります。

コーディングをするにあたり代表的な言語はHTML・CSS・JavaScriptになります。

コーディング作業画面

制作会社によってコーディングを担当するコーダーという職業がありデザイン部分と別担当になるところもあります。
しかし、未経験でWebデザイナーとして働くにはデザインとコーディングの両方のスキルを身につけておくと良いでしょう。

この記事のまとめ

Webデザイナーの仕事内容は広範囲な業務がありますが、主に下記の4つが代表的な業務になります。1、2、3はデザイン業務、4はコーディング業務と分けられます。

何をデザインするの?Webデザイナーの仕事内容についてのおさらい

Webサイトの構成図を作る
必要な情報を抜き出し、その情報に優先順位をつけてからページのレイアウトをする。
バナーを作る
サイト上で別のサイトページに誘導させるため画像(バナー)をつくる。
Webサイトのデザインをする
構成図をもとにサイトのビジュアルデザインをする。
Webサイトのコーディングをする
HTML・CSS・JavaScriptでコンピュータに読み込ませるためのプログラミングをする。

ユウジの体感コラム

著者が働いていたWeb制作会社ではWebデザイナーとして雇用してもらっていたもののWebディレクター(クライアントとWebデザイナーの中に入ってwebサイトの制作管理をする)のように、クライアントへのサイト企画のプレゼン、クライアントの折衝、Webサイトのデザイン等と幅広く業務を担当していました。

クライアントと打ち合わせをした後すぐにデザイン作業に取り掛かるなど、脳の切り替えがうまく行かずに大変でしたね。

会社の規模によって業務範囲が変わってくるので、就職したいWeb制作会社に面談時に聞いてみるとよいでしょう。大体、Web制作会社で50人未満だとWebディレクターの業務範囲も兼務で行い、200人ぐらいの規模だとバナーの制作とサイトのビジュアルデザイン業務の担当になるかと思います。

おすすめの就職・転職エージェント[広告]