FEユーザーインタフェース · UX/UIデザイン

メディアクエリ

Media Query

めでぃあくえり

CSSで画面の幅や向き、解像度といった条件を指定し、条件に応じたスタイルを適用する仕組み。1つのHTMLでPCとスマートフォンの両方に対応する、レスポンシブWebデザインの中核技術。

共有:

Past Exams

過去問での出題

過去問で 1 回出題（応用情報技術者試験 1）

出典: 独立行政法人情報処理推進機構（IPA）の過去問題。問題文は IPA のサイトの PDF で確認できます。「選択肢」は、問題文ではなく選択肢に出たものです。用語名で照合しているため、関係の薄い問題が含まれることがあります。

PC、タブレット、スマートフォンなどの画面サイズに応じて、レイアウトやコンテンツの表示を自動的に最適化するWebデザイン手法。メディアクエリやフレキシブルグリッドを使用して実現する。

Webサイトやアプリケーションの設計において、スマートフォンなどのモバイル端末での表示・操作を最優先に設計し、その後にPC向けを拡張していくアプローチ。

JavaScriptからサーバへ非同期に通信し、ページ全体を読み込み直さずに画面の一部だけを更新する手法。地図のスクロールや入力候補の表示など、応答性の高いWebアプリケーションの実現に使われる。

Webサーバ側でプログラムを動かし、データベース参照などの結果からページを生成する方式。処理内容を利用者に見せずに済み、機密データを扱える。対して利用者の端末で動かすものをクライアントサイドという。

Webブラウザ側の画面作成を効率化する枠組み。画面を部品（コンポーネント）に分けて組み立て、データの変化に応じた表示更新を自動化する。ReactやVue.jsなどが広く使われている。

Webページを動的に生成する用途に特化したスクリプト言語。HTMLの中に直接プログラムを埋め込んで書ける。データベースとの連携が容易で、多くのWebサイトやCMSで使われている。