Web関係の用語を調べて、書き留めています。
(※「自分なり」の調べものですので、正確な情報をお求めの方は各自お調べください 。)
か
カルーセル ( 訳「回転木馬」 )
画像やコンテンツをスライドさせて切り替える仕組み
「スライドショー」「スライダー」と同意
クローラー
ウェブ上の情報を自動で収集するプログラムのこと
ウェブ上のリンクをたどってページを訪問し、内容を分析・保存して検索エンジンやデータ収集に活用される
「スパイダー」や「ボット」とも呼ばれる
さ
ジャンプ率
本文の文字サイズに対する見出しの文字サイズの比率のこと
比率が大きいことを「ジャンプ率が高い」といい、比率が小さいことを「ジャンプ率が低い」という
スキューモーフィズム
なじみのない新しいものを既存のなじみのあるモチーフに似せること
アイコンやボタンなどに、影や重なり、質感などの効果をつけ、身の回りにあるものに似せる(近づける)手法
た
タスクランナー
開発作業の自動化を助けるツール
手動で繰り返す作業を効率よく自動化し、時間を節約できる
- CSSのプロパティを並べ替える
- CSSにプレフィックスをつける
- SassをCSSにコンパイルする
- 画像やCSS、JavaScriptを圧縮する など
ディレクトリ
「ディレクトリ」の英単語は、住所氏名録や名簿などの意
コンピュータ用語としては「フォルダ」とほぼ同じ意
ファイルを入れておくための「入れ物」のことで、階層構造を持つ
な
ニューモーフィズム
「スキューモーフィズム」と 「フラットデザイン」や「マテリアルデザイン」を組み合わせた新しいデザイン手法のこと
は
ビューポート
「表示領域」のこと
アドレスバーやタブなどのインターフェース部分を除くブラウザの画面領域
フラットデザイン
立体感や奥行き、質感などの表現があまりなく、平面的なデザイン
ベタ塗りを基調とした配色にシンプルなタイポグラフィを合わせる手法
フレームワーク
プロジェクト全体の土台を提供する
プロジェクトの規模や構造を統一しやすく、効率的に作業を進めることができる
ベンダープレフィックス
ベンダー(=事業者)とプレフィックス(=接頭辞)を合わせた用語
各事業者が独自に開発したブラウザの種類やバージョンにCSSの機能を対応させるためのもの
接頭辞 | 対応ブラウザ |
---|---|
-webkit- | Google Chrome、Safari、Microsoft Edge |
-moz- | Firefox |
-ms- | Internet Explorer |
ま
マテリアルデザイン
フラットな要素に光や影、奥行き、重なりを微妙に適用したデザイン手法
メディアクエリ
ブレイクポイントの値によって適用するスタイルを切り替えるCSSの技術
@media (条件) {
/* 適用するスタイル */
}
- max-width: 指定した幅以下、min-width: 指定した幅以上
- 特定のメディアタイプ(例: screen, print, all など)を指定しない場合、自動的に all として扱われる
- 画面向けに特化したスタイルだけを書く場合は、シンプルに省略して書くのが主流
モーダルウィンドウ
ウィンドウの内側に開く「子ウィンドウ」で、「子ウィンドウ」の操作を完了またはキャンセルするまでは、他のウィンドウの操作ができない仕組みのもの
ら
ライブラリ
ソフトウェアの部品集
汎用性の高い複数のプログラムを再利用可能な形でひとまとまりにしたもの
必要に応じて使い分けることができる柔軟性がある
レスポンシブWebデザイン
デバイスの画面サイズに合わせて、Webページのレイアウトやデザインが自動的に調整される設計手法
CSSのメディアクエリにより、画面幅に応じて異なるスタイルを適用する
レンダリング
コンピュータが、データを人間が確認しやすい視覚的な形(画像や映像、テキストなど)に変換し、表示すること
D
DOM(ドム)
「Document Object Model」の略
HTMLやXMLなどの文章を扱うための標準インタフェースのこと
JavaScriptなどのプログラムで文書構造、スタイル、内容を変更することができる
(よりわかりやすく…)
ウェブページの構造をプログラムで操作できるようにした仕組みのこと
HTMLやXMLをツリー状に表現したもので、各要素(タグ)は「ノード」として扱われる
JavaScriptを使って、このDOMを操作することで、ウェブページの内容や見た目を動的に変更できる
---
「ノード」とは、DOMツリーを構成する1つ1つの部品のこと
- 要素ノード(Element Node)
HTMLタグ(例:<div>
、<p>
)を表す - テキストノード(Text Node)
タグの中の文字列(例:<p>こんにちは</p>
の "こんにちは" 部分)を表す - 属性ノード(Attribute Node)
タグに設定された属性(例:<img src="image.jpg">
のsrc="image.jpg"
)を表す - その他のノード
コメントやドキュメント全体(document
オブジェクト)もノードの一種
DNSサーバー
「ドメイン(インターネット上の住所:文字列)」を「IPアドレス」に変換する仕組み
F
Figma(フィグマ)
Webサイトやアプリなどのワイヤーフレーム(ページのレイアウトを設計した図)や印刷物等のデザイン制作のためのツール
G
Git(ギット)
ファイルやコードのバージョン管理を行うツール
変更履歴を記録し、過去のバージョンへ復元することができる
GitHub(ギットハブ)
Gitを使ったプロジェクトをオンラインで管理・共有するサービス
多くの人が自分の制作したプログラムやソースコードを公開している
S
Sass(サス)
CSSを効率的に書くための拡張言語(CSSプリプロセッサ)
SassのコードはCSSにコンパイルされて使用される
簡潔で再利用性の高いスタイルシートを作成できる
SEO(エス・イー・オー)
「Search Engine Optimization」の略で、「検索エンジン最適化」の意
Webサイトが検索結果の上位に表示されるような施策を行うこと「SEO」対策という
W
WHATWG(ワットダブルジー)
「Web Hypertext Application Technology Working Group」の略
Webブラウザを開発するApple、Google、Microsoftなどに所属するメンバーで構成される団体のこと
HTML標準仕様(リビングスタンダード)の策定を行っている