五十音順
アイキャッチ
その名の通り「目を引く」ための画像。
記事やブログの冒頭に配置し、読者に“続きを読みたい”と思わせる役割を持つ重要なビジュアル。
アートボード・フレーム・キャンバス
デザインを作るときの“作業エリア”。
最初にサイズを設定する。
バナーなら指定サイズ、WebならPC幅・スマホ幅など、目的に合わせて設定するのが基本。
RGB/CMYK
RGB＝赤・緑・青の3色（光の三原色）を使って色を表現する方法。
パソコンのモニター、テレビ、デジタルカメラ等で使う。
CMYK＝シアン・マゼンタ・黄の3色（色の三原色）を使って色を表現する方法。
印刷（プリンター）で使う。
👉 Web用と印刷用では設定が違う。ここを間違えると色味が変わるので注意。
HTML
HTML（HyperText Markup Language）＝Webページを作るための最も基本的なマークアップ言語。
ハイパーテキストの各要素（リンク、画像、動画など）がどんな役割をしているのか（文書構造）をコンピューターに説明しているもの。
HTMLファイルはCSSや画像などの外部リソースを読み込んだ上で、ウェブ上に表示し、ユーザーはウェブサイトとして見ることができる。
Webページの「骨組み」。
LP(ランディングページ)
広告（バナー）の飛び先ページ（リンク先ページ）。ユーザーが広告などのリンクをクリックしたときに表示される、1枚の縦に長いWebページのこと。商品・サービスの訴求を行い、コンバージョン（成約）まで完結させることが狙い。
オブジェクト
テキストや図形などの物体の総称。
カーニング
文字と文字の間隔を調整すること。
文字を入力したままだと文字同士の間隔にバラツキがあるように見えるため、文章が読みやすく、美しくなるように文字間の余白を調整すること。「文字詰め」とも言う。
解像度
画像のきめ細かさ。単位は「dpi」。
Web：72dpi
印刷：300〜350dpi
👉 用途を間違えるとボヤける。
カスタマージャーニー
お客様が「知る→興味を持つ→比較→購入する」までのプロセスのこと。
ブランドや商品の認知から購買や登録までの、ユーザーの思考と行動を時系列に並べ可視化したものです。
画像圧縮
画像圧縮とは、ファイルのデータ量を最小化するために画像を圧縮させることです。
Webでは表示速度が命。
重い画像は離脱の原因になる。
グラフィックデザイン
グラフィックデザインは、テキストや画像、色などを使って見た人に情報やメッセージを分かりやすく伝えることを目的としたデザインです。新聞や広告ポスター、商品パッケージなどに使われます。
コーポレートサイト
企業に関するさまざまな情報を伝えるホームページ。どのような企業であるか知ってもらうことが主な目的。会社の詳細、トップのメッセージ、採用ページなどへのリンクがあることが多い。
コントラスト
ある要素と別の要素の「対比」
強調したい要素とそうでない要素を区別するために利用する。
“差”をつけること。
大きさ・色・余白で強弱を作る。
メリハリがない＝伝わらない。
座布団
テキストの視認性を高くするために、テキストのバックに敷かれた帯などのオブジェクトのこと。
「ベタ」などともいう。
CSS
CSS（Cascading Style Sheet）＝おもにHTML文書に対する表示、およびデザイン（見た目）を指定するもの。
CSSがないと文字と画像が並んだだけのウェブサイトになってしまう。
色、サイズ、配置などを指定する。
色彩心理学
色彩心理学とは、色の見え方や感じ方など、色に対しての人間の行動や反応を研究する心理学です。
色相
色合い。物を見たときに感じる赤、黄、青といった視感覚に対応する属性。色相をもつ色を有彩色、もたない色（白、灰、黒）を無彩色という。
また色相を連続的に配列し円環状に配置したものを色相環という。
視認性
「目で見た時の確認のしやすさ」という意味の言葉。
「可読性」「判読性」と同類の言葉ではあるが、パッと見た瞬間の文字や物などの認識しやすさを指す。
ジャンプ率
「大きい部分」と「小さい部分」の比率のこと。
比率が高い＝ジャンプ率が高い＝瞬時に情報を伝えたい時、インパクトを与えたい時に効果的
比率が低い＝ジャンプ率が低い＝高級感や信頼感を与えたい時に効果的
スクロール
PCやスマートフォンなどのデバイス操作画面で、ディスプレイに映す範囲を画面を上下左右に動かすこと。
スプラッシュスクリーン
アプリ起動時に表示される最初の画面。
タイポグラフィ
文字の見た目を整えること。
フォント・サイズ・行間・配置まで含む。
また、文字をデザイン要素として扱う手法という意味でも使われます。
テクスチャ
質感のこと。視覚的な触感を作り出すことができる。
紙っぽさ、ざらざら感、レトロ感などを演出できる。
他にもブラシで描いたような質感、インクがかすんだような質感、大理石のような模様を使った質感などもある。
デザインガイドライン
デザインのルールブック。
ブランドの統一感を守るために必要。
トリミング
不要な部分をカットして見せたい部分を強調すること。
トンマナ
トーン＆マナー（tone&manner）の略。
デザインや文章の雰囲気を統一するルール。
ナビゲーションメニュー
サイト上部や横にあるリンク一覧。
迷わせないための道しるべ。
また、どのページを開いても定位置に表示されるものを「グローバルナビゲーション」とも呼びます。
入力フィールド
Webサイト上でユーザーが情報を入力する欄。
バナー
ウェブサイト上にあるリンク付き画像のこと。
広告として、またはアイキャッチとして、他のウェブページやウェブサイトにアクセスを誘導するのを主目的として使われます。
パディング/マージン
パディング：内側の余白
マージン：外側の余白
ハレーション
彩度が高い派手な色同士で目がチカチカする現象。
どうしても使う場合は色と色の間に黒や白のセパレーションカラーを使うと良い。
ハンパーガーメニュー
ヘッダーのメニュー項目を表示させる三本線アイコン。
主にスマホで使うメニュー収納ボタン。
格納することでスペースが足りないデザインに対応できる。
スペースの問題から主にスマホ表示の時に使用することが多い。
PSD（ピー・エス・ディー）
「Photoshop Data」を略したもので、Adobe Photoshop の保存形式。
フォント
文字のデザイン（書体）。
フォントウェイト
書体の太さのこと。
フォントファミリー
同一フォントの中でも、「太さ（bold, thin）や傾き（Italic, oblique）、細さ（Condensed, Extended）」など複数のバリエーションが用意されているが、そのバリエーション全てをまとめたグループのこと。
フッター
サイト最下部のエリア。
ユーザーがホームページを閲覧する際、スクロールをし切って最後に辿るつくのがフッターです。
フレームワーク
UI制作を効率化する設計テンプレート。UIコンポーネントの総称です。
ヘッダー
サイト上部のエリア。
トップビジュアルとともに最初に目に入る重要部分。
ポップアップ
web上で突然に表示されるウインドウ。ウインドウに広告バナーなどが表示され、ユーザーに注意を引きたい時に使用される。
ホバーアニメーション
webサイト上において、マウスを乗せたときに動く演出。
ポートフォリオ
クリエイターが「実績や力量をアピールするための作品集」のこと。
企業に提出をしたり営業活動に使用する。
モーダルウィンドウ
操作が終わるまで閉じないウィンドウ。
モックアップ
英語で「模型」を意味し、完成イメージの見本。
ユーザビリティ
一般的に「使いやすさ」を意味し、UIデザインの指標のひとつです。
UI/UX（ユーアイ/ユーエックス）
UI（User Interface）とUX（User Experience）を組み合わせた言葉です。
UI：操作画面
UX：体験全体
UX（ユーエックス）デザイナー
「User Experience」と呼ばれる「ユーザーが商品やサービスに触れたときに得られる体験」の質を追求したデザインを作る人を指します。
ラインハイト
行間。
目安は1.5〜2。
レイアウト
要素の配置設計。
テキストや画像、動画などのサイトを構成する様々な構成要素に視覚的な表現を取り入れることを意味します。
レイヤー
デザインの重なり構造。文字や図形などのデザインの元となる要素の総称。
レイヤーを重ねていくことでデザインが作られていく。
レスポンシブデザイン
画面サイズに合わせて最適化されるデザイン。
ロゴ
企業やサービスを象徴するマーク。「ロゴマーク」の略称。デザインされたアイコンや文字です。対象の思想や特徴を伝達するコミュニケーションツールとして機能します。
ワードプレス(WordPress)
ワードプレス。サイトの作成やブログの作成などができるCMS(コンテンツ管理システム)の1つ。世界中のサイトのおよそ4分の1はWordPressで構築されていると言われている。
ワイヤーフレーム
サイトの設計図。
どのようなコンテンツを画面上のどこに、どのように配置するかを決めるものであり、Webサイトの制作やアプリ開発に欠かせません。
コメント