Webデザインとは? デザインとコーディング、ソフトの違い

Webデザインとは?-デザインとコーディング、ソフトについて

 

ヤナケン

こんにちは!

柳井です。

 

今回は「Webデザインとは?」ということで、基本的な導入の部分について解説をしていきます。

 

「Webデザインって言うけど、ぶっちゃけどこまでがWebデザインなの?」

「どんなことをするの?」

という感じの疑問ってありませんか?

私自身、Webデザイナー歴は6年程になりますが、当初は全く分かりませんでした。

 

「これからWebデザインやったる!」という方は、まずは今回の記事を参考にしてみてください!


Webデザインとは?

Webサイトを制作する際、作業的には大きく「Webデザイン」「Webコーディング」の2つに分けられます。

  • Webデザイン ⇒ ユーザーに表示する、サイトのビジュアルを担う仕事
  • Webコーディング ⇒ 段あまりユーザーが意識することのない、ウェブサイト実装(htmlやCSS)を担う仕事

 

一般的にWebデザインを担う人を「Webデザイナー」、Webコーディングを担う人を「Webコーダー」と呼びます。

建築でたとえるならば、Webデザイナーが建築家、Webコーダーは施工業者に該当し、デザイナー(建築家)がサイトの完成イメージを描き、コーダー(施工業者)がサイトを実装していくイメージです。

建築家

Webデザイナーはイメージとして建築家に近い

といっても近年はデザインとコーディングに仕事の境目がなくなってきていて、Webデザイナーにもコーディングのスキルと業務が求められるようになってきました。

もし「Webデザインだけやりたい!」という場合は、外注のWebコーダーと提携するのが一般的です。

 

ヤナケン

ちなみに私はコーディングもできますが、面倒なので、デザインだけやってコーディングは外注することが多いです。

 

Webデザイン・コーディングで使うソフト

AI,PS,DWアイコン

Webデザイン・コーディングで使うソフトはAdobeのものが代表的で、下記の様に使い分けされております。

デザイン用:Illustrator(イラストレーター)、Photoshop(フォトショップ)
コーディング用:Dreamweaver(ドリームウィーバー)、TeraPad(テラパッド)

 

イラストレーターとフォトショップは、Webデザインに限らず、デザイン全般における必須ソフトです。

この2つのソフトに加え、コーディング用のドリームウィーバーや無料版のテラパッドを使えるようにしておけば、Webサイト制作で一通りのことはできるようになります。

 

ソフトについて詳しく知りたい方は、下記の記事を参考にしてみてください。

≫Adobeの5つのデザインソフトを用途別に比較【使い分けのポイント(初心者向け)】

≫デザインに必要不可欠なソフト 「イラストレーターとフォトショップ」

 

ヤナケン

私の場合、デザインはイラレ、フォトショに加え、Fireworks(ファイヤーワークス)というソフトをよく使います。

ファイヤーワークスはWebデザインに特化していて、めちゃくちゃ使いやすいんですよね!

ただ、すでに廃盤になっているので、古いのしか使えません…

 

まとめ

  • Webデザイン
    ➡ サイトのビジュアルを担う仕事(完成イメージを作る)
  • Webコーディング
    ➡ サイトの実装を担う仕事(完成イメージに基づいて施工)
  • Webデザインのソフト
    ➡ イラストレーターとフォトショップが代表的(ファイヤーワークスもオススメ)
  • Webコーディングのソフト
    ➡ ドリームウィーバーが代表的(フリーソフトだとテラパッド)

 

以上、Webデザインについて、基本的な部分の解説でした!

 


ご拝読ありがとうございました。

コメントやご質問はお気軽に、ページ最下部にあるコメント欄よりどうぞ

ヤナケン

【下記画像をクリックして、儲かる物販ノウハウを手に入れる】 

ヤナケン公式メルマガ

メルマガ読者様限定で僕が身に付けた独自性・希少価値の高い物販ノウハウを、どんどん公開していきます。また有料級のプレゼントも無料で定期的にお届けします。

不要の場合は、いつでも解除可能です。
メルマガでお会いできるの楽しみにしております!

≫詳細が気になる方はコチラから

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください