SHINOBLOG

WEBデザイナーを目指す人向けブログ

仕事の内容

【初心者必見】WEBデザイナーが現場でよく使う用語35選(前編)

投稿日:2019年6月15日 更新日:

【初心者必見】WEBデザイナーが現場でよく使う用語30選(前編)

  • WEB業界は用語が難しくて覚えるのが大変…
  • 毎日聞いたことない単語が出てくる…
  • 横文字多すぎ…

こんにちは、フリーランスWEBデザイナーのSHINOBUです。

IT業界には英語を略した専門用語が多く、他の業界と比べても横文字の使用頻度が高い気がします。

WEB関係の仕事に就いたばかりの人は特に、聞き慣れない用語を覚えるのにも一苦労です。
そこで、この記事では初級者WEBデザイナーが、初めに知っておきたい35個の用語を説明していきます。
前編では、まず19個の用語を見ていきます。(続きは【後編】でお伝えしていきます)

初級者の方はいくつわかるかチェックしてみてください。
脱初級者の方は、答え合わせで確認してみてください。

では、早速見ていきましょう!

WEBデザイナーが知っておきたい用語35選(前編)

35個の用語を解説していきますが、前編ではまず19個をお伝えしていきます。

デザイン周りの用語

1. CMYK・RGB

色の表現の仕方を意味する言葉。
CMYKは減法混色、RGBが加法混色。
難しい説明は割愛し、わかりやすく言うと、DTP(紙のデザイン)の時にはCMYKを使用し、WEBデザインではRGBを使用します。

2. ワイヤーフレーム(WF)

デザインを作る前の「骨組み」となるもの。
構成を、目に見える形で確認し、お客さんと制作側とで認識を合わせるために使います。

3. カンプ

ワイヤーフレーム以上、デザイン未満の状態のものをカンプと言います。
本番デザインほど細部まで作り込みはせず、色合いや雰囲気、レイアウトを確認できる程度に、デザインの下準備として作ります。

4. MVP

Minimum Viable Product の略。
簡単に言うと、WEBサイトやWEBサービスにおける、リリース前のβ版をMVPと言います。
最低限のデザインと機能を実装をした上で、リリース前に仮説検証・効果測定をするという目的で作られます。
「時間かけて作り込んだものの、いざリリースしたら全然ダメだった」というリスクを最小限に減らすため、まずはMVPでテストを行うという考えで作られます。

5. プロトタイプ

MVPの一つの手段です。
方法としては、次のようなものがあります。
・ 紙に手書きで再現する
・ AdobeXDやSketchなどのルーツを使って画面遷移を実現する
など。

この時点ではデザイン要素は皆無でも良くて、実際のサービスイメージが湧くような体験ができればOKです。

6. トンマナ

トーン&マナーの略。簡単に言うと、「雰囲気」です。
デザインに一貫性を持たせるためのルールとも言えます。
例えば「可愛い系のサイトだから色は全体的にパステルピンクに統一して、フォントはポップな感じで」というような共通認識としての雰囲気を表す言葉です。

7. UI/UX

UIUXは一言でまとめられた状態でよく耳にします。
ただ意味するところはUIとUXとで明確に異なります。
UIとはユーザーインターフェースを略した言葉です。
直訳としては「ユーザーと〇〇の接点になるもの」という意味合いになります。〇〇には様々なものが入りますが、例えば「ユーザーとWEBサービスの接点」と言えばWEBサイトになります。「ユーザーとメールの接点」の場合、PCやスマホと言うこともできます。

一方でUXとは、ユーザーエクスペリエンスを略した言葉です。
意味合いは「ユーザー体験」という直訳そのものです。例えば、ユーザーがあるWEBサービスを使って「どんな体験をしたか」、またそれによって「どんな感情になったか」などを表します。

8. ベクター・ラスター

画像の形式を表す言葉です。
ベクター形式とは、数値の計算によってオブジェクトを表示するものです。特徴としては、拡大しても画像荒れを起こさないことです。

ラスター形式は、ビットマップ画像とも呼ばれ、小さな点を集めてオブジェクトを表示するものです。精密な表現に向いていますが、拡大表示すると画像荒れを起こします。

この辺りは専門的な内容で小難しいため、詳細は以下の記事を参考にご覧ください。
>>>PhotoshopとIllustratorの違いは?どっちを勉強するべき?用途を簡単解説

9. SVG JPG PNG

画像の種類を指します。
SVG(エスブイジー)はベクター形式で、荒れを起こさないため拡大に強い画像と言えます。WEBサイトでは、ロゴの部分で使うことが多いです。
JPG(ジェイペグ)とPNG(ピング)はラスター形式の画像です。
それぞれ使用頻度の高い形式です。PNGが特徴的で、背景を透過させることができます。
JPGは、JPEGとも書きます。

10. セリフ・サンセリフ

セリフ体とサンセリフ体は、フォントのジャンルの一つです。
セリフ(serif)は英語で、文字の先端の装飾を指します。

サンセリフ(Sans-serif)はフランス語で、「セリフがない」という意味になります。

WEB制作全般の用語

11. レスポンシブ

正式には、レスポンシブWEBデザイン。
PC、スマホ、タブレットと、多岐にわたるデバイスごとで、それぞれのサイズに適した表示が考慮されたWEBデザイン。

12. LP(エルピー)

LP(ランディングページ、ランぺ)は、使われ方としては大きく2つあります。
1つ目としては、「縦長1枚のWEBサイト」を言い表す時によく使われます。
2つ目としては、純粋に「landing」つまり着地ページを言い表す際に使います。
LPは、集客や商品購入などのコンバージョンを目的としたページと言えます。

13. モバイルファースト

WEBサイト・サービスを作る際、スマホユーザーを優先的に考慮する考え方です。
スマホユーザーの数が圧倒的に増えているという背景を踏まえています。

14. ファーストビュー(FV)

ユーザーがサイトに訪れて、一番最初に目にする部分(主にページ最上部)を言います。
メインビジュアル(MV)や、キービジュアル(KV)、ヒーローイメージと言ったりもします。

15. カラム

カラムとは、表示画面の縦の区切りを表す言葉です。
1カラムは、サイドメニューがない1列のデザインです。
2カラムは、当サイトのようにメインコンテンツとサイドメニューの2列からなるデザインです。

16. ドメイン

このサイトのURLは、https://shinoblog.net になりますが、ドメインというのは 【 shinoblog.net 】 の部分になります。

ドメインはよく「インターネット上の住所」と例えられます。インターネット上の無数の情報の中から自分のサイトを見つけるためには、特定の「目印」が必要であり、その役割をドメインが担っています。

17. アナリティクス

Googleアナリティクスという、Googleが提供している無料のデータ収集ツールです。
サイトにコードを埋め込むと、訪問者数やページビュー数など、サイトに関するあらゆるデータを収集できます。

18. Chrome・IE・FireFox・Edge・Safari

Chrome(クローム)、IE(Internet Explorer、アイ・イー)、FireFox(ファイアフォックス)、Edge(エッジ)、Safari(サファリ)は、ブラウザの名前です。これらは今もっとも使われているメインブラウザに当たります。
ブラウザとは、WEBサイトを閲覧する際のソフトで、このページもブラウザを介して閲覧されていることになります。

19. オフショア開発

オフショア開発とは、制作業務を海外の企業や、海外にある現地法人に委託するという開発方法です。
コストを抑えることを目的とし、中国やベトナム、フィリピンといった、比較的に人件費の安い国へ発注します。

後編に続く

ここまで19個の用語を説明してきましたが、これらはまだまだほんの一部です。
引き続き、【後編】で16個の用語を解説しますので、参考までにご覧ください。

初めは聞きなれず覚えるのが大変かもしれません。
ただ、仕事をする中で自然に覚えていきますし、用語の意味をたくさん理解している方が話がスムーズに進むシーンがたくさんありますので、一読程度に見てみるだけで少し違ってくるかもしれません。




  1. […] に就いたばかりの人は特に、聞き慣れない用語を覚えるのにも一苦労です。 この記事では【前編】に引き続き、初級者WEBデザイナーが初めに知っておきたい35個の用語を解説していきます […]

  2. […] 関連記事 >>> 【初心者必見】WEBデザイナーが現場でよく使う用語35選(前編) (adsbygoogle = window.adsbygoogle || []).push({}); […]

comment

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

おすすめ記事

プロフィール画像
 
SHINOBU

フリーランスのWEBデザイナー兼フロントエンドエンジニア。イラストレーター。
新卒は某ベンチャー営業職→半年間WEBを勉強→WEB制作会社入社→フリーランス転身。現在はIT大手のクリエイティブチームに所属しながら、プロジェクト単位で複数チームに参加。
4大卒で、デザインの勉強は25歳から。美大でもない、経験もない。そこから2年後フリーランスとしてスタートするまでのこと、そしてフリーになってからの色々なことを記録していきます。