マーカーネット株式会社

WEB制作ブログ WEBデザイン、HTMLコーディング、PHP、スマートフォン制作などWEB制作全般に役立つ情報を発信していきます。

WEBデザイン WEB制作

【グラフィック V.S. Webデザイン】グラフィック制作とWeb制作の違い-1-

投稿日:2015年1月20日 更新日:

こんばんは、デザイナーのOです。

実は私はグラフィックデザイナー出身で、約1年半前にWeb業界に入りました。
Webについてまだまだ勉強中の自分ですが、
実際にWeb制作に携わって感じた、グラフィック制作との違いをご紹介したいと思います。
まずは基礎知識から

単位

・WEBの単位はpixel(ピクセル)
open84

 

・紙媒体はミリメートル(またはセンチメートル)が基本単位です。
measure

カラーモード

・WEBはRGB
gf1420445298l

WEBの場合は印刷することがなく、パソコンのディスプレイに使う光の三原色RGB(Red, Green, Blue)で表現します。

・紙媒体の場合はCMYK
07
通常のカラー印刷物はCMYK(C:シアン M:マゼンタ Y:イエロー K:ブラック)の4色で印刷されます。

文字の最低ポイント数

・Webでの最低ポイントは10ptぐらいが目安
実際制作するとき、本文は大体14ptが一番多いですが、小さく12ptという感じです。
10pt以下にしてしまうと文字の可読性が保たないのでお勧めしません。

・印刷物の最低ポイントは6ptぐらいが目安

印刷物の場合だと、本文が12ptでも大きい感じることが多いです。
8~10ptが最適とされていますが、6ptにしてもまだ読めます。
注釈とかの場合は4ptかそれ以下にすることもありますので、Webとの感覚が大分違いますね。

違いについてまだまだたくさんありますが、また次回続いてご紹介したいと思います。
グラフィックからWeb制作にチャレンジしたい方や、逆のパターンもご参考になれれば幸いです。

最後宣伝になりますが、弊社ではWebだけではなく、グラフィックの分野においても経験豊富なデザイナーが在籍しておりますので、
興味のある方は是非こちらのページよりお問い合わせしてみてください。

-WEBデザイン, WEB制作

執筆者:


comment

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

関連記事

【Illustrator】幾何学模様の作り方

【Illustrator】幾何学模様の作り方

みなさまこんにちは、新人Aです。 三角形で作る幾何学模様の作り方をご紹介します。 これはパターンにするよりもランダムに色を置いていったほうが幾何学模様の雰囲気がぐっと増すと思うので、 少し面倒ですがパ …

Bamboo PadであなたのPCもタッチジェスチャーで意のままに!

Bamboo PadであなたのPCもタッチジェスチャーで意のままに!

PC使用時に画面上の画像などを拡大したい時、 思わず画面に親指と人差し指を添えて必死にズームしようとしたり、 スクロールしたい時に画面に指をスイッと滑らせたりして、 あ、これタッチできないんだ…とザン …

中国語サイトのスマートフォンサイト制作 は必要か?必須か?

中国語サイトのスマートフォンサイト制作 は必要か?必須か?

ChiKuu(チークー)という、海外で活躍するスポーツ選手や実業家、アーティストのつぶやきや最新情報などを翻訳してくれるウェブサイトに、新しい表示言語として簡体字中国語が加わりました。 ChiKuu. …

【ワイヤー作成をラクにする!】レスポンシブ・ウェブデザイン(RWD)向けワイヤーツール

【ワイヤー作成をラクにする!】レスポンシブ・ウェブデザイン(RWD)向けワイヤーツール

サイトの設計図とも言えるワイヤーフレームを作成することは、ウェブ制作において大事なステップです。 ワイヤーフレームとはサイトの大まかなレイアウト、必要な要素、コンテンツの優先順位を示したもので、ワイヤ …

普通の写真も一風変わった感じに!【Photoshopで写真をミニチュア風に加工】

普通の写真も一風変わった感じに!【Photoshopで写真をミニチュア風に加工】

デザインする時、「この素材写真イマイチだなー」と思ったことありませんか? ここで普通の写真をミニチュア風に加工するPhotoshopの小技をご紹介します。 STEP1 まず加工する写真をPhotosh …