WEBデザイン

WEBデザイナーはコーディングができるべきか?勉強する理由やどこまでするか解説

WEBデザイナー

週末WEBデザイナー講師の小山温です。

「WEBデザイナーはコーディングできるべき?」

「コーディングできるとどんなメリットがあるの?」

という方向けに、この記事では「WEBデザイナーはコーディングできるべきか?」やコーディングを勉強する理由、どこまで勉強する必要があるかを解説します。

海外と比べて、日本のWEBデザイナーの平均年収は非常に低いのが現状です。

本来WEBデザイナーは商品やサービスの売上を左右する重要な仕事を行なっているので、高年収が期待できます。

しかし、デザイン制作しか行えないWEBデザイナーの方は、売上を増やす魅力的な提案ができずに収入を上げることができていません。

コーディングやマーケティングなど、WEBデザインに関係するスキルを取得すると、収入を増やせる可能性が高まるので、この記事を参考にコーディングを勉強してみてください。

WEBデザイナーはコーディングできるべきか?

WEBデザイナーを目指して学習を始めた方は、コーディングまで学習するべきか悩んでいるかと思います。

「WEBデザイナーがコーディングをできるべきかどうか」という議論はTwitterやWEB制作業界で度々起こっています。

結論、WEBデザイナーはコーディングできることが望ましいです。

コーディングといっても、本格的なWEBアプリケーションを開発したり、複雑なアニメーションを実装するレベルのスキルはあまり必要ありません。

基本的なHTMLとCSSを書くことができ、レスポンシブ対応させることができれば最低限のスキルとして十分です。

どこまでスキルを高めるかは、主に担当しているデザイン内容によって変わるので、一概には言えませんが、専門のコーダーになる訳ではなく、あくまでも仕事の幅を広げるために学習することを忘れないようにしておきましょう。

日本のWEBデザイナーの年収が低い理由

海外と比べると、日本のWEBデザイナー平均年収は非常に低いのが現状です。

年収が低い理由としては、コーディングやマーケティングなど、デザイン制作に関係する領域を担当できないことが挙げられます。

ちなみに、欧米ではコーディングできない人をWEBデザイナーとは呼ばず、コーディングはできて当たり前という認識だそうです。

当然担当できる領域が広く、コーディングからマーケティングまで行えるWEBデザイナーの方は、より売上に直結する具体的な提案ができるようになり、高年収を獲得できます。

WEBデザインスキルひとつだけで、高い年収を希望するのは非常に難しいので、収入を増やしたい方は、コーディングなど自分の担当できる領域を広げることが推奨されます。


コーディングの仕事を行う訳ではない

コーディングの学習をしたからといって、自分でコーディング作業を行わなければならない訳ではありません。

当然コーディング作業を行えば、メイン業務のデザイン制作にかけれる時間が少なくなってしまいます。

なので、専門のコーダーの方にコーディング作業を依頼して、デザイン制作に集中することも可能です。

WEBデザイナーがコーディングを学習することで、コーディング困難なデザインを作ってしまうことがなく、依頼もスムーズに行えるようになります。

コーディングスキルを習得しても、デザインとコーディングの両方仕事で行う必要はないので、誤解しないようにしてください。

WEBデザイナーがコーディングを勉強すべき理由

WEBデザイナーがコーディングを勉強すべき理由は以下の通りです。

  • 実用性のあるデザインができる
  • コーダーとの連携がスムーズになる
  • デザインの幅が広がる
  • 単価の高い仕事を獲得できる

実用性のあるデザインができる

WEBデザイナーがコーディングを勉強することで、実用性のあるデザインを作成できるようになります

「デザインの質が落ちる」とWEBデザイナーがコーディングを勉強することに否定的な意見もありますが、コーディング作業を理解できることによって、むしろ実用的なデザインの質が高まると考えられます。

コーディングで実現できないデザインを制作しても意味がないので、外注する場合でもコーディング作業を知っておくと良いでしょう。

コーダーとの連携がスムーズになる

コーディングを勉強して形にしやすいデザインや作業の流れを理解しておくことで、作業を依頼した場合でもコーダーとの連携をスムーズに行うことができます。

一方でコーディング作業を理解できていないと、形にすることが難しいデザインを制作してしまったり、作業スケジュール設定や見積もりを適切に決めることができません。

自らコーディングを行いたくない場合でも、コーディング知識は絶対に無駄にならないので、積極的に勉強しておくことをおすすめします。

デザインの幅が広がる

WEBデザイナーがコーディングを勉強することで、形にできるデザインやアニメーションの設定が分かるようになり、デザインの幅が広がります

コーディングを勉強する過程で、様々なデザインを目にすることが多く、簡単に実装できるデザインから難しいデザインまで、コーディングと結びつけて考えることができます。

デザイン制作の引き出しが少ないと悩んでいる方は、コーディングを勉強することで、アイデアを増やすことができるでしょう。

単価の高い仕事を獲得できる

WEBデザイナーがコーディングを行えるようになることで、単価の高い仕事を獲得できます

デザイン作成しか行えないデザイナーがWEB制作業務を一括して受注した場合、コーディング作業を外部に依頼する必要があります。

依頼するにはコストと手間がかかりますし、クオリティを担保することも大変です。

自分が制作したデザインを完璧に表現したい場合、自分でデザインからコーディングまで対応することが1番です。

もちろん作業時間は増えてしまうので、単価の低い仕事をすることはおすすめできませんが、デザインからコーディングまで行えれば提案の幅を広げられるので、高単価の仕事に絞って取り組むと収入を増やせるはずです。

コーディングまで行えるWEBデザイナーの方は増えているので、自分が制作したデザインだけでもコーディングできるスキルを最低限身につけておきましょう。

WEBデザイナーはどこまでコーディングを勉強すべきか?

WEBデザイナーはどこまでコーディングを勉強すべきかというと、解説した通り基本的なHTMLとCSSです。

HTMLの具体的なスキルレベルは以下の通りです。

  • HTMLのhead内に記述する内容を理解している(title・meta・link・script)
  • 制作したデザインを見て、body内に記述する構造をイメージできる
  • HTML5のタグの使い方を理解している(header・footer・section・article・aside)
  • div・span・p・img・a・table・ul・ol・h1などの頻出タグを使える

上記の内容の意味が分かり、自分が制作したデザインを形にできれば問題ありません。

次に、CSSの具体的なスキルレベルは以下の通りです。

  • フォントを指定できる
  • 一般的な文字装飾ができる(色・下線・センター寄せ・フォントサイズ・行間)
  • アクション設定ができる
  • 疑似要素を使える
  • 背景色や背景画像を設定できる
  • min-widthやmax-widthを理解している
  • paddingやmarginを理解している
  • borderを使える
  • floatやflexを使える
  • メディアクエリを使ってレスポンシブ対応できる

CSSも同様に、上記の基本を理解していれば問題ありません。

自分が制作したデザインを形にすることを目指して勉強を進めてみてください。

JavaScriptやPHPはどこまでやるべきか?

次にJavaScriptやPHPはどこまでやるべきかを解説します。

まずJavaScriptはゼロから記述できるようになる必要はなく、jQueryを使用して特定の動きを実装できれば問題ありません。

jQueryはJavaScriptを全て記述する必要がなく、簡単に実装できるので、基本的なライブラリと使い方をマスターしておきましょう。

次にPHPもJavaScript同様に、ゼロから記述する必要はなく、WordPressの仕組みを理解して、テーマのカスタマイズやテーマ制作を行えれば問題ありません。

PHPをマスターするのはHTMLやCSSと比べて非常に難易度が高いので、WEB制作で使用する必要な部分だけ勉強してください。

WEBデザイン初心者が勉強しなくても良いこと

最後にWEBデザイン初心者が勉強しなくても良いことを解説します。

  • Bootstrap
  • Sass
  • SVG

コーディング関係の勉強を進めていくと、初心者が勉強しなくても良い部分まで行なってしまうことがあります。

使用頻度が低いスキルや、収入アップに直結しないスキルは無理に勉強しないようにしましょう。

Bootstrap

BootstrapはWEBサイトのコーディングを効率的に行うためのもので、数行のコードを記述するだけで、ヘッダーやボタンなどを実装できます。

しかしBootstrapでは柔軟なデザインに対応できず、いわゆる「ダサい」デザインになってしまうので、実際の制作現場ではほとんど使用されていません。

使用機会がなく、WEBデザイナーの方はまず使用しないので、勉強する必要はありません。

Sass

SassはCSSを効率的に記述するためのもので、コーダーの方が管理しやすく記述する目的で使用しています。

コーディングをメイン業務にする場合はSassを使用することが推奨されますが、WEBデザイナーの方が無理に勉強する必要はありません。

Sassでないと実装できないデザインがある訳ではなく、作業を進めやすくするためのスキルなので、時間がある時に軽く勉強するだけで十分です。

SVG

SVGといってベクター形式の画像フォーマットは、拡大しても画像が粗くならず、アニメーション画像を作る際に活用できます。

しかし、WEB制作の現場ではほとんど使用されることはないので、必要になってから勉強して対応しましょう。

まとめ

今回はWEBデザイナーはコーディングをどこまで勉強すべきかと、勉強すべき理由を解説しました。

WEBデザインスキルだけで高年収を獲得するには、高い専門性があり豊富な実績がなければ難しいです。

収入を増やしたいWEBデザイナーの方は、コーディングを勉強して単価の高い仕事を獲得しましょう。

解説した通り、基本的なHTML&CSSを勉強して、制作したデザインを形にできるスキルの習得を目指してみてください。

ABOUT ME
小山温
「未経験から2週間でWEBデザイナーへ」 がモットーの“週末WEBデザイナー”。 未経験からフリーランスのデザイナーになり、 現在も現役のデザイナーとして 企業や本著者、投資家、士業、スクール、 有名Youtuber関連のWEB、紙のデザインに携わる。 デザイナーとして活動を始めて7年、 クライアントからのリピート率は高く、 5年ほど新規集客なし、 紹介とリピートだけでビジネスを成立。 また、自由を確保するために効率化しつつも、 社員ゼロで毎年8桁の売上を作っている。
【無料LINE講座】週末WEBデザイナー