【初心者向け】Web制作の仕事内容と職種について

お悩み
お悩み

Webデザインをやりたいんだけど、具体的にはどんな仕事をするの?

Webデザインを勉強し始めた方にとって、実際にどのような流れでWebサイトが作られるのか、どんな業務内容があるのかはなかなか想像しづらいかもしれません。

今回はWeb制作にまつわる仕事内容と各工程を担当する職種について解説いたします。

この記事で分かること
  • Web制作の流れ
  • Web制作にはどんな職種があるのか

Web制作の仕事内容

Web制作は、Webサイトを新規で作成・リニューアルしたり、既存のWebサイトに対して修正やコンテンツ追加などの補正作業を行うことが主な仕事内容です。

最近では管理画面やアプリなどの画面を作成することもWeb制作に含まれるようになりましたが、いわゆるWebデザインという仕事はWebサイトにまつわる制作を指します。

Webサイト(新規作成・補正・リニューアル)の作成手順は以下のとおりです。

Adobe CCで利用できるアプリ
  • ヒアリング
  • 提案
  • デザイン(ワイヤーフレーム作成)
  • コーディング・実装
  • サイト公開
  • 運用保守

ヒアリング

まずはお客さまから現状の課題や目的を確認します。
場合によっては「Webサイトを作る必要があるのかどうか」から検討します。

  • どのような課題を抱えているのか
    (Webサイトを作成・補正・リニューアルで解決できそうか)
  • 誰をターゲットとしているのか
  • 競合他社、目標に近い他社はいるか
    (目的の認識のすり合わせ)
  • Webサイトに使用する写真文章などの提供はあるか
    (撮影や文章のライティング、有料素材の使用など)
  • 予算スケジュールの確認

ヒアリングの内容をもとに業界についての調査や分析を行い、理解を深めていきます。
Webサイトを作成することが決定している場合は、使用する色などの細かいところも詰めていきます。

提案

ヒアリングの内容や調査・分析結果を元に、「どのような方針で進めるか」という提案をします。
提案の内容は以下のようなものを記載します。

  • 現状の課題と目的を言語化
  • Webサイトの方向性
  • サイトマップの作成(サイトボリュームの確認)
  • 制作費や必要素材、サービスなどの見積もり
  • スケジュールと進め方の確認

お客さまとの認識に相違がなければ、お仕事開始です!

ついに制作開始だね!

デザイン(ワイヤーフレーム作成)

いよいよデザイン工程に入ります。
お客さまの想いや情報を言語化していきます。

Webサイト作成など、ある程度規模の大きな案件はワイヤーフレームの作成から始めます。
以下が大まかな流れです。

  • ワイヤーフレームの作成
  • トップページのデザイン作成(サイトのデザイン方向性の確認)
  • 下層ページのデザイン作成

デザインはお客さまが伝えたいことや情報を整理して、

見る側に正確に伝わるようにすることが一番重要です!

デザインの時点ではまだ1枚の画像なので、各ページをリンクさせたり、動くよう、Webサイトにする作業が必要です。

コーディング・実装

デザインを元にコーディングや実装を行い、Webサイトにしていきます。

コーディングとは、Googleなどの検索エンジンにサイトの内容を伝えやすくするために、html言語を使って文章化することを指します。

デザイン画像に入っている文字がドラッグして選択できるようになるね!

Webサイトをまるごと作成する場合は、トップページのデザインが完成した段階で、デザイン作業と並行してコーディングを進めることが多いです。

WebサイトはPCやスマホ、タブレットなどの様々なデバイスやブラウザ(Chrome、safari、Firefox、Edgeなど)でアクセスされるため、どの環境でも同じような見え方。動作をさせることが重要です。

新規でWebサイトを作成する場合は、レンタルサーバーの契約やドメイン取得など、webサイトを公開するための準備も必要になります。
その際は、この時点でお客さまと連携しながら進めます。

サイト公開

Webサイトを作成し、内容や希望に相違がないかどうか、お客さまに確認します。
WordPressなどのシステムを構築した場合は、使いやすい入力方法になっているかどうかも確認します。

確認の時点では「https://●●●.com/test/」やBasic認証などで一般公開されないようにアクセス制限をします。

確認が完了すれば、サイトを一般公開します!

Webサイト制作に関してはこれで一段落です。

お疲れさまでした!

Web制作に関する職種

Web制作をするのはWebデザイナーだけではなく、大きく4つの職種があります。
どのような職種があるのか、またその仕事内容について解説します。

Web制作に関わる職種
  • Webデザイナー
  • Webエンジニア
  • Webライター
  • Webディレクター

Webサイトを作るのはWebデザイナーだけじゃなかったんだね

実はWebサイト制作には色々な人が関わっているんです!

Webデザイナー

お客さまの要望を元に、ユーザーが魅力を感じ、使いやすいWebサイトデザインを作るのがWebデザイナーの仕事です。

多くの場合、以下の2つの制作を担当します。

  • ワイヤーフレームの作成
  • デザインラフ作成

会社によってはコーディングやフロントエンドなど、Webエンジニアの領域もWebデザイナーが担当する場合もあります。
コーディングなどの知識が無くてもWebデザイナーの業務は十分可能ですが、知識があるほうがより有利です。

ワイヤーフレームの作成

ワイヤーフレームはデザインに入る前に、どのようなコンテンツを載せるか、優先度や表示領域の認識に齟齬がないかどうかお客さまとやり取りするために作成します。

純粋にコンテンツのみを検討していただくため、色やデザインをせずにテキストとボックスのみで構成します。

デザインラフ作成

完成したワイヤーフレームをもとに、あしらいを加えたりフォントを変更したり、イラストや画像を加えてデザインをします。

これぞWebデザインって感じだね!

見た目だけでなく、Webサイトを使う人が使いやすい、知りたい情報がすぐ分かる、伝えたい情報をターゲットとなるユーザーに適切に伝えられるのが良いデザインとなります。

また、タブレット・スマホ画面で表示する場合のデザイン構成や、ボタンにカーソルを合わせたときのデザインやアニメーションを取り入れる場合の指示なども考えておく必要があります。
後のコーディング作業での連携がスムーズになります。

Webエンジニア

Webエンジニアは、デザインと仕様を元にWebサイトを構築します。
仕様については依頼元にヒアリングしたものにしたがいます。

Webエンジニアは役割によって以下2つの職種がいます。

コーダー(マークアップエンジニア)

コーダーは、HTML・CSSといった開発言語を用いてWebサイトのソースコードを作る「コーディンング」と呼ばれる作業をメインに行います。

HTMLのソースコードを書くことを特に「マークアップ」と言い、SEOを考慮してテキストを見出しや文章など、役割ごとのタグに振り分ける作業をします。

フロンドエンドエンジニア

フロントエンドエンジニアは、コーディングに加えてJavaScriptやPHP等のプログラミング言語や CMS(WordPress等)を用いてサイトのアニメーションや仕組みの部分を実装します。

WEB制作では、最終的に制作したサイトをインターネット上に公開するので、サーバー周りの作業もWEBエンジニアに求められる仕事になります。

Webライター

Webライターは掲載するコンテンツの文章を考えます。
お客様からのヒアリング内容を元に、より読みやすく魅力的な文章を作成します。
また、SEOを意識したキーワードを盛り込むようにします。

中小規模の案件だと、WebディレクターやWebデザイナーがWebライターの作業を兼任することが多いです!
大規模案件やオウンドメディアを持つ企業であれば、専任のWebライターがつくことが多く感じます。

Webディレクター

Webディレクターは、Web制作のマネジメントを行う司令塔のような仕事です。
各メンバーに指示を出したり進捗管理を行うことを「ディレクション」と言います。

お客さまの要望からプロジェクトの全体像を明確にして、エンジニアやデザイナーに対して作業指示や進捗管理を行いプロジェクトを成功に導く仕事です。

ディレクション作業は多岐にわたりますが、大きく以下の3つの作業があります。

Webディレクターの作業内容
  • プロジェクトの計画と戦略立案
  • デザインや仕様の確定
  • プロジェクトの進行管理

プロジェクトの計画と戦略立案

クライアントの要件やビジョンに基づいて、プロジェクト全体の目標と戦略を定めます。

デザインや仕様の確定

お客様の要件やヒアリングから、Webサイトのデザインや仕様に落とし込み、制作するWebサイトの内容を確定させます。

プロジェクトの進行管理

スケジュールや予算の管理、タスクの割り当て、進捗状況のモニタリングなどを行い、プロジェクトが計画通りに進行するよう管理します。

Web制作の仕事に関する疑問

Webデザイナーになりたいのですが、コーディングスキルは必要ですか?

コーディングスキルは必須ではないですが、あったほうが有利です。
以下のようなメリットがあります。

・Webエンジニアとの連携がスムーズになる
・キャリアが広がる(Webデザイナー+αの付加価値)
・Webサイト制作がワンストップで完結

未経験でもWebデザイナーになれますか?

はい、未経験でもWebデザイナーになることは可能です!

Web制作の仕事内容と職種について

いかがでしたでしょうか?
大まかな内容でしたが、Web制作の仕事と職種を解説しました。

Web制作は地味な面もありますが、ハマる人には楽しい仕事です!

この記事が皆さんの参考になれば幸いです。
それでは良いWeb制作ライフを!

コメント

タイトルとURLをコピーしました