「Webデザイナーはコーディングができるべきか」について、個人的な見解
※この記事は、過去ポートフォリオサイト（https://mcy-design.blue/）から移転・加筆・修正しています。
こんにちは、ヤマダです。
Webデザイナーをやっています。
最近、「Webデザイナーはコーディングができるべきか」といった議題をちょくちょく目にしました。
今回はそれに対する個人的な考えを述べていきたいと思います。
一応、想定読者は下記をイメージしています。
- Webデザイナーを目指しているけど、勉強範囲に悩んでいる人
- 紙やプロダクトのデザインがメインだったけど、Webに転向してみたい人
- 単純に、議題に興味がある人
あくまで僕個人の考えなので、押しつけとかではありません。
ゆる～く、お読みください。
簡単に自分の紹介
もともとコーダーあがりのデザイナーです。
とりあえずHTML～WordPressは組める感じのスキル感。
現在はデザイン・コーディング・ディレクション、幅広くやってます。
【結論】業務でやらなくてもいいけど、理解はしておくべきだと思う。
まずはじめに結論から。
コーディングを「業務」としてやらなくてもOK。ただし、コーディング自体は理解しておくべきだと思います。
そして、どこまで理解をしておくかべきかですが、最低でも下記は抑えておきたいと考えています。
- HTML構造
- CSSで可能な表現方法
- レスポンシブへの配慮
「実機での見え方」がすべてだと思う
これはあくまで持論ですが、Webデザインのクオリティは「実機でどう見えるのか」で判断されるべきだと考えています。
もちろん、カンプでの善し悪しってあると思うんですけど、カンプはあくまで制作フローで必要なだけですよね。
で、実機でどう見えるのかイメージをしながらデザインを作るには、必然的にコードへの理解が必要になってくると思うんです。
仮に自分がコーディングしなくとも、「こうするんだろうな」と想像しながらデザインが作れる人間。
それが、これからのWebデザイナーに必要な要件なんじゃないかなと。これが僕が出した結論です。
【実体験】「コードが分からないデザイナー」に囲まれながら感じたこと
僕は以前、とある都内のデザイン会社で、Webデザイナーとして働いていました。
その会社は紙・プロダクト・Webなど、多岐に案件を請けていた会社で、デザインスキルが高い人材がゴロゴロ在籍していました。
ただ、コーディングについて詳しい人間が自分だけだった。
他のデザイナーさんは、デザインはできても、コーディングについて詳しくありません。
働いていく中で、気になる箇所がいくつも目についてきます。
- 10px以下で設定されているfont-size
- 大量のモリサワフォント
- ブレンドモードで作られた透過素材
- 「PC：2カラム → SP：1カラム」なのに、結合されたレイヤー
- 明らかにサイズがおかしく、実機で見たときに大きすぎたり、小さすぎる。
元コーダーだった自分は、かなりストレスが溜まっていました。笑
「自分よりデザインが上手い人なのに、こうなってしまうのはなぜか」
それは、コーディングを通じてどのようにデザインを構築していくのか、頭で描けていないからです。
その結果、コーディングしづらいデザインであったり、色々な箇所に綻びが生じて、「カンプ（1枚絵）だといいけど、実機だとイマイチ…」なサイトになってしまうのかなと。
コーダーさんも、お客さんも可哀想だと思う
僕自身もコーダーだったので分かることですが、色々と破綻しているカンプをコーディングするのは地獄ですよね。
不必要な折衝が生じますし、モヤモヤしながらコード書くのは精神衛生上にもよくないです。
あとなにより、一番の被害者はお客さんですよね。
社内にしろ外注にしろ、コーダーに回すってことはお客さんは確認取ってることがほとんどだと思います。
コーディング途中で「ちょっとこれ…」な事態になるくらいだったら、最初からコードが頭に入ってる時点でデザイン作った方がよくないですか？
※僕が前いた会社を例に出しましたが、ちょっと極端なケースではあるのでそこはご了承ください。
「デザイン専門」である方が、クオリティは高くなる？
また、今回の議題では、こういった意見も見られました。
- デザイン専門だからこそ、より精度高いデザインが作れる。
- コードを学ぶ時間をデザインの勉強に充てられるので、無理に覚える必要はない。
こういった意見について、僕は「半分同意で、半分反対」です。
【前提】「デザイン専門」のデザイナーさんは、めっちゃ強いと思う
ここでいう「デザイン専門」とは、コーディングをしない・本業は「Web以外の」デザイナーさんとしてください。
個人的に、何人かそういったデザイナーさんと仲良くさせていただいていますが、やはり全員優秀なクリエイターなんですよね。
これもまた極端な話になりますが、プログラミングやマークアップに業務や勉強の時間を割かない分、デザインスキルを伸ばせているのだろうなと感じました。
あ！他デザイナーと比べて、Webデザイナーが総じてレベル低いわけではないですよ！焦
少なくとも僕は雑魚ですが…。
なので、「デザイン専門」ってポジションには強みがあると思ってますし、無理にコードを覚えなくてもいいっていう考えも、少し納得できます。
Webデザイナーにとって、コードは「デザイン」
ですが、それでも僕はコードを理解しておくべきだと思うんですよね。
例え業務範囲でなくても、やろうと思えば少しコーディングできるくらいには。
先述しましたが、Webデザインは「実機でどう見えるか」がすべてです。
- CSSと画像、どちらで表現するべきか
- 表示スピードに影響はないか
- デバイスで見たとき、利便性に問題はないか
こういった部分まで意識・判断してデザインが組めることが、Webデザインの真髄だと思いますし、より良い成果物のために必要な要素だと考えています。
これは受け売りですが、「コードはデザイン」だと思います。
デザインとコード、この2つをわけるのではなく、合わせて考えていくことが大切なのではないでしょうか。
コーディングがわからないのは、正直もったいない。
推測ですが、今回の議題で複雑な心境でいるのは、これまでコードに触れてこなかったデザイナーの方ではないでしょうか。
先ほども触れましたが、例えジャンル違いだったとしても、僕は「Web以外の」デザイナーさん全員に対して、深い尊敬の念を抱いています。
特に「タイポグラフィ」だったり「文字組み」に関しては、Webでは中々触れづらい部分なので、本当に脱帽です。。。
ただ、だからこそ「コーディング」が分からないのは、ちょっともったいない気がします。
コードを理解することで、もっと良いWebデザインが作れるはずなので。
なので、これまでコードに触れてこなかったデザイナーさんも、「コードもデザイン」と捉えて、Webデザインを作ってみてはいかがでしょうか。