
webデザインの学習を基礎から始めたい!
難しい言葉でごまかさない、超初心者向けのシリーズ記事です。
できるだけ専門用語を避けて解説しています。
webデザインとは?をわかりやすく説明して、全体像をふんわりと掴むのが目的です。
webデザインの勉強って何するの?というレベルの初心者さんへ。
webデザイナーって普通のデザイナーとは違うの?
という疑問を解消するために、ざっくり説明していきます。
webデザインとは【基礎知識編】


「webデザイン」ってなに?
web上のコンテンツを作成したり、デザインをするのが「webデザイン」です。
デザインとつくので、クリエイティブなイメージが先行してしまいがちです。
実際にビジュアルのデザインはクリエイティブな発想から生まれると思います。
意外かもしれませんが、
直感的なデザイン作業よりも、専門的な知識が必要な地道な作業の割合が大きいです。
webデザイナーとグラフィックデザイナーの違い
求人などで見かける「デザイナー」の文字。「webデザイナー」とは違うのでしょうか。
「webデザイナー」もデザイナーの一種です。
ただし「デザイナー」とされる求人などでは「グラフィックデザイナー」を指すことが多いと思います。
誤解を恐れずにいうと、
いわゆる「普通のデザイナー」として認識されるのが「グラフィックデザイナー」です。※私はグラフィック出身です。
「webデザイナー」が区別されるのは、専門のスキルを使って仕事をこなすからです。
「webデザイナー」と「グラフィックデザイナー」は仕事内容でも共通するところがあります。
グラフィックデザイン・webデザインの両方でよく使うパソコンソフトとして、illustratorやPhotoshopがあります。同じソフトを使ったりすることからわかるように、デザインという大きな枠組みの中では親戚のような近しい関係だと思います。
webデザインとグラフィックデザインの違い【仕事内容】
webデザインでもグラフィックデザインでも、同じソフトを使ったりと仕事内容でも重複することが多いとお伝えしました。
仕事内容で区別すると、
簡単に言うと、になりますが・・・
「webデザイナー」はwebサイトやブログのデザイン担当、
対して
「グラフィックデザイナー」は、主に紙媒体(ポスターやチラシなど)のデザイン担当、
であるということ。
※ ざっくりした説明です。
厳密には例外も含め、この限りではないと思います。が、webデザイナーとグラフィックデザイナーとの違いを理解するためには、できるだけ簡単に説明するべきだと思いました。
webデザインとグラフィックデザインの違い【必須スキル】
「webデザイナー」はwebサイトなどをメインにデザインします。
web上にデザインを表示させるためには、専門的な必須スキルが必要です。
HTMLやCSSといって、
「デザインしたwebサイトをweb上に表示させる」スキルです。
これは「webデザイナー」にとって必須のスキルです。
ローマ字の文章を組み合わせて、サイトをweb上に表示させていきます。
※HTMLやCSSを書けるスキルは、グラフィックデザイナーにとって必須ではありません。

webデザインってもっと感覚的にするのかと思ってた・・
HTMLやCSSとは?
web上で目にするのサイトやブログなど、今見ているこの記事を含め、ほとんどがHTMLやCSSの文章から作られています。
webデザイナーはサイトやブログを作成するとき、
まず、見た目のバランスや色彩などのデザインをしてから、
web上で表示させるために、文章を組み立てる作業を行います。
つまり、
文章だけを書きながらデザインするのではなく、下書きをしっかり作成してそれを見本に文章を組み立てています。
webデザイナーの仕事【必須スキル】
サイトやブログを「文章を組み立ててデザインする(web上に表示させる)」というのが、webデザイナーの大きな仕事であると説明しました。←このスキルの有無が、グラフィックデザイナーとの大きな違いですね。
というわけで、必須なスキルはやはりHTMLやCSSになります。
それから、
ビジュアル的なデザインのスキルも、webデザイナーの必須スキルであると言えます。
その理由として、
「文章を組み立ててデザインする(web上に表示させる)」と言っても、まずはビジュアル(見た目・視覚的な)のデザインも行うからです。
先ほど少し触れましたが、
webサイトやブログを作成するときは、完成イメージ画像を作ってから、文章を組み立ててデザインを表示させます。
この下書きが、特に大事なので時間をかけて作成していきます。なので、ビジュアル的なデザインのスキルも、webデザイナーの必須スキルであると言わざるを得ないわけです。
webデザイナーがwebサイトやブログの完成イメージ画像を作成するのに、よく使っているのがillustrator(イラストレーター:通称イラレ)やPhotoshop(フォトショップ:通称フォトショ)です。
webデザイナーとして就職したい場合【最低限必要なスキル4つ】
webデザインをする上での基本スキルに加えて、現場で必要とされているスキルを2つ足しました。
- Photoshop ・Illustrator (デザイン系マストのソフト)
- HTML/CSS (HPを構成する文章)
- JavaScript/jQuery (視覚的な効果を狙ったアクション)
- レスポンシブサイトの知識(スマホ対応)
まとめ
webデザインの基礎知識として「グラフィックデザイナー」との違いを、ざっくりまとめてみました。
そもそもになりますが「webデザインたるや」というテーマに関しては、web上にたくさんのサイトや記事があふれています。
読みやすい記事を見つけて、参考にしてみてください。
中でもオススメなのが、サルワカ 様の記事。
無料で読めてかなり有益な情報が満載なので、一度目を通して見てください。

コメント