【保存版】今更聞けないWebデザイン用語集

さまざまな職種につきものな専門用語。Web業界にも多くの専門用語があり、戸惑う方も多いと思います。今回は、抑えておくべき30個の専門用語を紹介します！

すでにご存知の方もきちんと理解できているかチェックしてみてください！

１．Webに関する用語

まずは、Webに関する用語です。

コーディング

文字の通り、コンピュータ言語でコードを書くことです。Webの場合はhtml,css,php, JavaScriptなどがあります。

多くの場合はデザインが決まった後にコーディング（組み立て）に入ります。

HTML（Hyper Text Markup Language）

Webページを作成するために使用する言語です。

インターネット上で閲覧できるwebページのほとんどにhtmlが使われています。Webページの基本構造を定義するための言語です。

css（Cascading Style Sheets）

Htmlやxhtmlに見た目の装飾を加えるスタイルシート言語の1つです。

php（Hypertext Preprocessor）

動的なコンテンツの作成に向いているプログラミング言語です。HTMLと組み合わせて使用することができます。

cms（Contents Management System）

コンテンツ（Webサイト）を管理したり、更新システムのことを指します。

jpeg/gif/png

画像データに使われる拡張子の種類を指します。それぞれに特徴があり、用途によって使い分ける必要があります。

UI（User Interface）

ユーザーの目に触れ、使用する部分の総称です。ユーザーの視覚的に触れるすべての情報がUIとなります。

UX（User Experience）

体験、経験を意味し、製品やサービスを通して得られる体験のことを言います。

例：注文したら商品が届く、電話番号をタップすると電話をかけられる等

ユーザビリティ

使用性を意味します。使いやすさ、使い勝手という意味で使われることが多いです。

レスポンシブ

PC、SP等異なる画面サイズの幅に柔軟に対応し、Webサイトを最適な表示にすることを指します。

コンバージョン

サイトを訪問したユーザーが商品を購入したり、サービスを利用することを指します。

広告出稿の目的となる特定のアクションのことをコンバージョンと呼びます。

モバイルファースト

スマートフォンでストレスを感じること無くサービスを利用できるデザインのことです。

また、スマートフォンに向けたサイトを優先的に制作するという意味でも使われています。

SSL（Secure Sockets Layer）

インターネット上で、個人情報やクレジットカードの情報などの重要なデータを暗号化し、サーバとPCの間での通信を安全に行うことができる仕組みのことを言います。

ABテスト

サイトやバナーなどの成果の改善・計測のために、ある期間で2パターン用意したものでどちらがよりよい効果があるかを検証することです。

SEO

検索エンジンの最適化を行うという意味で、検索エンジンの検索結果の上位にWebページを表示させることを言います。

２．デザインに関する用語

続いては、デザインに関する用語です。

あしらい

デザインの装飾、ディティールのことです。

psd/ai

Adobe Photoshopのデータの拡張子をpsd、Adobe Illustratorのデータの拡張子をaiといいます。

ファーストビュー

ブラウザでwebページを開いたときに表示される領域のことです。

LPなどでは特に、最も重要であると言われています。

カーニング

文字と文字の余白を揃えることです。文字間の余白を揃えることで、読みやすく、美しくします。

トンマナ

トーン＆マナーの略。デザインの色味や雰囲気、フォントに一貫性を持たせることです。

LP

商品やサービスに特化したWebページのことを言います。主にWeb広告で使用されます。

ヘッダー、フッター

Webページの上端の領域をヘッダー、下端の領域をフッターといいます。

ヘッダーには会社ロゴやサービスロゴ、フッターには会社情報などの情報を入れます。

カルーセル

一定の領域に複数の画像を配置し、ユーザーのアクションや一定の時間で画像がスライドする手法のことを指します。

ワイヤーフレーム

Webページのレイアウトを決める設計図のことを言います。

サイト制作では欠かせないものとなっており、略してワイヤーと呼ばれることもあります。

パンくず

サイトのトップページからアクセスしたときに「トップページ＞商品一覧＞商品情報」のように、ページがどこの階層に位置しているかを表示するものです。

ナビゲーション

サイトのコンテンツを行き来するためのリンクがまとめられているメニューです。グローバルナビゲーション、ローカルナビゲーションなどがあります。

ホバー

画像やボタンにカーソルを合わせるとアニメーションが起こるような表現のことを言います。他にも、マウスオーバーなどの言い方があります。

カラム

Web上ではレイアウト、段組みの意味です。

レイアウトの列の数によって2カラム、3カラムというように表現します。

ベクター

点と点を結ぶ線などの数値データをもととして、描画する形式の意味です。

特徴として、どれだけ縮小、拡大、変形しても品質が保たれ、劣化をすることはありません。主にAdobe Illustratorなどで編集が可能です。

レンポジ

ストックフォトサービス等で利用できる写真素材のことを指します。

３．まとめ

いかがでしたか？

まだまだ書ききれていない用語がたくさんあります。移り変わりが早い業界ですので、アンテナを張って最新のものをキャッチしておくよう心がけましょう。