WEBデザイナーの仕事で使われる用語は英語が多い。一覧で確認!

WEBデザイナーの仕事で使われる英語を知ろう

今回はWEBデザイナーの仕事で良く使われる英語の用語を一覧でご紹介します。

多すぎるの一部の紹介にはなりますが、これからWEBデザイナーをしてみたいなと思っている方は、ぜひ参考にしてくださいませ。

※当記事はChatGPTを参考に記載しています。

目次

WEBデザイナーの仕事で良く使われる英語(用語)

UI design (ユーザーインターフェイスデザイン):ウェブサイトやアプリなどのユーザーインターフェイスのデザインを行うこと。主に、ユーザーがサイトやアプリを使用する際の視覚的な面を担当する。

UX design (ユーザーエクスペリエンスデザイン):ウェブサイトやアプリなどのユーザーエクスペリエンスのデザインを行うこと。主に、ユーザーがサイトやアプリを使用する際の操作性や使い勝手、満足度などを担当する。

Wireframe (ワイヤーフレーム):ウェブサイトやアプリの設計段階で、ページや画面の構成や配置を示した簡単なスケッチ。主に、コンテンツの配置やページの流れを検討する際に使用される。

Mockup (モックアップ):ウェブサイトやアプリの設計段階で、画面のデザインやレイアウトを表現した実物大の模型。主に、設計段階のイメージを確認したり、クライアントや関係者にプレゼンテーションする際に使用される。

Prototype (プロトタイプ):ウェブサイトやアプリの開発段階で、画面の操作や動作などを実際に体験できる、仮の製品。主に、ユーザーテストを行ったり、機能の正確性や操作性を検討するために使用される。

Responsive design (レスポンシブデザイン):ウェブサイトやアプリのデザインの一種で、端末や画面サイズに応じてレイアウトを最適化すること。主に、PCやスマートフォン、タブレットなどのさまざまな端末に対応するために使用される。

Front-end development (フロントエンド開発)ウェブサイトやアプリの開発の一種で、ユーザーが直接操作する部分の開発を担当すること。主に、HTMLやCSS、JavaScriptなどの技術を使用して、ユーザーが直接触れる画面の表示や操作を実現する。

Back-end development (バックエンド開発):ウェブサイトやアプリの開発の一種で、サーバーサイドのプログラミングを担当すること。主に、データ処理やサービスの提供、データベースの管理などを行い、フロントエンド開発で作成した画面の裏側で動作するシステムを実現する。

HTML (ハイパーテキストマークアップ言語):ウェブサイトやアプリの構造やコンテンツを記述するマークアップ言語の一種。主に、タグを使ってテキストや画像、音声などのコンテンツを配置する。

CSS (カスケーディングスタイルシート):ウェブサイトやアプリの見た目を設定するための言語。主に、HTMLで記述されたコンテンツに対して、レイアウトや色、フォントなどのスタイルを設定する。

JavaScript (ジャバスクリプト):ウェブサイトやアプリの動作や動的な処理を実現するためのプログラミング言語。主に、イベント処理や動的な表示、フォームのバリデーションなどを実現する。

CMS (コンテンツ管理システム):ウェブサイトのコンテンツを管理するためのシステム。主に、投稿や更新、削除などのコンテンツの管理や、テンプレートの変更などを行うことができる。

SEO (検索エンジン最適化):ウェブサイトの検索エンジンでの表示順位を上げるための施策。主に、キーワードの選定やタイトルタグ、メタデータの設定、コンテンツの品質改善などを行うことで、検索エンジンでのアクセスを増やすことを目指す。

A/B testing (A/Bテスト):ウェブサイトやアプリの改善や改良のためのテスト手法。主に、2つの異なるバージョンを比較して、より良い結果を出す要素を検討することで、コンバージョン率の改善などを目指す。

Analytics (アナリティクス):ウェブサイトやアプリのアクセス状況やユーザー行動などを分析するためのツールや手法。主に、訪問者数やページビュー、コンバージョン率などのデータを収集し、その分析結果をもとに改善策を検討することができる。

Landing page (ランディングページ):特定の目的に合わせて作成された、訪問者が最初にアクセスするページ。主に、広告やキャンペーンなどでアクセスを集め、訪問者に特定の情報を提供したり、コンバージョンを促進するためのページとして使用される。

Call-to-action (CTA):ウェブサイトやランディングページなどで、ユーザーに対してアクションを促すボタンやリンクなどの要素。主に、コンバージョン率の向上を目的として、ユーザーに対して明確な行動を促すために使用される。

Above-the-fold (画面の上部):ウェブサイトやランディングページなどで、画面の上部に表示される領域のこと。主に、訪問者が最初に見る部分であり、コンテンツの配置や表示方法によって、訪問者の興味や関心を引くことができる。

Navigation (ナビゲーション):ウェブサイトやアプリなどで、ページ間の移動やコンテンツの閲覧を行うためのメニュー。主に、ユーザーが目的のコンテンツにアクセスしやすくするために使用される。

Typography (タイポグラフィ):ウェブサイトやアプリなどで、文字の見た目やスタイルを設定すること。主に、フォントの種類やサイズ、色などのスタイルを設定し、文字の視認性やデザイン性を向上させることができる。

Color scheme (カラースキーム):ウェブサイトやアプリなどで使用するカラーの組み合わせのこと。主に、企業のCIやイメージに合わせたカラースキームを設定し、デザインの統一感や視認性を向上させることができる。

Grid (グリッド):ウェブサイトやアプリなどのデザインにおいて、レイアウトやコンテンツの配置に使用される線やマス目のこと。主に、グリッドを使用することで、コンテンツの配置やバランスを調整し、見やすいデザインを作成することができる。

Icon (アイコン):ウェブサイトやアプリなどで使用する小さな図形のこと。主に、機能やコンテンツを象徴するアイコンを使用することで、デザインの視認性や使い勝手を向上させることができる。

Image optimization (画像最適化):ウェブサイトやアプリで使用する画像を最適化すること。主に、画像のサイズや解像度を最適化することで、ページの表示速度を向上させ、ユーザーのストレスを軽減することができる。

Vector (ベクター):ウェブサイトやアプリなどで使用する画像の形式の一つ。主に、拡大・縮小しても画質が劣化しない、編集がしやすいといった特徴がある。

Pixel (ピクセル):ウェブサイトやアプリなどで使用する画像やディスプレイなどの画面の単位。主に、画像の解像度やディスプレイの表示領域を表現するために使用される。

DPI (ドットパーインチ):画像印刷などで使用する画像の解像度の単位。主に、画像の詳細度や精細度を表現するために使用される。

Serif (セリフ):フォントの種類の一つ。主に、縦線の端に飾りのある文字のことを指す。

Sans-serif (サンセリフ):フォントの種類の一つ。主に、縦線の端に飾りのない文字のことを指す。

Kerning (カーニング):フォントの文字間隔を微調整すること。主に、文字間のバランスや視認性を調整するために使用される。

Leading (行送り):フォントの行間隔を設定すること。主に、文章の読みやすさや視認性を向上させるために使用される。

RGB (赤緑青)ウェブサイトやアプリなどで使用するカラーコードの一種。主に、赤、緑、青の3つの色を組み合わせて、カラーを表現する。

Hexadecimal code (16進コード):ウェブサイトやアプリなどで使用するカラーコードの一種。主に、0から9までの数字とAからFまでのアルファベットの組み合わせで、カラーを表現する。

Gradient (グラデーション):ウェブサイトやアプリなどで使用するカラーの変化を表現する方法の一つ。主に、複数のカラーをグラデーションでつなげ

UI kit (ユーザーインターフェイスキット):ウェブサイトやアプリのデザインに必要なアイコンやフォント、UI要素などをまとめたセット。主に、デザインの統一性を保ちつつ、効率的にデザインを行うことができる。

WEBデザイン
画像引用元:Adobe Stock

まとめ

今回は「WEBデザイナーの仕事で使われる用語の英語」についてご紹介しました。

まだまだありますが、今回ご紹介した用語は結構頻繫に使われます。

勉強し始めの頃は「何を指しているの?」となりがちですが、何度も使っていくうちに覚えていきます。

WEBデザイナー間のやりとりでは知っていて当たり前と思われる用語もあるので、ぜひ参考にしてくださいませ。

  • URLをコピーしました!

この記事を書いた人

カツのアバター

カツ

サイト運営者のカツです。私は2017年9月からフリーランスとして活動しています。主に、Webサイト制作やデザインのお仕事などを行っています。

目次