グラフィックデザイナーのHTML独学講座

デザイナーがWebの独学は意外に簡単!

シェアする内容

  1. 独学でwebデザインは可能
  2. webデザインに必要なスキルとグラフィックデザイナーの利点
  3. HTMLを身につける
  4. CSSを身につける
  5. webデザインとグラフィックデザインの違い

独学でwebデザインは可能

グラフィックデザイナーはちょっと頑張ればWebの仕事もできるようになります。ほんとうですよ。現に私はグラフィックデザイナーでしたがDTPがあんまり好きになれず早々とWebへと仕事を移しました。クライアントからするとWebもグラフィックもできるので窓口が一つで、しかもトーン&マナーが守れると好評でした。福岡にいながらシドニーオリンピック民放5社公式サイトなど東京の色んな仕事をさせていただきました。最初は私もWebはデザインのみしてましたがプログラマー(当時はプログラマーがコーディングもやっていた)に頼むのがめんどくさくなって自分でHTMLを書き初めて気づいたのが、すぐにブラウザーで結果が見れてグラフィック全体を支配できるのに意外と満足感を得て離れられなくなりました。

私はweb系のデザインもコーディングも全部独学です。一緒にしていたプログラマーの影響もあって「だいたいのことはプログラム系はやる気があれば独学でいけますよ」って話をだったらやってみるかとはじめたのですが、デザインとはまるで違う左脳の使い方なのでちょっとどうなんだろうって思っているうちに、なんだか面白くなってそのうちなれていきました。

そこでわかったのは、とにかく作ること。仕事で一つのサイトを全部コーディングできるようになれば自信も付きますし、失敗も繰り返すうちに原因がはっきりしてきます。なんといってもコーディングは”やればできる”ものなので、デザインのようにどうしていいのかわからないという類のものではありません。HTML,CSSはとにかく作れば必ず覚えることができます。

webデザインに必要なスキルとグラフィックデザイナーの利点

グラフィックデザイナーがWebを始める利点は以下を見てください。
一般的にWebデザイナーは
1.デザインの基本スキル
2.デザインツールのスキル
3.HTMLとCSS
4.JavaScript,jQueryの使い方
5.UI/UXデザインのスキル
6.SEOとアクセス解析の初歩
を必要とされると思います。

この中で1と2はすでにスキルとして持っていますので3456を覚えるだけです。
HTMLとCSSは作りながら覚えれば案外簡単に覚えることができます。肝は作りながら覚えることです。もう一度言います。必ず作りながら覚えることです。

デザインを作ればHTMLとCSSがもれなくついてきます的なソフトもいろいろありますがおすすめしません。HTMLとCSSをとりあえず手打ちできるのがフロントエンドまわりでは重要だと思います。どんなにすごいサイトであろうとHTMLとCSSがなければ構築できないのです。もちろんwordpressもそうです。
JavaScript,jQueryですが自分で組めなくってもweb上に使えるコードがいっぱい転がっています。最初はその使い方を学び、それを使うだけでいい感じのサイトをつくることが可能です。

5,6は特に6は必要に迫られて覚えざる負えなくなります。

私が思うに、デザインの基本スキルとデザイン能力がなんと言っても最優先だと思います。グラフィックデザイナーはこの部分に多くの時間を使ってスキルを積み上げているのですから単に変化する、チャレンジするハートがあれば意外と簡単にポジションを広げることができると思いますよ。なんといってもやろうと思えば全部自分でできてしまいますから満足感は半端ないですよ。グラフィックデザイナーはしっかりデザインを自分のものにしているのでとてもラッキーだと思います。デザインの基礎を知らずにwebデザイナーをしている人がなんと多いことか。

HTMLを身につける

HTMLはサーバー周り以外のwebサイト、webサービスのベースです。もしWebの仕事を色々したいと思っているならばHTMLを手打ちできたほうが有利です。手打ちと言ってもVisual Studio Codenadなどのコード補完してくれるエディターならタグを丸覚えしなくっても全然大丈夫ですから心配はいりません。一生懸命タグを覚えた私などからするとうらやましい限りです。
次回から全4回でHTMLの基本を身につける講座を始めます。

CSSを身につける

HTMLが内容を構造化(デザインで言えばタイトル、ショルダー、小見出し、ボディ)するものと考えれば、CSSは当初、写植の文字種類指定、級数指定や版下の色指定みたいな感じでしたがそれにレイアウト指定が組み込まれ、HTMLと共にデザインには欠かせない重要なプログラムになりました。デザイン・レイアウトにはHTML+CSSの学習が必須です。この講座も予定しています。

webデザインとグラフィックデザインの違い

最大の違いはデザインする面積が可変する。2番目がフォントはデバイスに依存する。3番目が色管理ができない。4番目が空間に時間が加わる、時間のデザインが必要。5番目がインタラクティブである。
と項目だけを思いつくままに書いてみましたが、詳しく書くと、ながながとなりそうなので機会があればいつか書いてみたいと思います。

では次回から全4回でHTMLの基本を手に入れてください。シェアしたいと思います。

ぜひ!SHARE