DTPからWEBデザインに転身する上で気をつけるべき事

今は和風デザイナーとしてホームページを中心に制作している私ですが、元々は旅行パンフレット制作会社の編集・ライターでした。

WEB業界に入って苦労したことは、上司からは『ダサい』クライアントからは『何か違う』と言われ続ける日々が続きました。

そんな日々から抜け出した様々な気付きを紹介していきます。


使うツールが違う

DTPとWEBデザインではツールの使用方法やツールそのものが違ったりします。なので、WEBデザインを始める際にはどのツールをどういうタイミングで使うか整理する必要があります。

【DTP使用ツール例】
InDesign&Illustrator:レイアウト
Photoshop:写真加工と補正
Illustrator:素材作成

【WEBデザイン使用ツール例】
Photoshop:レイアウトと写真加工補正
Illustrator:ロゴやイラスト作成
※元々印刷会社でWEBを始めた会社ではレイアウトもIllustratorでやることが多いみたいです


デザインの違い:金赤白抜きはWEBではダサすぎる

DTPでよく耳にした指示は「金赤白抜きで目立たせる」というものです。
これはWEBではあんまり聞きませんし使いません。

WEBデザインをやってみて感じるのはもっと曖昧な指示が来る事が多いです。もっと目立たせたいからどうにかして!とか

そんな時に天下の宝刀『金赤白抜き』を使ってしまうと大目玉を食らってしまいます。実際に怒られた事があります。

旅行パンフレットと言うのはその特徴がらか様々な色を使い、写真を詰め込み、文字を組んでいきます。
そんなごちゃごちゃした中で一番目立つのが金赤白抜き(金赤下地に白文字)なのでしょう・・・

WEBは後で書きますが空間にゆとりを持たせて見やすくするという特徴を持っています。
必然的に金赤白抜きは目立ちますがすごく浮くわけです。

赤に白抜きはあんまり使わないですが、
まれにWEBデザインで使う事がありますが色の感じやデザインに気を使ってかなり気を使います。


デザインの違い:WEB使えるフォントを覚える

DTPの場合は多くのフォントを使用する事が出来ます。
本文ごと、見出しごとにフォントを変えたりすることもしばしば・・・

ですが、ホームページではそうも行きません。
なぜなら、ホームページでは使えるフォントが限られてくるからです。

使えるフォントが限られる理由としては画像以外のフォントは基本的にサイトを見るユーザーのPCに入っているフォントしか表示されません。

他にもWEBフォントと言ってgoogleなどが提供しているフォントやサーバー上にフォントをアップロードして表示する方法もあります。ただし、サーバー上にフォントをアップする場合は、規約違反になるフォントもあります。規約は必ず確認してください。

WEBフォントにかんしては、サイトが重くなってしまうので基本的に3つ以上フォントを読み込ませるのはNGと言われています。

サーバーにアップして使う場合は1つでも、サイトがものすごく重くなってしまいます。


デザインの違い:色を使いすぎない

パンフレットなどでは企画事、ページ毎で色合いをあえて変えたりします。
ホームページで統一感がなくなってしまいます
※ランディングページや企画ページは別です。

よく言われるのは3色でデザインをしなさいです


デザインの違い:詰め込むのではなく空間を楽しむ

パンフレットなどはいわば積み上げるデザインが多いと思います。
隙間を詰めて、隙間が空いたらもったいないから写真やイラストを入れたり、金赤白抜きでキャッチを入れたりします。

WEBではその隙間をどう見せるかがキーになってきます。

紙と違いWEBは縦がいくらでも長くできますし、
やりようによっては横幅も無限です。

なので、見やすさ空間の取り方でメリハリをつけたり、目立たせたりする事が大切になってきます。



用語が違う:Q数とは言わない?

「Q上げ、長体かけて行間そろえる」
WEBの方はおそらくわからないのではないでしょうか?

翻訳すると・・・
「フォントサイズを大きくして行間そろえるためにフォントを長細くして」

そのほかにもトルツメやトルイキなどほとんど通じません。
業界用語は使わずに素直な心でコミュニケーションをとりましょう!


まとめ

WEBとDTPは本当に違うメディア、違う生き物だという事をわかっていただきましたでしょうか?

一からやり直すぐらいの気持ちで臨みましょう。
知ったかしてしまうと怒られるだけなので注意です

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

19

#デザイン 記事まとめ

デザイン系の記事を収集してまとめるマガジン。ハッシュタグ #デザイン のついた記事などをチェックしています。広告プロモーションがメインのものは、基本的にはNGの方向で運用します。

コメント2件

今、DTPからWEBの勉強しているところです。今までいかにWEBの人たちに無理難題を押し付けていたか自覚し、反省している日々です。初心に戻り一から頑張ります。
コメントありがとうございます!
henryfun9さんのようにwebに寄り添ってくださる方はありがたいですよ!DTPとWEBの差に気がつかないでずっといる人は結構いますので!
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。