ごちゃごちゃに使ってない?間違いやすいデザイン用語15個まとめ

15-mistakable-terms-top-2-1

 

デザインに関して話をするときに、専門的な用語を必要とするケースがしばしばあります。その中には、あまり意味が分からずに使っていることはないでしょうか。

 

今回は、デザインの現場で毎日のように利用される用語のうち、特に間違えやすいものを集め、その重要な違いを覚えておくために作成されたインフォグラフィックス 15 Design Terms We Always Get Wrong をご紹介します。

 

1. 書体とフォントの違い

mitakable-terms1

 

日本語では「書体」とも呼ばれる「タイプフェイス」。

書体とは、表示・印刷などに用いるために、美的感覚に基づき、字体を統一的にデザインした文字のスタイルのことを指しています。
– 引用元 : 書体とフォントの違いは何ですか? | JAGAT

フォントとは、元来欧文活字の用語で、1つの書体の文字サイズごとに作られた大文字・小文字・数字・記号類のセットのことを意味します。
– 引用元 : 書体とフォントの違いは何ですか? | JAGAT

もともと金属活字印刷の頃から使われている用語で、同じ特徴を持ったアルファベット文字や数字のセットを示したものをフォントと呼んでいました。当時は、判子のようにアルファベットを並べていたため、文字サイズが変わると異なるフォント名で呼ばれていたそう。今では、コンピューターで手軽にフォントサイズを変更できるため、あまり区別されず使われることも。

 

 

2. レタリングとカリグラフィの違い

mitakable-terms2

文字を効果的使って何かを表現する手法全般を指してタイポグラフィと呼びますが、内、手書き文字がレタリング、内、ペンによる装飾手書き文字がカリグラフィ。
引用元: レタリングとカリグラフィーの違いを教えて下さい。

手書きされた文字は「レタリング」、その中でもペンによる装飾がある場合は「カリグラフィ」。より詳しい説明は、こちらのサイトで紹介されています。

 

 

3. リーディングとトラッキング、カーニングの違い

mitakable-terms3

 

  • リーディング(英: Leading): 文字テキストの縦方向のスペースを指し、ベースラインからベースラインまでの長さということになります。
  • カーニング(英: Kerning): 文字間のスペースを調整することで、ギャップをなくし、幅を均一にします。文字と文字の間を、隣りの文字に合わせて間隔の調整も可能です。
  • トラッキング、字送り(英: Tracking): 文字、単語同士の間隔を調整することを指します。(文や一行、パラグラフ、ページなど)なお、文字テキストの右側部分のみ調整することができます。

【図解付き!】知っておきたいタイポグラフィ用語完全ガイド

 

4. ベクターとラスターの違い

mitakable-terms4

 

  • ベクター画像は、アンカーと呼ばれる座標の点同士を線でつなぐことで表示しており、拡大縮小も問題なく行うことができます。
  • ラスター画像は、もバイクのような小さなピクセルからできています。このためズームしすぎると、画像はぼやけてしまいます。

 

 

5. 覆い焼きと焼きこみツールの違い

mitakable-terms5

 

Photoshopでデザイン編集を行うときに迷ってしまう2つのツール。明るくしたいときは「覆い焼きツール」、暗くしたいときは「焼きこみツール」を利用しましょう。

 

 

6. 不透明度と透明度の違い

mitakable-terms6

 

不透明度(英: Opacity)は、グラフィックレイヤーの可視性をコントロールし、透明度(英: Translucency)は新しいレイヤーを作ることなく、少し透けたような見た目を表現するデザインテクニック。

 

 

7. 不透明度と塗りの違い

mitakable-terms7

 

Photoshopのレイヤーパネルで見かける「不透明度」と「塗り」。「不透明度」を下げると、適用されている効果も薄くなる。「塗り」を下げると、適用されている効果はそのまま残ります。

 

 

8. レタープレスとエングレービングの違い

mitakable-terms8

レタープレス(英: Letterpress)は、刷りたい部分が高くなっている版(凸版)にインキをつけ、そこへ圧力をかけて、紙に転写する印刷方法です。 日本語では「活版印刷」「凸版印刷」と訳されます。
引用元: What is Letterpress

エングレービング(英: Engraving)とは、銅版を写真製版やグレーバーで彫刻し、インキをつめて紙に転写する印刷技法です。
引用元: エングレービング | Wikipedia

 

9. ネガティブスペースとホワイトスペースの違い

mitakable-terms9

 

特に違いはありません。どちらの用語も自由に利用することができます。

 

目の錯覚を利用しよう!ネガティブスペースの実践テクニック&参考例50個まとめ

基本原則「色、文字、余白」で極める、伝わるデザインのコツまとめ

 

10. OTF と TTF の違い

mitakable-terms10

 

TrueTypeとOpenTypeの違いを一言で言えば「形式の違い」です。どちらもWindowsやMacの中でフォントとして機能する点では同じですが、TrueTypeのほうが歴史が長く、広く普及済みのフォント形式。一方、OpenTypeのほうはTrueTypeの弱点を大きくカバーした新たな形式で、高機能かつ余裕のあるフォント形式となっています。
引用元: TrueTypeとOpenType、どう選べばいい? | FontNavi

 

11. Rem と Em, Px の違い

mitakable-terms11

 

  • Pixels : 入力した数値どおり。
  • Em : 親要素に関連しています。たとえば、0.5em = 50%、2em = 200%となります。
  • Rem : 要素のフォントサイズに関連しています。何重にもネスト状になっているときなど、emを使いにくいときに。

 

 

12. PPI と DPI の違い

mitakable-terms12

 

PPI は Pixels per Inchの略で、DPI は Dots per Inchの略。Photoshopのような画像処理をするソフトではppiを用いていて、dpiは出力機器、モニタ、スキャナ、プリンタで使います。

 

 

13. トリミングとクロッピング、ブリーディングの違い

mitakable-terms13

 

  • トリミングは、写真イメージから不要なピクセルを削除すること。
  • クロッピングは、洗濯している範囲以外のすべてを削除します。
  • ブリーディングは、印刷後に実際に切り取られる部分を指します。

 

 

14. X-ハイトとラインハイトの違い

mitakable-terms14

 

  • X-ハイト(英: X-Height)は、小文字(“o”のような曲がった頭部や、“l”のように ascender を持つものではなく、“x”や“z”や“v”などの平らな頭部のもの)のベースラインからの高さを指します。
  • ラインハイト(英: Line Height)は、文字全体の高さを指します。

 

 

15. イタリック体と斜体の違い

mitakable-terms15

 

斜体(英: Oblique)は、角度を傾けただけで文字に変化はありません。イタリック体(英: Italic)も斜めに傾いていますが、より華やかな見た目にするために、一部の文字に変更が加えられています。

 

 

いかがでしたか、すべてのデザイン用語をきちんと理解しておくことが重要です。各ポイントをまとめたインフォグラフィクスが公開されています。迷ってしまったときに確認してみてはいかがでしょう。

15-terms-we-always-get-wrong

 

 

参照元リンク : Infographic: Design Terms We Always Get Wrong – Creative Market Blog