Array (配列) - MDN Web Docs 用語集: ウェブ関連用語の定義

Array (配列)
==========

*配列*は、データ（言語によってプリミティブまたはオブジェクトのどちらか）が順序付けされて集まったものです。配列は 1 つの変数に複数の値を格納するために使用されます。これは 1 つしか値を格納できない変数とは対照的です。

配列内のそれぞれの項目には添字と呼ばれる番号が割り当てられており、それによって各項目にアクセスすることができます。 JavaScript では、配列の添字は 0 から始まり、さまざまなメソッドで操作することができます。

JavaScript における配列の利用例は以下の通りです。
```

var myArray = [1, 2, 3, 4];
var catNamesArray = ["Jacqueline", "Sophia", "Autumn"];
// JavaScript の配列は、上記のように異なる種類のデータを保持することができます。
```

詳細情報
----

### 一般知識

* ウィキペディア上の「配列」の記事
### 技術リファレンス

* MDN における JavaScript の`配列`


Pseudo-element - MDN Web Docs 用語集: ウェブ関連用語の定義

Pseudo-element
==============

CSS では**擬似要素**セレクターを使うことで、選択すべき特定の HTML 要素がない状況でも、ドキュメントのコンテンツの一部に、スタイルを適用できます。例えば、各段落の最初の文字を、それぞれの要素の中に置いていくのではなく、`p``::first-letter` で、それらのすべてに、スタイルを指定することができます。

関連項目
----

### 技術リファレンス

* Pseudo-elements（疑似要素）


Blink - MDN Web Docs 用語集: ウェブ関連用語の定義

Blink
=====

Blink は、 Google によって Chromium の一部 (それゆえ Google Chrome の一部でもある) として開発されたオープンソースのブラウザー用レイアウトエンジンです。特に、 Blink はレイアウト、レンダリング、 DOM の処理を扱う WebKit 内の WebCore ライブラリのフォークとして始まりましたが、現在は独立したレンダリングエンジンとして成立しています。

1. 一般知識
    1. Blink プロジェクトホームページ
    2. Blink (Wikipedia)
    3. Blink に関する FAQ
2. 用語集
    1. Google Chrome
    2. Gecko
    3. Trident
    4. WebKit
    5. レンダリングエンジン


Promise - MDN Web Docs 用語集: ウェブ関連用語の定義

Promise
=======

**`Promise`** は、ある 関数 が返す、呼び出された時点でまだ完了していない処理の結果をあらわす オブジェクト です。その名のとおり、関数が `Promise` オブジェクトを経由して、最終的に何らかの結果を返すことを*約束*(Promise は約束の意味)するわけです。

非同期に 処理をおこなう関数が処理を完了したとき、`Promise` オブジェクトに設置された **resolution** ハンドラ(または **fulfillment** ハンドラ、**completion** ハンドラ) が呼ばれて、呼び出し元の関数は処理の完了を知ることができます。

関連情報
----

より詳しく学ぶには、以下のリンクをご覧ください。

### 一般知識

* Future パターン
### 技術的な参照情報

* JavaScript リファレンス内の記事: `Promise`
* Promise を使う


Pseudocode (擬似コード) - MDN Web Docs 用語集: ウェブ関連用語の定義

Pseudocode (擬似コード)
==================

擬似コードは人間に対し、コード構文がどのようにはたらいているかを示す、あるいはコード設計のある項目の意図を表現するために広く用いられる、コードのような構文を意味します。実際にコードとして実行しようとしても、**うまく動作しない**でしょう。

関連情報
----

### 基礎知識

* Wikipedia の 擬似コード。


SLD - MDN Web Docs 用語集: ウェブ関連用語の定義

SLD
===

SLD (Second Level Domain; セカンドレベルドメイン) は TLD 直下の階層のドメイン名です。

例えば `mozilla.org` では、 `mozilla` が TLD の `.org` に対するセカンドレベルドメインです。

ドメイン名は TLD および SLD だけではありません。サーバーの様々な機能についての追加情報を提供するため、またはサブドメイン以下の領域を区切るために、追加のサブドメインを生成することができます。例えば、 `www` はウェブサーバーのドメインポイントを示すサブドメインとしてよく使われます。

もう一つの例として、 `developer.mozilla.org` では、 `developer` サブドメインが、 Mozilla ウェブサイトの開発者向け (developer) の章を含むサブドメインを指定するのに使われています。

1. Wikipedia articles
    1. SLD
2. 用語集
    1. DNS
    2. ドメイン
    3. ドメイン名
    4. TLD


Class (クラス) - MDN Web Docs 用語集: ウェブ関連用語の定義

Class (クラス)
===========

オブジェクト指向プログラミングでは、*クラス*はオブジェクトの特徴を定義します。クラスはオブジェクトのプロパティやメソッドのひな形定義であり、オブジェクトのより具体的なインスタンスが描かれる「青写真」です。

詳細情報
----

### 一般知識

* クラスベース言語とプロトタイプベース言語（JavaScript など）
* JavaScript におけるクラスとしての関数の利用
* ウィキペディアのクラスベースの記事
* ウィキペディアの Object-oriented programming の記事


Hotlink (直リンク) - MDN Web Docs 用語集: ウェブ関連用語の定義

Hotlink (直リンク)
==============

**直リンク** (**ホットリンク**、**インラインリンク**とも呼ばれる) は、別のサイトから直接リンクされたオブジェクト (通常は画像) です。たとえば、 site1.com でホストされている画像が site2.com に直接表示されるものです。

この行為は、リンク先のオブジェクトをホストしているウェブサイトの帯域幅を勝手に利用することになるため、多くの場合はひんしゅくを買う行為であり、また著作権上の懸念 — 許可なく行われた場合は窃盗とみなされます — を引き起こす可能性もあるためです。

1. 一般知識
    1. Wikipedia 上の 直リンク
2. MDN Web Docs 用語集
    1. Hyperlink


Grid (グリッド) - MDN Web Docs 用語集: ウェブ関連用語の定義

Grid (グリッド)
===========

**CSS グリッド** は `display` プロパティの値に `grid` を指定して定義します。グリッドの列や行は `grid-template-rows` や `grid-template-columns` プロパティで定義します。

これらのプロパティを使って定義したグリッドのことを **明示的グリッド** *(explicit grid)* と呼びます。

明示的グリッドの外にコンテンツを配置する場合や、自動配置に任せる場合、グリッドアイテムが収まるように行や列のグリッドトラックがグリッドアルゴリズムに従って暗黙的に追加されます。**暗黙的グリッド** (*implicit grid*) は、定義済みのトラックの外部にコンテンツを配置するため自動的に作成されるグリッドです。

次の例では 3 列 2 行の**明示的グリッド**を作成しています。グリッドで 3 つ目の行は、明示的グリッドが定義している 6 つ以上のアイテムが含まれていることで作られた、**暗黙的グリッド**による行トラックです。

例
-
```

\* {
  box-sizing: border-box;
}

.wrapper {
  border: 2px solid #f76707;
  border-radius: 5px;
  background-color: #fff4e6;
}

.wrapper > div {
  border: 2px solid #ffa94d;
  border-radius: 5px;
  background-color: #ffd8a8;
  padding: 1em;
  color: #d9480f;
}
```

```css
.wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 100px 100px;
}
```

```html
<div class="wrapper">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
  <div>Four</div>
  <div>Five</div>
  <div>Six</div>
  <div>Seven</div>
  <div>Eight</div>
</div>
```

### 関連情報

* グリッドレイアウトの基本概念
* プロパティリファレンス
    + `grid-template-columns`
    + `grid-template-rows`
    + `grid`
    + `grid-template`


WAI - MDN Web Docs 用語集: ウェブ関連用語の定義

WAI
===

WAI または Web Accessibility Initiative は、標準外のブラウザやデバイスを必要とする可能性がある、さまざまな課題を抱える人々のためにアクセシビリティを向上させるための、World Wide Web Consortium（W3C）による取り組みです。

より詳しく知る
-------

### 一般知識

* WAI のウェブサイト（英語）
* ウィキペディアの Web Accessibility Initiative


Repaint (リペイント) - MDN Web Docs 用語集: ウェブ関連用語の定義

Repaint (リペイント)
===============

リペイントはインタラクティブなサイトでの更新後など、UI 変更から発生する視覚的な更新を表現するために browser が Web ページを再描画する時に発生します。通常、リペイントはブラウザーがウェブページ内の特定部位の位置や形状について再計算するリフローに続いて発生します。

関連項目
----

* リフロー
* Understanding Reflow and Repaint in the browser on dev.to (2020)


Codec (コーデック) - MDN Web Docs 用語集: ウェブ関連用語の定義

Codec (コーデック)
=============

コーデック（"***co**\_der-***dec**\_oder" から派生したかばん語）は、データストリームを符号化または復号するプログラム、アルゴリズム、またはデバイスです。特定のコーデックは、特定の符号化または圧縮技術の取扱方法を知っています。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の コーデック
### 技術文書

* ウェブ動画コーデックガイド
* HTML の audio および video で対応しているメディア形式
* メディアの種類と形式のガイド


IndexedDB - MDN Web Docs 用語集: ウェブ関連用語の定義

IndexedDB
=========

IndexedDB は大きなデータ構造をブラウザーに保管して高パフォーマンスな検索用にインデックスする Web API です。SQL-ベースの RDBMS と同様に、IndexedDB はトランザクションできるデータベースシステムです。しかし、データを保管するのに固定長のカラムではなく JavaScript オブジェクトを使います。

詳細情報
----

* MDN の IndexedDB API
* IndexedDB の W3C 仕様


Random Number Generator (乱数発生器) - MDN Web Docs 用語集: ウェブ関連用語の定義

Random Number Generator (乱数発生器)
===============================

**PRNG** (擬似乱数発生器) は、複雑で、予測できないように見えるパターンの数字を出力するためのアルゴリズムです。真の乱数 (放射性線源など) はまったく予測できないのに対し、すべてのアルゴリズムは予測可能なので、 PRNG は、開始パラメーターや*シード*が同じときには同じ数値を返します。

疑似乱数はゲームなど、様々な応用分野で使用されています。

暗号学的に安全な擬似乱数とは、暗号での使用に合うよう追加のプロパティを伴う擬似乱数であり、次のようなものがあります。

* (シードを知らずに) 攻撃者が計算によって出力を予測することができないもの
* 攻撃者がその現在の状態を解くことができた場合、攻撃者が以前に発行された数を解明することができないもの。

多くの疑似乱数、は暗号学的に安全ではありません。

関連情報
----

### 一般知識

* Wikipedia の擬似乱数
* JavaScript の組み込み PRNG 関数である `Math.random()`。これは暗号学的に安全な PRNG ではありません。
* `Crypto.getRandomValues()`: 暗号学的に安全な数値を提供するためのものです。
* `RandomSource`
* `Math.random()`
* `Crypto.getRandomValues()`


Delta (デルタ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Delta (デルタ)
===========

**デルタ**は、2 つの値または状態の差分を表す用語です。

名前の由来はギリシャ文字の Δ (delta) で、 ローマ字の *D* に相当します。*デルタ*は、省略形の文字 Δ を使用して*差分*を表します。

*デルタ*という語は、一般的に、物理的もしくは仮想的なオブジェクトの速度、位置、加速度の変化を表す時に使われます。また、音波の振幅または周波数の変化を表す時にも使われます。

例えば、画面上でオブジェクトが左から右へ移動した距離を述べる時には、*delta x* または *Δx* という表記が使用できます。

同様に、新しい値 *X* とその古い値が与えられた時、次のようにデルタを計算できます。

```js
let deltaX = newX - oldX;
```

より一般的には、デルタを受け取り、その値を使用して保存済みの以前の状態を更新します。

```js
let newX = oldX + deltaX;
```

詳細情報
----

### 技術リファレンス

* マウスホイールイベント (例として、`WheelEvent` の `deltaX`、`deltaY`、`deltaZ` プロパティは、最後のイベントからのホイールの移動量を提供します)


Closure (クロージャ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Closure (クロージャ)
===============

実行\*\*範囲**を定義するバインディングのこと。JavaScriptでは、**関数\*\*は閉じたコンテキストを作成します。

関連項目
----

### 一般知識

* Wikipedia の クロージャ
### 技術リファレンス

* MDN のクロージャ


Bézier curve (ベジェ曲線) - MDN Web Docs 用語集: ウェブ関連用語の定義

Bézier curve (ベジェ曲線)
====================

**ベジェ曲線**は、コンピューターグラフィックスとアニメーションで使用される、数学的に記述された曲線です。ベクター画像では、無期限に拡大できる滑らかな曲線をモデル化するために使用されます。

ベジェ曲線は、最低 2 つの制御点のセットによって定義されます。ウェブ関連のグラフィックスとアニメーションは、4 つの制御点 P0, P1, P2, P3 を持つ曲線である 3 次ベジェ曲線を使用します。

曲線を描くために、P0 から P1 までと P1 から P2 までの 2 本の補助線が描かれます。3 本目の補助線は、1 本目の補助線上を徐々に移動する点を始点、2 本目の補助線上を徐々に移動する点を終点として描画されます。 この 3 本目の補助線上に、始点から終点まで徐々に移動する点が描かれます。 この点が描く曲線がベジェ曲線です。下記の図は、曲線の作成方法を示すアニメーションです。

![ベジェ曲線の描画](/ja/docs/Glossary/Bezier_curve/b%C3%A9zier_2_big.gif)

関連情報
----

* Wikipedia のベジェ曲線の記事
* CSS の三次元ベジェタイミング関数
* `keySplines (en-US)` SVG 属性


Tag (タグ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Tag (タグ)
========

HTML において、**タグ**は要素の作成に使われます。段落を表す `<p>` のように、HTML の要素の名前が山括弧の中に入ります。なお、終了タグは `</p>` のように、名前の前にスラッシュがつきます。そして空要素では終了タグは不要で、付けることもできません。属性が記述されていない場合は、それぞれ既定値が使われます。

詳細情報
----

### 一般知識

* Wikipedia 上の HTML要素
* WHATWG 上の HTML 要素の構文
### 技術リファレンス

* HTML 概論


Alpha (アルファチャンネル) - MDN Web Docs 用語集: ウェブ関連用語の定義

Alpha (アルファチャンネル)
=================

コンピューター上では、色を数値の組であらわします。各数値は色のいずれかの構成要素の強さ、主に輝度を表します。それぞれの構成要素を**チャンネル**と呼びます。画像ファイルでは、ある色の色チャンネルによって、この色がどれくらいの強さの赤色・緑色・青色の光から構成されているかを表すのが一般的です。後ろ側が透けて見えるような色を表すために、4 番目に追加されるのが**アルファチャンネル**です。アルファチャンネルは、ある色が後ろ側にある色をどの程度覆い隠すかを表します。

具体例をみてみましょう。`#8921F2` (`rgb(137, 33, 242)` または `hsl(270, 89%, 54)` とも記述します) は紫色を表します。下の図では 2 個のボックスがテキストを含む段落の手前に描画されています。左上にあるボックスでは上で示した紫色を背景色に指定しています。右下のボックスは、*同じ* 背景色ですがアルファチャンネルの値を 0.5 に指定しています。これは、50% の不透明度とも表せます。

![色をあらわすアルファチャンネルの効果を示す画像](/ja/docs/Glossary/Alpha/alpha-channel-example.png)

このように、ボックスの背景色にアルファチャンネルを明示的に指定しなかった場合、後ろ側のテキストは完全に覆い隠されます。一方、アルファチャンネルを指定した場合、後ろ側のコンテンツが透けて見えます。

関連情報
----

* ウィキペディアの記事「アルファブレンド」
* ウィキペディアの記事「RGBA 色モデル」
* ウィキペディアの記事「Channel (digital image)」
* CSS 色


ITU (国際電気通信連合) - MDN Web Docs 用語集: ウェブ関連用語の定義

ITU (国際電気通信連合)
==============

ITU (International Telecommunication Union、国際電気通信連合) は、国際連合に認可された組織であり、電信、無線通信、電話、そしてインターネットなどの遠距離通信に関する標準やルールを制定します。

送信内容が必要な場所へ届くようにするためのルールの定義や、モールス信号で使用される「SOS」の警報信号の作成に始まり、テクノロジーを使用して情報や考えをやり取りする方法について、ITU は長い間重要な役割を果たしてきました。

インターネットの時代における ITU の役割は、ストリーミングやテレカンファレンスなどさまざまな目的で用いられる動画や音声のデータ形式の標準を制定することです。例えば、MPEG-2 (ITU H.262)、AVC (ITU H.264)、HEVC (ITU H.265) などのさまざまな MPEG の仕様の開発、公開、保守は、ITU と Moving Picture Experts Group (MPEG) が協力して行っています。

関連情報
----

* ITU のウェブサイト
* ITU の歴史ポータルサイト


Callback function (コールバック関数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Callback function (コールバック関数)
============================

コールバック関数とは、引数として他の関数に渡され、外側の関数の中で呼び出されて、何らかのルーチンやアクションを完了させる関数のことです。

簡単な例を以下に示します。

```js
function greeting(name) {
  alert(`Hello, ${name}`);
}

function processUserInput(callback) {
  const name = prompt("Please enter your name.");
  callback(name);
}

processUserInput(greeting);
```

上記の例はすぐに実行される同期型コールバックです。

コールバックは非同期操作が完了した後に続いてコードが実行されることがよくあります。これを非同期コールバックといいます。コールバック関数の良い例は、プロミスが履行されたり拒否されたりした後に連鎖される `.then()` ブロックの中で実行されるものです。この構造は `fetch()`のような最近の Web API で良く使われています。

関連情報
----

* Wikipedia のコールバック


Host (ホスト) - MDN Web Docs 用語集: ウェブ関連用語の定義

Host (ホスト)
==========

ホストは、インターネット (またはローカルネットワーク) に接続する端末です。サーバーと呼ばれるホストは、ウェブページの提供や、ファイルやメールの保存のような付加サービスを提供します。

ホストはハードウェアのインスタンスである必要はありません。仮想マシンで生成することもできます。仮想マシンで生成されたホストは「仮想ホスト」と呼ばれています。

詳細
--

### 一般知識

* Wikipedia 上の記事「ホスト (ネットワーク)」


Identifier (識別子) - MDN Web Docs 用語集: ウェブ関連用語の定義

Identifier (識別子)
================

**識別子** (identifier) は 変数、関数、プロパティ などを識別するコード内の文字の並びです。

JavaScript においては、識別子は大文字小文字の区別があり、Unicode の文字、 `$`、 `_`、 数字 (0-9) を含めることができますが、数字で始めることはできません。

識別子は文字列とは異なり、文字列がデータであるのに対して、識別子はコードの一部です。 JavaScript において、識別子を文字列に変換する方法はありませんが、ときに文字列を識別子に解釈することは可能です。

詳細情報
----

### 基礎知識

* ウィキペディアの識別子の記事

1. 用語集
    1. 識別子
    2. スコープ
    3. 文字列
    4. Unicode
2. ウィキペディアの識別子の記事


Compile time (コンパイル時間) - MDN Web Docs 用語集: ウェブ関連用語の定義

Compile time (コンパイル時間)
======================

コンパイル時間は、プログラムが最初にロードされてからプログラムが解析されるまでの時間です。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の Compile time（英語）


QUIC - MDN Web Docs 用語集: ウェブ関連用語の定義

QUIC
====

**QUIC** は、UDP で実装された多重化トランスポートプロトコルです。HTTP/3 のトランスポート層として TCP の代わりに使用されます。

QUIC は、HTTP 接続のセットアップの迅速化と遅延の低減を提供するために設計されました。具体的には、以下の通りです。

* TCP では、最初の TCP ハンドシェイクにオプションで TLS ハンドシェイクが続きますが、これはデータを送信する前に完了する必要があります。TLS は今やほとんど普及しているので、QUIC は TLS ハンドシェイクを最初の QUIC ハンドシェイクに統合し、セットアップ時に交換しなければならないメッセージの数を縮小しています。
* HTTP/2 は多重化されたプロトコルであり、複数の HTTP トランザクションを同時に実行することができます。しかし、トランザクションは単一の TCP 接続上で多重化されるため、TCP 層でのパケットロスやその後の再送が起こると、すべてのトランザクションがブロックされてしまいます。QUIC はこれを避けるため、UDP 上で実行し、パケットロスの検出と再送信を各ストリームに対して別個に実装しています。
関連情報
----

* RFC 9000: the QUIC specification
* RFC 9114: the HTTP/3 specification


DoS攻撃 - MDN Web Docs 用語集: ウェブ関連用語の定義

DoS攻撃
=====

DoS (Denial of Service) は、大量のリクエスト送信によりサーバーの適正なリソース使用を妨げるネットワーク攻撃手法です。

コンピューターは、計算能力やメモリーなどのリソースが限られています。リソースが使い尽くされると、プログラムはフリーズまたはクラッシュし使用できなくなります。DoS 攻撃にはサーバーのリソースを使い果たさせるための様々な手法があり、正当なユーザーにサーバーやネットワークを利用できないようにし、少なくともサーバーの処理速度を低下させます。

攻撃されるコンピューターの計算能力を妨害するために使用されるサーバーを多数にした、分散 DoS 攻撃 (DDoS) もあります。

### DoS 攻撃の手法

Dos 攻撃は、特定の種類の手法を指すというよりもカテゴリーです。下記は Dos 攻撃の手法の一部です。

* 帯域幅攻撃
* リクエストフラッド攻撃
* SYN フラッド攻撃
* ICMP フラッド攻撃
* ピア・ツー・ピアネットワークへの攻撃
* PDoS 攻撃
* アプリケーションレイヤー攻撃
詳細情報
----

* Wikipedia 上の DoS攻撃 のページ
* OWASP Denial-of-service のページ
* DDoS 攻撃


Global object (グローバルオブジェクト) - MDN Web Docs 用語集: ウェブ関連用語の定義

Global object (グローバルオブジェクト)
===========================

グローバルオブジェクトは、グローバルスコープ上に常時存在するオブジェクトです。

JavaScript では、グローバルオブジェクトが常に定義されています。ウェブブラウザー上でスクリプトがグローバル変数を生成する時、グローバルオブジェクトのメンバーとして作成されます。 (Node.js ではこの限りではありません。) グローバルオブジェクトが実装するインターフェイスは、どのようなコンテキストでスクリプトが実行されているかによって変化します。例えば、

* ウェブブラウザーでは、明示的にバックグランドタスクとして起動されるコードを除き、 `Window` がグローバルオブジェクトになります。ウェブにおける JavaScript コードのほとんどはこのケースに該当します。
* `Worker` 内で実行されるコードでは `WorkerGlobalScope` オブジェクトがグローバルオブジェクトになります。
* Node.js で実行されるスクリプトの場合、 `global` と呼ばれるオブジェクトがグローバルオブジェクトになります。
ブラウザー内の `window` オブジェクト
-----------------------

ブラウザー内では `window` オブジェクトがグローバルオブジェクトです。グローバル変数や関数はすべて、 `window` オブジェクトのプロパティとしてアクセスすることができます。

### グローバル変数へのアクセス

```js
var foo = "foobar";
foo === window.foo; // true を返す
```

グローバル変数 `foo` を定義した後、その値を `window` オブジェクトから、変数名である `foo` を使用し、グローバルオブジェクト `window.foo` のプロパティ名として直接アクセスすることができます。

#### 解説

グローバル変数 `foo` は `window` オブジェクト内に、次のように格納されます。

```js
foo: "foobar";
```

### グローバル関数へのアクセス

```js
function greeting() {
  console.log("Hi!");
}

window.greeting(); // ふつうに greeting(); を呼び出すのと同じ
```

上記の例では、グローバル関数が `window` オブジェクトの中に*プロパティ*としてどのように格納されるかを説明しています。 `greeting` というグローバル関数を作成し、 `window` オブジェクトを使用して呼び出します。

#### 解説

グローバル関数 `greeting` は `window` オブジェクトに次のように格納されています。

```js
greeting: function greeting() {
  console.log("Hi!");
}
```

* MDN 用語集
    + グローバルスコープ
    + オブジェクト
* `Window`
* `WorkerGlobalScope`
* `global`


Namespace (名前空間) - MDN Web Docs 用語集: ウェブ関連用語の定義

Namespace (名前空間)
================

名前空間はプログラム内でコンテキストを識別する、論理的なグループの名前です。同じコンテキスト内かつ同じスコープの範囲内では、識別子は実態を一意に指定しなくてはなりません。

OS のディレクトリーは名前空間です。それぞれのファイルやサブディレクトリーは一意の名前を持たなくてはなりませんが、1 つのファイルが違うタイミングで同じ名前を使用することがあるかもしれません。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事「名前空間」


Plaintext (平文) - MDN Web Docs 用語集: ウェブ関連用語の定義

Plaintext (平文)
==============

平文（ひらぶん）とは、暗号化 アルゴリズムへの入力として使用されている情報、または復号された暗号文のことです。

頻繁に使用される用語であるクリアテキストは、暗号化されておらず、追加の処理を行わずに人間やコンピュータが読むことができるテキスト文書、画像などの情報を意味します。


DOM - MDN Web Docs 用語集: ウェブ関連用語の定義

DOM
===

DOM (Document Object Model) とは、すべての HTML または XML 文書を表現・操作する API です。 DOM はブラウザーで文書構造をノードのツリーとして読み込み、それぞれのノードを文書の一部 (例えば要素、テキスト文字列、コメント) として表します。

DOM は文書内のすべてのノードにアクセスし操作するためにコードをブラウザー内で実行することができるので、ウェブ上で最も使用されいる API のひとつです。ノードの生成や移動、変更が可能です。イベントリスナーをノードに追加し、特定のイベントの発生時に実行させることもできます。

DOM は当初、仕様書がありませんでしたが、ブラウザがJavaScript の実装を始めた頃に追加されました。このレガシーな DOM は DOM0 と呼ばれることもあります。今日、 WHATWG が DOM Living Standard を保守しています。

1. Wikipedia 上の記事「The Document Object Model」
2. MDN 上の記事「DOM ドキュメント」
3. W3C の DOM 仕様
4. 用語集
    1. API
    2. HTML
    3. XML
    4. World Wide Web


Operator (演算子) - MDN Web Docs 用語集: ウェブ関連用語の定義

Operator (演算子)
==============

記号や英数字によって構成された**予約語**で、内蔵の機能を実行します。例えば、 JavaScript では加算演算子（"+"）は複数の数値を加算したり文字列を結合したりします。「否定」演算子（"!"）は式を否定し、例えば、 `true` を表す式では `false` を返します。

詳細情報
----

### 一般的な知識

* Wikipedia のja:演算子の記事
### 技術リファレンス

* JavaScript の演算子


Prototype - MDN Web Docs 用語集: ウェブ関連用語の定義

Prototype
=========

プロトタイプは、開発ライフサイクルの早い段階でアプリケーションや製品の外観と動作を表現する型です。

継承とプロトタイプチェーン をご覧ください。

理解を深める
------

### 基礎知識

* ウィキペディアの ソフトウェアプロトタイピング の記事


beacon (ビーコン) - MDN Web Docs 用語集: ウェブ関連用語の定義

beacon (ビーコン)
=============

Web ビーコンは、マークアップに埋め込まれた 1 ピクセル gif などの小さなオブジェクトで、Web サーバーまたはサードパーティのサーバーに情報を戻すために使用されます。

ビーコンは通常、統計目的でユーザーに関する情報を提供するために含まれています。

多くの場合、ビーコンは、ユーザーデータ、パフォーマンスメトリック、およびエラーレポートを収集するためのサードパーティのスクリプトに含まれています。

W3C Draft Beacon Specification があり、パフォーマンスを低下させることなく、ページロード前にユーザーエージェントから Web サーバーに HTTP データを非同期的に転送するためのインターフェイスとしてビーコンを標準化しています。

関連情報
----

* Real User Monitoring (RUM)


Canvas - MDN Web Docs 用語集: ウェブ関連用語の定義

Canvas
======

**canvas 要素**は HTML5 の一部であり、 2D および 3D の形状やビットマップ画像をスクリプトで動的にレンダリングすることができます。これは、bitmapを更新する低レベルの手続き型モデルであり、組み込みのシーングラフを持っていません。これは、特定の JavaScript API が描画できる空のグラフィックゾーンを提供します (Canvas 2D や WebGL) など)。

詳細情報
----

### 基本知識

* Wikipedia 上の Canvas要素 のページ
### Canvas について詳しく学ぶ

* MDN 上の Canvas チュートリアル
### 技術情報

* MDN 上の HTML `<canvas>` 要素のページ
* MDN 上の Canvas の一般的なドキュメント
* `CanvasRenderingContext2D`: canvas 2D の描画 API
* w3c 上のページ: The Canvas 2D API specification


Favicon (ファビコン) - MDN Web Docs 用語集: ウェブ関連用語の定義

Favicon (ファビコン)
===============

ファビコン (お気に入りアイコン) はウェブサイトに含まれる小さなアイコンです。ブラウザのアドレスバー、ページタブ、ブックマークメニューなどに表示されます。ただし最新のブラウザのほとんどは、アドレスバーのファビコンをウェブサイトが HTTPS を使用しているかどうかを示す画像に置換しています。

通常、ファビコンは 16x16 ピクセルの GIF、 PNG、または ICO 形式で保存されます。

ファビコンはユーザエクスペリエンスを向上させ、ブランドの一貫性を保つために使用されます。例えば使い慣れたアイコンがブラウザのアドレスバーに表示されるのを見ることで、ユーザは自分が適切な場所 (*訳注:WEB ページなど*) にいることを理解します。

1. Wikipedia 上の Favicon
2. ツール
    1. Free favicon generator
    2. Favicon.ico and & app icon generator


Domain sharding (ドメインシャーディング) - MDN Web Docs 用語集: ウェブ関連用語の定義

Domain sharding (ドメインシャーディング)
=============================

ブラウザはアクティブな接続数をドメインごとに制限します。この制限を超えてアセットを同時ダウンロードできるようにするために、**ドメインシャーディング**はコンテンツを複数のサブドメインに分割します。複数のアセットを提供するために複数のドメインが使用されると、ブラウザはより多くのリソースを同時にダウンロードすることができるため、より速いページ読み込み時間とユーザ体験の向上をもたらします。

ドメインシャーディングの性能面での問題は各ドメインの DNS ルックアップの追加コストと各 TCP コネクション確立のオーバヘッドです。

HTTP からの初回レスポンスは通常、 JavaScript、 CSS、画像、その他ダウンロードの必要なメディアファイルが列挙された HTML ファイルです。ブラウザはドメインごとにアクティブな接続数を制限するため、 1 ドメインからの全ての必要リソースの提供は、アセットが順番にダウンロードされることになり、遅くなることがあります。ドメインシャーディングでは必要なダウンロードは 2 つ以上のドメインから提供され、ブラウザでの必要なリソースの同時ダウンロードを可能にします。しかし、複数のドメインを用いることは DNS ルックアップが初回ロード時間を遅くするため、アンチパターンと言えます。

HTTP2 は無制限の同時リクエストをサポートしているため、 HTTP/2 が有効な場合にはドメインシャーディングはもはや必要なくなります。

詳細情報
----

* Transport Layer Security (TLS)
* DNS
* HTTP/2


WebAssembly - MDN Web Docs 用語集: ウェブ関連用語の定義

WebAssembly
===========

**WebAssembly** (*Wasm*) は、オープンバイナリプログラミング言語です。モダンウェブブラウザで動作します。パフォーマンスを高め、かつ/もしくは、ウェブページのための新しい機能を提供します。

1. 詳細
    1. WebAssembly on Wikipedia
    2. Official website
    3. WebAssembly on MDN


Reflow - MDN Web Docs 用語集: ウェブ関連用語の定義

Reflow
======

インタラクティブサイトでの更新後など、 browser が Web ページの一部または全てを再度処理して描画する必要がある場合、**リフロー** が発生します。

関連項目
----

* Google article "Minimizing browser reflow"


Algorithm (アルゴリズム) - MDN Web Docs 用語集: ウェブ関連用語の定義

Algorithm (アルゴリズム)
==================

アルゴリズムとは、ある機能を実行するための、独立した一連の命令です。

言い換えれば、アルゴリズムは問題の解決方法を記述する方法であり、人間または機械によって反復的に解決されます。コンピューター科学者は「アルゴリズムの複雑性」や "Big O" 記法の概念でアルゴリズムの効率性を比較します。

例としては、以下のようなものがあります。

* 料理レシピは、人間のための簡単なアルゴリズムです。
* 整列アルゴリズムは、機械がデータを並べ替える方法を説明するために、コンピュータープログラミングでよく使われます。

よくあるアルゴリズムとしては、巡回セールスマン問題などの経路探索アルゴリズム、ツリー探索アルゴリズムなどがあります。

線形回帰 (Linear Regression)、ロジスティック回帰 (Logistic Regression)、決定木 (Decision Tree)、ランダムフォレスト (Random Forest)、サポートベクターマシン (Support Vector Machine)、再起型ニューラルネットワーク (Recurrent Neural Network; RNN)、長短期記憶 (LSTM) ニューラルネットワーク、畳み込みニューラルネットワーク (Convolutional Neural Network; CNN)、ディープ畳み込みニューラルネットワーク (Deep Convolutional Neural Network) などの機械学習アルゴリズムもあります。

詳細情報
----

### 一般知識

* Wikipedia の アルゴリズム
### 技術リファレンス

* Explanations of sorting algorithms
* Explanations of algorithmic complexity


PHP - MDN Web Docs 用語集: ウェブ関連用語の定義

PHP
===

PHP (再帰的な頭文字語で PHP: Hypertext Preprocessor) はオープンソースのサーバー側スクリプト言語で、 HTML に組み込んで、ウェブアプリや動的なウェブサイトを構築することができます。

例
-

### 基本的な文法

```php
  // start of PHP code
<?php
 // PHP code goes here
 ?>
// end of PHP code
```

### 画面にデータを出力する

```php
<?php
 echo "Hello World!";
?>
```

### PHP の変数

```php
<?php
 // variables
 $nome='Danilo';
 $sobrenome='Santos';
 $pais='Brasil';
 $email='danilocarsan@gmailcom';

 // printing the variables
 echo $nome;
 echo $sobrenome;
 echo $pais;
 echo $email;
?>
```

1. 公式ウェブサイト
2. Wikipedia 上の PHP
3. Wikibooks 上の PHP
4. MDN Web Docs 用語集
    1. Java
    2. JavaScript
    3. Python
    4. Ruby


Local variable (ローカル変数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Local variable (ローカル変数)
=======================

変数のうち、その値を指す名前がローカルスコープ内にのみあるものです。

例
-

```js
var global = 5; //is a global variable

function fun() {
  var local = 10; //is a local variable
}
```

1. 一般知識
    1. Wikipedia 上のローカル変数


Alignment container (配置コンテナー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Alignment container (配置コンテナー)
=============================

**配置コンテナー**は、中に配置対象物が配置される矩形です。これはレイアウトモードによって定義されます。通常は配置対象物を包含しているブロックのことを指します。ボックスの書字方向は外側のコンテナーによって決定されます。

関連情報
----

* CSS ボックス配置


SEO - MDN Web Docs 用語集: ウェブ関連用語の定義

SEO
===

**SEO** (Search Engine Optimization, 検索エンジン最適化)は、検索結果上であるウェブサイトをより目立たさせるための過程です。検索ランキングの改善とも言えます。

検索エンジンはページからページへリンクをたどりながらウェブをクロールし、見つけたコンテンツをインデックスに登録します。検索をしたときに、検索エンジンはインデックスに登録されたコンテンツを表示します。クローラーには従うルールがあります。ウェブサイトのために SEO をする時に、そのルールに近づければ、そのサイトに検索結果の上位に上げる機会を与えることが可能になり、トラフィックと（e コマースと広告の場合）収益が向上する可能性があります。

検索エンジンはよく SEO のためのガイドラインを提供しますが、大手の検索エンジンになると結果のランキングを営業秘密のままにしています。したがって、 SEO は公式のガイドライン、経験的知識、それに科学論文や特許による論理的知識を組み合わせたものです。

SEO の方法は大きく 3 つに分類されます:

技術的な方法

コンテンツをセマンティック HTML を使用してタグ付けすることです。ウェブサイトを探索するとき、クローラーはインデックスに登録させたいコンテンツのみを探してくれるでしょう。

文章の作成

サイトの訪問者の語彙を使ってコンテンツを書きましょう。クローラーが主題を理解できるように、画像だけでなくテキストも使用しましょう。

サイトの人気

他の有名なされたサイトがあなたのサイトにリンクしすると、多くのトラフィックを得ることができます。

詳細情報
----

### 一般知識

* ウィキペディアの検索エンジン最適化( SEO )の記事です
### SEO を学ぶ

* Google ウェブマスター学習リソース


Bounding Box (バウンディングボックス) - MDN Web Docs 用語集: ウェブ関連用語の定義

Bounding Box (バウンディングボックス)
==========================

要素のバウンディングボックス（境界ボックスとも）は、要素とその子孫を完全に囲む可能な最小の矩形です（その要素のユーザー座標系の軸に揃えられます）。


Web performance (ウェブの性能) - MDN Web Docs 用語集: ウェブ関連用語の定義

Web performance (ウェブの性能)
========================

**ウェブパフォーマンス**とは、コンテンツのリクエストが行われてから、リクエストされたコンテンツがユーザーのブラウザーに表示されるまでの客観的な時間であり、客観的なレンダリング時間、読み込み時間と主観的な読み込み時間および実行時間の使い心地のことです。

客観的には、ウェブページやウェブアプリケーションがダウンロードされ、ユーザーのウェブブラウザーに表示され、レスポンシブかつ操作可能になるまでのミリ秒単位で測定可能な時間です。これは、秒あたりのフレーム数と、メインスレッドがユーザーのインタラクションに利用できない時間のことです。主観的には、ユーザーがコンテンツを要求してから、要求されたコンテンツが利用可能で使用可能だとユーザーが感じるまでの時間が遅いと感じるか、速いと感じるかについてのユーザーの*感覚*です。

関連情報
----

* ウェブの性能について知る
* 知覚パフォーマンス


WebP - MDN Web Docs 用語集: ウェブ関連用語の定義

WebP
====

**WebP** は Google の開発した画像圧縮フォーマットです。可逆圧縮と不可逆圧縮の両方に対応しています。

関連項目
----

### 一般知識

* ウィキペディアにある「WebP」の記事


Accessibility tree (アクセシビリティツリー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Accessibility tree (アクセシビリティツリー)
================================

**アクセシビリティツリー**、または**アクセシビリティオブジェクトモデル** (**AOM**) は、多くの HTML 要素におけるアクセシビリティに関する情報を含んでいます。

ブラウザーはマークアップを *DOM ツリー* と呼ばれる内部表現に変換します。 DOM ツリーはすべてのマークアップの要素、属性、テキストノードを含んでいます。ブラウザーはそれから、 DOM ツリーに基づいてアクセシビリティツリーを生成します。これは、読み上げソフトなどの支援技術のために、プラットフォームに特有のアクセシビリティ API から使用されます。

アクセシビリティツリーオブジェクトの中には 4 つのものがあります。

**name**

このものをどのように参照することができるか。例えば、 'Read more' というテキストを持ったリンクは 'Read more' という名前を持つでしょう (名前がどのように計算されるかの詳細については Accessible Name and Description Computation spec にあります)。

**description**

名前に何かを追加したいとすれば、この要素をどのように説明するか。表の説明は、その表が提供する情報の種類が何かで説明することができます。

**role**

どのような種類のものなのか。例えば、ボタンなのか、ナビゲーションバーなのか、アイテムのリストなのか。

**state**

状態があるかどうか。チェックボックスではチェック済み／未チェック、 `<summary>` 要素では折り畳み状態か展開状態か、などを想像してください。

加えて、アクセシビリティツリーは要素によって何が行われるのかについての情報を持つことがよくあります。リンクは *followed*、テキスト入力は *typed into*、などです。

1. 用語集
    1. アクセシビリティ
    2. ARIA


Cryptographic hash function (暗号学的ハッシュ関数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Cryptographic hash function (暗号学的ハッシュ関数)
========================================

暗号学的ハッシュ関数は、*ダイジェスト関数*とも呼ばれますが、任意のサイズのメッセージをダイジェストと呼ばれる固定サイズのメッセージに変換する暗号学的プリミティブです。暗号学的ハッシュ関数は、認証、デジタル署名、およびメッセージ認証コードに使用されます。

暗号学に使用するためには、ハッシュ関数は以下の性質を持っていなければなりません。

* 計算が速い (頻繁に生成されるため)
* 可逆ではない (各ダイジェストは非常に多数のメッセージに由来する可能性があり、所与のダイジェストにつながるメッセージを生成できるのは総当たりのみである)
* 改ざん防止 (メッセージの変更によって異なるダイジェストがもたらされる)
* 衝突耐性 (同じダイジェストを生成する 2 つの異なるメッセージを見つけることは不可能であるべきです)

MD5 や SHA-1 などの暗号化ハッシュ関数は、衝突耐性を大幅に低下させる攻撃が見つかったため、破損しているとみなされています。

* Wikipedia 上の 暗号学的ハッシュ関数
* MDN Web Docs 用語集
    + 共通鍵暗号


WebExtensions - MDN Web Docs 用語集: ウェブ関連用語の定義

WebExtensions
=============

WebExtensions は Firefox でブラウザー拡張機能を開発するためのクロスブラウザーシステムです。このシステムには API が提供され、これはかなりにわたって様々なブラウザー、例えば Mozilla Firefox, Google Chrome, Opera Browser, Microsoft Edge をサポートします。

関連項目
----

### 技術リファレンス

* MDN のブラウザー拡張機能


Primitive (プリミティブ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Primitive (プリミティブ)
==================

JavaScript において、**プリミティブ** (primitive、プリミティブ値、プリミティブデータ型) はオブジェクトでなく、メソッドを持たないデータのことです。 7 種類のプリミティブデータ型があります。

* 文字列
* 数値
* 長整数
* 論理値
* undefined
* シンボル
* null

多くの場合、プリミティブ値は、その言語実装の最下層にて直接的に表現されます。

すべてのプリミティブ値は、**イミュータブル** (immutable) 、つまり変更できません。変数には新しい値を再割り当てすることができますが、既存の値については、オブジェクト、配列、関数が変更できるのに対して、プリミティブ値は変更することができません。この言語では、プリミティブな値を変更するユーティリティは提供されていません。

プリミティブにはメソッドがありませんが、あたかもメソッドがあるかのように振る舞います。プリミティブのプロパティにアクセスするとき、JavaScript で自動ボックス値をラッパーオブジェクトに格納し、代わりにそのオブジェクトのプロパティにアクセスします。例えば、 `"foo".includes("f")` は暗黙のうちに `String` ラッパーオブジェクトを作成して、そのオブジェクトに対して `String.prototype.includes()` を呼び出します。この自動ボックス化の動作は JavaScript コードでは監視できませんが、様々な動作の良いメンタルモデルになります。例えば、プリミティブの「変更」ができない理由（`str.foo = 1` は `str` 自身のプロパティ `foo` に割り当てられるのではなく、一時的なラッパーオブジェクトに割り当てられるため）などが分かります。

関連情報
----

* JavaScript のデータ型
* Wikipedia の プリミティブ型 の記事
* 用語集
    + JavaScript
    + 文字列
    + number
    + bigint
    + boolean
    + null
    + undefined
    + symbol


ECMAScript - MDN Web Docs 用語集: ウェブ関連用語の定義

ECMAScript
==========

**ECMAScript** は JavaScript のベースとなっているスクリプト言語仕様です。Ecma International が ECMAScript の標準化を担当しています。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事「ECMAScript」
### 技術リファレンス

* ECMAScript


Site (サイト) - MDN Web Docs 用語集: ウェブ関連用語の定義

Site (サイト)
==========

非公式には、 *サイト* はウェブサイト、すなわちウェブページの集合であり、同じドメインから提供されるもので、単一の組織によって管理されているものです。

ブラウザーは時として、異なるサイト同士を正確に区別する必要があります。例えば、ブラウザーは SameSite (en-US) クッキーを、それを設定した同じサイトにしか送信してはなりません。

このより正確な定義では、サイトはドメイン名の登録可能なドメイン部分によって決定されます。登録可能なドメインは、公開接尾辞リストの項目と、その直前のドメイン名の部分から構成されます。つまり、たとえば、`theguardian.co.uk`、`sussex.ac.uk`、`bookshop.org` はすべて登録可能なドメインということになります。

この定義に従えば、`support.mozilla.org` と `developer.mozilla.org` は同じサイトの一部です。 `mozilla.org` が登録可能なドメインだからです。

文脈によっては、サイトを区別するときにスキームを考慮することもあります。この場合、`http://vpl.ca` と `https://vpl.ca` は異なるサイトとなります。スキームを含めると、安全でない (HTTP) サイトが安全な (HTTPS) サイトと同じサイトとして扱われるのを防ぐことができます。スキームを考慮した定義は、 *schemeful same-site* と呼ばれることもあります。このより厳しい定義は、 SameSite (en-US) クッキーの処理に関するルールで適用されています。

例
-

これらは、登録可能なドメインが `mozilla.org` であることから、同じサイトであると考えられます。

* `https://developer.mozilla.org/ja/docs/`
* `https://support.mozilla.org/ja/`

これらは、ポートは関係ないので、同じサイトです。

* `https://example.com:8080`
* `https://example.com`

これらは、 2 つの URL の登録可能なドメインが異なるため、同じサイトではありません。

* `https://developer.mozilla.org/ja/docs/`
* `https://example.com`

これらは、同じサイトであったり、スキームが考慮されれば異なるサイトであったりします。

* `http://example.com`
* `https://example.com`
関連情報
----

* URL とは何か
* Origin
* 同一オリジンポリシー


Information architecture (情報アーキテクチャ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Information architecture (情報アーキテクチャ)
====================================

ウェブのデザインと開発に適用される情報アーキテクチャは、ウェブサイトの情報/コンテンツ/機能を整理し、情報とサービスを簡単に使用可能で見つけ出すことができる最高のユーザーエクスペリエンスを提供することです。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の 情報アーキテクチャ


Responsive web design (レスポンシブウェブデザイン) - MDN Web Docs 用語集: ウェブ関連用語の定義

Responsive web design (レスポンシブウェブデザイン)
=====================================

*レスポンシブウェブデザイン* (**RWD**) とはサイトの見た目と挙動を、デスクトップからモバイルまで全てのパーソナルコンピューティングデバイスにとって、最適化することに焦点を当てたウェブ開発の概念です。

詳細情報
----

### 一般知識

* 要約とリソース (en-US)
* レスポンシブにするメリットとデメリット
* レスポンシブウェブデザイン(英 MSDN)


General header (一般ヘッダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

General header (一般ヘッダー)
=======================

**一般ヘッダー**は、リクエスト及びレスポンスメッセージの両方で使用できるものの、内容物そのものには適用されない HTTP ヘッダーです。使用されている文脈に応じて、一般ヘッダーはレスポンスヘッダー又はリクエストヘッダーのどちらかになります。しかし、エンティティヘッダーではありません。

最も一般的な一般的なヘッダーは、 `Date`, `Cache-Control`, `Connection` です。


Code point (コードポイント) - MDN Web Docs 用語集: ウェブ関連用語の定義

Code point (コードポイント)
====================

**コードポイント**は、 (Unicode などの) テキストを表現するシステムにおいて、抽象文字を表現するために割り当てられた番号のことです。 Unicode では、コードポイントは、 "U+1234" という形式で表現されます。ここで「1234」が割り当てられた番号です。例えば、 "A" という文字には、 U+0041 というコードポイントが割り当てられています。

UTF-8 や UTF-16 などの文字エンコーディング形式では、 Unicode のコードポイントをバイト列としてどのように符号化するべきかを決めています。エンコーディング形式が異なると、同じコードポイントが異なるバイト列に符号化される場合もあります。例えば、コードポイントが U+0424 であるキリル文字 "Ф" は、 UTF-8 では `0xd0a4` として符号化され、 UTF-16 では `0x0424` として符号化されます。

関連情報
----

* The Unicode Standard: Code Points and Characters


Brotli - MDN Web Docs 用語集: ウェブ関連用語の定義

Brotli
======

**Brotli** は、汎用の可逆圧縮アルゴリズムです。

LZ77 アルゴリズムのモダンバリアント、ハフマン符号、2 次コンテキストモデリングの組み合わせを使用してデータを圧縮し、現在利用可能な最良の汎用圧縮方法に匹敵する圧縮率を提供します。Brotli は gzip よりも優れた圧縮率を提供し、展開速度は同等ですが、 brotli 圧縮は Gzip 圧縮よりも処理が遅いため、キャッシュできないコンテンツの圧縮には gzip の方が適している場合があります。

Brotli は最新のほとんどのブラウザーと互換性がありますが、フォールバックを検討することをお勧めします。

関連項目
----

* brotli.org
* Brotli GitHub リポジトリー
* Wikipedia の Brotli
* Brotli on Caniuse


Speculative parsing (投機的解析) - MDN Web Docs 用語集: ウェブ関連用語の定義

Speculative parsing (投機的解析)
===========================

伝統的なブラウザーの HTML パーサーはメインスレッドで動作し、 `</script>` タグの後はスクリプトがネットワークから取得されて実行が完了するまでブロックされます。一部の HTML パーサー、たとえば Firefox 4 以降では、メインスレッドから分離された投機的解析に対応しています。これは、スクリプトがダウンロードされて実行されている間、先に解析を進めます。 HTML パーサーは、ストリーム内で先に見つかるスクリプト、スタイルシート、画像の投機的な読み込みを開始し、 HTML ツリー構築アルゴリズムを投機的に実行します。この利点は、投機が成功したときに、スクリプト、スタイルシート、画像のスキャンが完了した受信ファイルの一部を再解析する必要がないことです。欠点は、投機が失敗した場合により多くの作業が失われることです。

このドキュメントは、投機が失敗してページの読み込みが遅くなるようなことを避けるのに役立ちます。

リンクされたスクリプト、スタイルシート、画像の投機的な読み込みを成功させるためには、 `document.write` を避けてください。ページのベース URI を上書きするために `<base>`要素を使用する場合は、その要素を文書のスクリプト外においてください。これを `document.write()` や `document.createElement` で追加しないでください。

ツリービルダーの出力の喪失の防止
----------------

投機的なツリー構築に失敗するのは、 `document.write()` によって挿入された内容がすべて解析されたときに、 `</script>` タグの後の投機的な状態を破棄しなければならなくなる形で、 `document.write()` によってツリービルダーの状態が変更されたときです。しかし、問題を起こすのは `document.write()` の異常な使い方だけです。避けるべきことは以下のようなものです。

* バランスの取れないツリーを出力しないでください。 `<script>document.write("<div>");</script>` は悪い例です。 `<script>document.write("<div></div>");</script>` は良い例です。
* 不完全なトークンを出力しないでください。 `<script>document.write("<div></div");</script>` は悪い例です。
* 出力をキャリッジリターン文字で終わらせないでください。 `<script>document.write("Hello World!\r");</script>` は悪い例です。 `<script>document.write("Hello World!\n");</script>` は良い例です。
* バランスの取れたタグを書いても、他のタグが推測され、バランスの悪い書き込みになってしまうことがあるので注意してください。例えば `<script>document.write("<div></div>");</script>` を `head` 要素の中で実行すると、 `<script>document.write("</head><body><div></div>");</script>` となりバランスが取れなくなります。
* 表の一部を書き込まないでください。 `<table><script>document.write("<tr><td>Hello World!</td></tr>");</script></table>` は悪い例です。


Secure Context (安全なコンテキスト) - MDN Web Docs 用語集: ウェブ関連用語の定義

Secure Context (安全なコンテキスト)
==========================

**安全なコンテキスト**とは、認証と機密性の一定の最低基準を満たした `Window` や `Worker` のことです。多くの Web API や機能は、安全なコンテキストでのみアクセス可能です。これにより、悪意のあるコードによって悪用される可能性を減らすことができます。

詳細については、開発者向けのウェブ技術 > ウェブセキュリティ> 安全なコンテキストを参照してください。


ページ読み込み時間 - MDN Web Docs 用語集: ウェブ関連用語の定義

ページ読み込み時間
=========

**ページ読み込み時間**とはページの読み込みにかかる時間のことであり、ナビゲーション開始時 (en-US)からロードイベント開始時 (en-US)までをもって測定されます。

```js
let time = performance.timing;

let pageloadtime = time.loadEventStart - time.navigationStart;
```

ページ読み込み時間は完璧なウェブパフォーマンス測定基準に聞こえますが、そうではありません。読み込み時間はユーザーのデバイス性能やネットワーク状態、そして程度は低いもののサーバーからの距離によって大きく変化します。ページ読み込み時間が測定される開発環境は最適化された環境である場合が多くユーザーの実態体験を反映しません。さらにウェブパフォーマンスはロードイベント発生時間だけではありません。それは体感速度、応答性、ジャンク（Jank)、そしてジッター(Jitter)でもあります。

関連情報
----

* Navigation and resource timing
* `PerformanceNavigationTiming`
* `PerformanceResourceTiming`,


Ligature (合字) - MDN Web Docs 用語集: ウェブ関連用語の定義

Ligature (合字)
=============

**合字**は、2 つの文字を 1 つの形に結合したものです。 たとえば、フランス語では "œ" は "oe" の合字です。

`font-variant-ligatures` を使用してウェブページで合字を実装できます。

1. Wikipedia 上の 合字


パンくずリスト - MDN Web Docs 用語集: ウェブ関連用語の定義

パンくずリスト
=======

**パンくずリスト** (*breadcrumb*, *breadcrumb trail*) は、ウェブサイトの各ページのヘッダーと本文の間に置かれることが多い構成要素です。パンくずリストを通じて、たとえばトップページからみて現在のページがどの階層に位置するかや、ユーザーが現在のページに至るまでどの順番でどのリンクをたどってきたのかを知ることができます。

サイト内での位置をあらわすパンくずリストは、この記事なら概ね次のようなかたちになるでしょう。

MDN > 用語集 > パンくずリスト

パンくずリストが適切に機能していれば、ユーザーはウェブサイト内での現在位置を確かめ、どのように今のページに到着したのかを知ることができます。そのおかげで、ユーザーはすでに見たページに簡単に戻ることができますし、余計なクリックをせずに上の階層のページに移動することができます。


Semantics (セマンティクス) - MDN Web Docs 用語集: ウェブ関連用語の定義

Semantics (セマンティクス)
===================

プログラミングでは、**セマンティクス**とは、コードの断片の*意味*を指します。たとえば、「JavaScript でその行を実行すると、どのような効果があるのか？」、「その HTML 要素には、どのような目的や役割があるのか？」 (「どのように見えるのか？」ではなく)。

JavaScript でのセマンティクス
--------------------

JavaScript において、文字列の引数を取り、その文字列を `textContent` とする `<li>` 要素を返す関数を想像してみてください。 `build('Peach')` または `createLiWithContent('Peach')` という関数名の場合、何をするのかを理解するためにコードを見る必要があるのはどちらでしょうか？

CSS でのセマンティクス
-------------

CSS において、さまざまな種類の果物を表すために `li` 要素でリストをスタイル付けすることを想像してみてください。 `div > ul > li` または `.fruits__item` で選択された DOM の一部が何であるか分かるのはどちらでしょうか？

HTML でのセマンティクス
--------------

たとえば、 `<h1>` 要素はセマンティック要素で、「ページの最上位の見出し」の役割 (または意味) をまとったテキストを提供します。

```html
<h1>これは最上位の見出しです</h1>
```

既定では、見出しのように見えるように大きなフォントサイズが与えられます (あなたが望むものに見えるようにスタイルを設定することもできます) が、もっと重要なのはセマンティックな意義が複数の方法で使用されることです。たとえば、検索エンジンは、その内容をページの検索ランキング (SEO 参照) に影響する重要なキーワードと見なし、読み上げソフトは、視覚障碍のあるユーザーがページを移動するのを助けるための道標として使用できます。

一方、どの要素も最上位の見出しのように見せることができます。次ののことを想像してみてください。

```html
<span style="font-size: 32px; margin: 21px 0;"
 >これは最上位の見出しですか？</span
>
```

これは最上位の見出しのように表示されますが、セマンティックな意義はありませんので、上記のように特別なメリットはありません。したがって、 HTML 要素を適材適所に使用することをお勧めします。

HTML は既定の表示スタイルに基づくのではなく、入力される*データ*を表現するためにコーディングするべきです。プレゼンテーション (どのように見えるか) は、完全に CSS の責任です。

セマンティックなマークアップを書くことの利点の中には、次のようなものがあります。

* 検索エンジンが内容を重要なキーワードとして理解し、ページの検索ランキングを上げる (SEO を参照)
* 読み上げソフトが、目の不自由なユーザーがページを操作するのを補助するための標識として利用することができる
* 意味のあるコードのブロックを見つけることは、セマンティックまたは名前空間のついたクラスがあるにしろないにしろ、延々と `div` の中を検索するより明らかに簡単である
* 開発者に目立たせるデータの種類を提案することができる
* セマンティックな名前は、正しいカスタム要素やコンポーネントの名前を反映する

どのマークアップを使用するか迷ったときは、自分自身に「どの要素が掲載しようとしているデータを最もよく説明または表現しているか」と自問してみてください。例えば、これはデータのリストか？順序付きか順序なしか？これは節と関連情報の補足から成る記事か？定義の一覧になっているか？キャプションを必要としている図または画像か？サイト内でグローバルのヘッダーおよびフッターに加えてヘッダーやフッターを持つべきか？などです。

セマンティック要素
---------

これらは、およそ 100 ある利用可能なセマンティック要素の*一部*です。

* `<article>`
* `<aside>`
* `<details>`
* `<figcaption>`
* `<figure>`
* `<footer>`
* `<header>`
* `<main>`
* `<mark>`
* `<nav>`
* `<section>`
* `<summary>`
* `<time>`
より詳しく知る
-------

* MDN の HTML 要素リファレンス
* MDN の HTML のセクションとアウトラインの使用
* Wikipedia 上の コンピュータ科学におけるセマンティクスの意味

* MDN 用語集
    + SEO
* HTML におけるセマンティック要素の一部
    + `<article>`
    + `<aside>`
    + `<details>`
    + `<figcaption>`
    + `<figure>`
    + `<footer>`
    + `<header>`
    + `<main>`
    + `<mark>`
    + `<nav>`
    + `<section>`
    + `<summary>`
    + `<time>`


Binding （バインド） - MDN Web Docs 用語集: ウェブ関連用語の定義

Binding （バインド）
==============

プログラミングにおいて**バインド**とは、識別子と値の関連付けのことです。バインドは変数だけとは限りません。例えば、関数の引数や `catch (e)` ブロックで作成されるバインドは、厳密な意味での「変数」ではありません。さらに、一部のバインドは言語によって暗黙に作成されます。例えば、 JavaScript の `this` や `new.target` などです。

バインドは代入可能であれば変更可能であり、そうでなければ変更不可です。これは、保持している値が変更不可であるという意味ではありません。

バインドはよくスコープと関連付けられます。 JavaScript でバインドを再宣言できるかどうかは、バインドを作成するために使用された構築方法に依存します。

関連情報
----

* `var`
* `let`
* `const`
* `function`
* `class`


WebM - MDN Web Docs 用語集: ウェブ関連用語の定義

WebM
====

**WebM** はロイヤリティフリーでオープンな動画フォーマットです。Mozilla Firefox でも標準でサポートされています。

詳細情報
----

### 基礎知識

* ウィキペディアの「WebM」の記事


Unicode - MDN Web Docs 用語集: ウェブ関連用語の定義

Unicode
=======

Unicode とは、世界の様々な言語、書式、記号に、番号を割り当てて定義した標準の文字コード です。一つ一つの文字 に番号を割り当てることで、プログラマーは、どの言語が混ざっていても、コンピューターに保存、処理、伝送させるような文字エンコーディングを同じファイルやプログラムの中に作ることができます。

Unicode ができる以前は、同じデータのなかに異なる言語を入れることは難しく、誤りが起こりがちでした。例えば、ある文字コードは日本語の文字を格納するためのもので、別のある文字コードはアラビア文字を格納するためのものだとします。もしデータのどの部分がどの文字コードであるか明確に示していない場合、他のプログラムやコンピューターは、文章を誤って表示してしまったり、処理中にデータを破損してしまったりしていました。二重引用符 (`“”`)のような文字が `Ã‚Â£` のようなわけのわからないものに置き換わっているのを見たことがあるかもしれません。それがこの問題です。文字化けとして知られています。

ウェブ上でもっとも一般的な文字エンコーディングは UTF-8 です。UTF-16 や 廃止された UCS-2 といったエンコーディングも存在しますが、UTF-8 が推奨されています。

関連項目
----

* Wikipedia の Unicode
* The Unicode Standard: A Technical Introduction


Chrome (クローム) - MDN Web Docs 用語集: ウェブ関連用語の定義

Chrome (クローム)
=============

ブラウザーにおいては、クローム (chrome) はブラウザーの中で、ウェブページ自体を除いた見える部分すべて (ツールバー、メニューバー、タブなど) のことです。 Google Chrome ブラウザーと混同しないようにしてください。

詳細
--

* Browser and GUI Chrome


OWASP - MDN Web Docs 用語集: ウェブ関連用語の定義

OWASP
=====

**OWASP** (Open Web Application Security Project: オープンウェブアプリケーションセキュリティプロジェクト) は、特にウェブ上で、無償ソフトウェアのセキュリティのために活動する非営利団体や国際的なネットワークを持つ団体です。

詳細情報
----

### 一般知識

* 公式ウェブサイト


Sloppy モード - MDN Web Docs 用語集: ウェブ関連用語の定義

Sloppy モード
==========

ECMAScript 5 以降では、スクリプトで新しい Strict モード モードをオプトインできます。これにより、JavaScript のセマンティクスがいくつかの方法で変更され、復元力が向上し、問題が発生したときに何が起こっているのかを理解しやすくなります。

JavaScript の通常の非厳密モードは、**Sloppy モード**と呼ばれることもあります。これは正式な呼称ではありませんが、真面目に JavaScript のコードを書くことに時間を費やしていると、この呼称に出くわすことがあるでしょう。

関連項目
----

### 一般知識

* "Strict Mode" in chapter 7 ("JavaScript Syntax") in the book Speaking *JavaScript*.


Apple Safari - MDN Web Docs 用語集: ウェブ関連用語の定義

Apple Safari
============

Safari はウェブブラウザーであり、Apple が開発し、 macOS と iOS の両方に組み込まれています。これは、オープンソースの WebKit エンジンに基づいています。

詳細情報
----

### 基礎知識

* ウィキペディア上の記事「Safari」
* apple.com の Safari
### 技術情報

* The WebKit project
* WebKit nightly build
* Reporting a bug for Safari


Object reference (オブジェクト参照) - MDN Web Docs 用語集: ウェブ関連用語の定義

Object reference (オブジェクト参照)
===========================

\*\*オブジェクト\*\*へのリンクです。オブジェクト参照はまさにリンクされたオブジェクトのように使うことができます。

オブジェクト参照の概念は、同じオブジェクトを複数の\*\*プロパティ\*\*に割り当てると明確になります。割り当てらてた各プロパティは、コピーしたオブジェクトを保持するのではなく、同じオブジェクトにリンクしたオブジェクト参照を保持します。これにより、オブジェクトが変更された時、オブジェクトを参照する全てのプロパティに変更が反映されます。

詳細情報
----

### 基礎知識

* Wikipedia 上の「参照 (計算機科学)」


SCM - MDN Web Docs 用語集: ウェブ関連用語の定義

SCM
===

SCM (Source Control Management) は、ソースコードを管理するための仕組みです。一般には、プログラムソースファイルのバージョン管理を行うソフトウェアの総称です。SCM は、ソースコードを誰がどのように変更を行ったかの履歴を保存しているため、プログラマーは有用な部分を消してしまう心配をすることなく、プログラムソースファイルを追加、変更、削除できます。

代表的な SCM として、CVS、SVN、GIT があります。

詳しく学ぶ
-----

### 一般知識

* Wikipedia 上の記事「バージョン管理システム」


OOP (オブジェクト指向プログラミング) - MDN Web Docs 用語集: ウェブ関連用語の定義

OOP (オブジェクト指向プログラミング)
=====================

**OOP** (Object-Oriented Programming、オブジェクト指向プログラミングの略) はデータを **オブジェクト** 内にカプセル化して、その構成部品ではなくてオブジェクト自体が操作される、プログラミングアプローチです。

JavaScript はとてもオブジェクト指向です。これは **プロトタイプ**ベースのモデル (クラスベースの反対) に従っています。

詳細情報
----

### 一般知識

* Wikipedia の オブジェクト指向プログラミング
* JavaScript によるオブジェクト指向入門


Regular expression (正規表現) - MDN Web Docs 用語集: ウェブ関連用語の定義

Regular expression (正規表現)
=========================

**正規表現** (または *regex*) は、検索でどの文字の連続が出てくるのかを決めるルールです。

正規表現はさまざまな言語で実装されてますが、一番有名な実装は Perl による実装です。それは　 PCRE (*Perl Compatible Regular Expression*) といわれる独自の実装エコシステムを生み出しました。ウェブ上では、JavaScript は `RegExp` オブジェクトを介して別の正規表現の実装を提供します。

関連項目
----

### 一般知識

* Wikipedia の 正規表現
* Interactive tutorial
* 可視化された正規表現
### 技術リファレンス

* JavaScript で正規表現を書く


GPL - MDN Web Docs 用語集: ウェブ関連用語の定義

GPL
===

(GNU) GPL （General Public License: 一般公開ライセンス） はフリーソフトウェア財団が公開した 「コピーレフト(copyleft)」 のフリーソフトウェアライセンスです。GPL ライセンスで公開されたプログラムの利用者は、プログラムソースコードを読むこと、変更すること、 また同じライセンスであれば（変更の有無問わず）再配布することにも自由にできます。

詳細
--

* GNU ライセンス（英語）に関するFAQ
* Wikipedia で GNU GPL を調べる
* GPL License テキスト


Three js - MDN Web Docs 用語集: ウェブ関連用語の定義

Three js
========

three.js は JavaScript ベースの WebGL エンジンです。GPU を利用したゲームやその他のグラフィックスアプリを ブラウザー から直接実行できます。three.js ライブラリーは、ブラウザーで 3D のシーンを描画するための多くの機能と API を提供します。

詳細情報
----

### 一般知識

* Wikipedia 上の記事「Three.js」
* three.js 公式サイト


Grid Track (グリッドトラック) - MDN Web Docs 用語集: ウェブ関連用語の定義

Grid Track (グリッドトラック)
=====================

**グリッドトラック**とは、2 本のグリッド線の間の空間のことです。*明示的なグリッド*では、 `grid-template-columns` と `grid-template-rows` プロパティ、または一括指定の `grid` または `grid-template` プロパティを使用して定義します。明示的グリッドで作成したトラックの外側にグリッドアイテムを配置することで、*暗黙的グリッド*にもトラックが生成されます。

次の画像は、グリッドにおける最初の行トラックを表しています。

![グリッドトラックを示す図。](/ja/docs/Glossary/Grid_Tracks/1_grid_track.png)

明示的グリッドにおけるトラックの大きさ
-------------------

`grid-template-columns` および `grid-template-rows` プロパティを使ってグリッドトラックを定義する際には、任意の長さ単位もしくは、グリッドコンテナー中で利用可能な領域の一部分を表す柔軟な単位 `fr` が利用できます。

例
-

次の例は、1 つ目が 200 ピクセルのトラック、2 つ目が 1fr、3 つめが 3fr となる、3 列のトラックから成るグリッドを作っています。グリッドコンテナ中の利用可能な領域のうち 200 ピクセル分を差し引いた残りの領域を 4 分割し、2 つめの列にはその 1 つ分を、3 つめの列には 3 つ分が割り当てられます。
```

\* {
  box-sizing: border-box;
}

.wrapper {
  border: 2px solid #f76707;
  border-radius: 5px;
  background-color: #fff4e6;
}

.wrapper > div {
  border: 2px solid #ffa94d;
  border-radius: 5px;
  background-color: #ffd8a8;
  padding: 1em;
  color: #d9480f;
}
```

```css
.wrapper {
  display: grid;
  grid-template-columns: 200px 1fr 3fr;
}
```

```html
<div class="wrapper">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
  <div>Four</div>
  <div>Five</div>
</div>
```

暗黙的グリッドにおけるトラックの大きさ
-------------------

暗黙的グリッドにおけるトラックは、既定では自動的に大きさが決定されますが、 `grid-auto-rows` および `grid-auto-columns` プロパティでこれらのトラックの大きさを定義することもできます。

関連情報
----

* グリッドレイアウトの基本概念
* CSS グリッドレイアウト仕様書におけるグリッドトラックの定義
* プロパティリファレンス
    + `grid-template-columns`
    + `grid-template-rows`
    + `grid`
    + `grid-template`


WindowProxy - MDN Web Docs 用語集: ウェブ関連用語の定義

WindowProxy
===========

**`WindowProxy`** オブジェクトは `Window` オブジェクトのラッパーです。すべての閲覧コンテキストに `WindowProxy` オブジェクトが存在します。`WindowProxy` オブジェクトに対して実行される操作は、その `WindowProxy` オブジェクトが現在ラップしている `Window` オブジェクトにそのまま反映されます。したがって、`WindowProxy` オブジェクトとのやり取りは、 `Window` オブジェクトと直接やり取りするのとほとんど同じ意味になります。閲覧コンテキストが移動するとき、その `WindowProxy` がラップする `Window` オブジェクトが変更されます。

関連情報
----

* HTML 仕様 : WindowProxy 節
* Stack Overflow の質問 : WindowProxy と Window オブジェクトの違いは ?


Slug (スラグ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Slug (スラグ)
==========

 スラグは、通常は URL の最後にある Web アドレスの固有の識別部分です。
 MDN のコンテキストでは、"<locale> / docs /" に続く URL の部分です。

 親文書の下に新しい文書が作成されたときの最終的な構成要素でもあります。
 たとえば、このページのスラグは `Glossary/スラグ` です。

関連情報
----

* タイトルとスラグの決め方


CORS-safelisted request header (CORS セーフリストリクエストヘッダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

CORS-safelisted request header (CORS セーフリストリクエストヘッダー)
=====================================================

CORS セーフリストリクエストヘッダーは、次の HTTP ヘッダーのうちの一つです:

* `Accept`
* `Accept-Language`
* `Content-Language`
* `Content-Type`

リクエストがこれらのヘッダーのみを含んでいて、なおかつ値が後述の追加要件に合致する場合は、プリフライトリクエストを CORS のコンテキストにおいて送る必要がありません。

`Access-Control-Allow-Headers` ヘッダーを使うと、別のヘッダーをセーフリストとして追加したり、上記のヘッダーをリストアップすることで後述の追加要件を回避することができます:

#### 追加要件

CORS セーフリストリクエストヘッダーとなるためには、次の要件も満たさなければなりません:

* `Accept-Language` と `Content-Language` については、値が次の文字のみで構成されていなければなりません: `0-9`・`A-Z`・`a-z`・空白・`*,-.;=`
* `Accept` と `Content-Type` については、次の *CORS アンセーフリクエストヘッダーバイト*と呼ばれる文字を含んではいけません: `0x00-0x1F` (ただし、`0x09 (HT)` は含めても良い)・`"():<>?@[\]{}`・`0x7F (DEL)`.
* `Content-Type` について: 値をパースした結果（パラメーターを除く）が、`application/x-www-form-urlencoded` か、`multipart/form-data`、`text/plain` のうち、いずれかの MIME タイプでなければなりません。
* すべてのヘッダーについて: 値の長さが128バイトを超えてはいけません。
関連情報
----

* CORS-safelisted response header
* Forbidden header name
* Request header


フェッチメタデータリクエストヘッダー - MDN Web Docs 用語集: ウェブ関連用語の定義

フェッチメタデータリクエストヘッダー
==================

**フェッチメタデータリクエストヘッダー**は、リクエストの発信元のコンテキストに関する追加情報を提供する HTTP リクエストヘッダーです。これらのヘッダー名には `Sec-` の接頭辞が付いており、禁止ヘッダー名であるため、 JavaScript からヘッダーを変更することはできません。

フェッチメタデータリクエストヘッダーは、リクエストがどこから来たのかという追加情報をサーバーに提供し、悪意のあるリクエストを無視できるようになります。

フェッチメタデータリクエストヘッダーには以下のようなものがあります。

* `Sec-Fetch-Site` (en-US)
* `Sec-Fetch-Mode` (en-US)
* `Sec-Fetch-User`
* `Sec-Fetch-Dest` (en-US)

1. Fetch Me
    1. すべての HTTP ヘッダーの一覧
2. 用語集
    1. Entity header
    2. Header
    3. Response header
    4. Request header


Cross Axis (交差軸) - MDN Web Docs 用語集: ウェブ関連用語の定義

Cross Axis (交差軸)
================

フレックスボックス における交差軸 (cross axis / クロス軸) は、主軸 (main axis / メイン軸) と交差する軸で、`flex-direction` が `row` または `row-reverse` であるとき (つまり主軸が行方向であるとき)、列方向の軸のことです。

![列方向の交差軸](/ja/docs/Glossary/Cross_Axis/basics3.png)

主軸が `column` または `column-reverse` の場合は、交差軸は行方向となります。

![行方向の交差軸](/ja/docs/Glossary/Cross_Axis/basics4.png)

交差軸方向のアイテムの配置は、フレックスコンテナーの `align-items` プロパティまたはアイテムの `align-self` プロパティによって行われます。交差軸方向に空間がある複数行のフレックスコンテナーでは、`align-content` を使って行の間を制御することができます。

関連情報
----

### プロパティリファレンス

* `align-content`
* `align-items`
* `align-self`
* `flex-wrap`
* `flex-direction`
* `flex`
* `flex-basis`
* `flex-flow`
* `flex-grow`
* `flex-shrink`
* `justify-content`
* `order`
### 参考文献

* CSS フレックスボックスガイド: *フレックスボックスの基本概念*
* CSS フレックスボックスガイド: *フレックスコンテナー内のアイテムの配置*
* CSS フレックスボックスガイド: *フレックスアイテムの折り返しをマスターする*
* 用語集
    + Flex
    + フレックスコンテナー
    + フレックスアイテム
    + グリッド


Type conversion (型変換) - MDN Web Docs 用語集: ウェブ関連用語の定義

Type conversion (型変換)
=====================

型変換 (Type conversion) (または型キャスト (typecasting) ) は、データをあるデータ型から別なデータ型に変換することを意味します。*暗黙の型変換*は、コンパイラーが自動的にデータ型を割り当てるものの、その場でソースコードで*明示的に*型変換が必要な場合もあります。例えば、 `5+2.0` という命令が与えられた場合、浮動小数点の `2.0` は暗黙的に整数に型キャストされますが、 `Number("0x11")` という命令が与えられた場合、 "0x11" の文字列は明示的に数値の 17 として型キャストされます。

1. 用語集
    1. 型
    2. 型強制
2. Wikipedia の記事
    1. 型変換


HTTPS - MDN Web Docs 用語集: ウェブ関連用語の定義

HTTPS
=====

**HTTPS** (***HyperText Transfer Protocol Secure***) は HTTP プロトコルを暗号化したバージョンです。 HTTPS は通常、 SSL または TLS を用いてクライアントとサーバー間のすべての通信を暗号化します。この安全な接続により、クライアントは機密データをサーバーと安全に交換できます (例えば、銀行取引やオンラインショッピングなどで)。

1. 一般知識
    1. Wikipedia 上の HTTPS
    2. Moving to HTTPS community guide
    3. 安全なコンテキスト
2. MDN Web Docs 用語集
    1. HTTP
    2. SSL
    3. TLS


Encapsulation (カプセル化) - MDN Web Docs 用語集: ウェブ関連用語の定義

Encapsulation (カプセル化)
=====================

Encapsulation (カプセル化) とは、データと関数を一つのコンポーネント (例えば、クラス) に閉じ込め、そのコンポーネントへのアクセスを制御することにより、そのオブジェクトを "ブラックボックス" にすることです。これにより、そのクラスのユーザは隠れた実装ではなくインターフェース（すなわち、そのクラスの外に対して公開されているデータと関数）を知っているだけで済みます。

詳細情報
----

### 一般知識

* カプセル化 (Wikipedia)


Hyperlink (ハイパーリンク) - MDN Web Docs 用語集: ウェブ関連用語の定義

Hyperlink (ハイパーリンク)
===================

ハイパーリンクはウェブページやデータ項目をお互いに接続します。HTML では `<a>` 要素が、ウェブページのある場所 (テキスト文字や画像のようなもの) から、その他のウェブページ (や同じページでも) のどこかの場所へのハイパーリンクを定義します。

詳細情報
----

### 一般知識

* Wikipedia の Hyperlink
* MDN の ハイパーリンク (en-US) ガイド
### 技術リファレンス

* Links in HTML Documents - W3C
* HTML5 a - hyperlink - W3C
### これについて学習する

* MDN の `<a>`
* MDN の `<link>`


User agent (ユーザーエージェント) - MDN Web Docs 用語集: ウェブ関連用語の定義

User agent (ユーザーエージェント)
=======================

ユーザーエージェントは個人を表すコンピューターのプログラムで、例えばウェブにおけるブラウザーに当たるものです。

ブラウザーのほかに、ウェブページをスクレイピングするボット、ダウンロードマネージャー、その他のウェブにアクセスするアプリがユーザーエージェントになる可能性もあります。ブラウザーはサーバーに対してリクエストを行う際に毎回、 HTTP の `User-Agent` ヘッダーに、ユーザーエージェント (UA) 文字列と呼ばれる自分自身を識別する文字列を含めます。この文字列はブラウザー、バージョン番号、ホストのオペレーティングシステムなどを識別します。

スパムボット、ダウンロードマネージャー、一部のブラウザーは、異なるクライアントであると見せかけるために偽の UA 文字列を送ることがあります。これは *user agent spoofing* と呼ばれています。

ユーザーエージェント文字列は、クライアント側の JavaScript で `navigator.userAgent` を使用することでアクセスできます。

ユーザーエージェント文字列は、 `"Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:35.0) Gecko/20100101 Firefox/35.0"` のようなものが一般的です。

関連情報
----

### 一般知識

* Wikipedia のユーザーエージェント
### 技術リファレンス

* `navigator.userAgent`
* User Agent を用いたブラウザーの判定
* RFC 2616: 14.43: The `User-Agent` header

1. MDN Web Docs 用語集
    1. ブラウザー
2. HTTP ヘッダー
    1. `User-agent`


Network throttling (ネットワークスロットリング) - MDN Web Docs 用語集: ウェブ関連用語の定義

Network throttling (ネットワークスロットリング)
==================================

**ネットワークスロットリング**とは、インターネットの速度を意図的に低下させることです。ウェブパフォーマンスにおいて、ネットワークスロットリング、またはネットワーク状態のエミュレーションでは、サイトのターゲットユーザーの大部分が経験している低帯域の状態をエミュレートするために使用されます。

ユーザーがモバイルで経験するネットワーク状態を見落とさないようにすることが重要です。企業のオフィスビルの中で、高性能なコンピュータを使ってウェブアプリケーションを作成する開発者のインターネット速度は、一般的に非常に高速です。開発者、テクニカルライター、デザイナーであれば、このような経験があるでしょう。しかし、モバイルユーザーがウェブアプリケーションにアクセスする際のネットワーク速度は、旅行中やデータプランの適用範囲が狭い遠隔地では、インターネットに接続できたとしても非常に低速になる可能性があります。ネットワークスロットリングを使えば、開発者はユーザーの体験を再現することができます。ブラウザーのインスペクターなど、ほとんどのブラウザー開発ツールには、さまざまなネットワーク条件をエミュレートする機能があります。ネットワークスロットリングによってユーザーの体験をエミュレートすることで、ロードタイムの問題をより容易に特定し、修正することができます。

ブラウザーの開発者ツールには、一般的にネットワークスロットリングのオプションが用意されており、低速なネットワーク環境下でアプリケーションをテストすることができます。たとえば、Firefox の開発者ツールでは、ネットワークモニターとレスポンシブデザインモードの両方で、ネットワーク速度オプション (例: 無線 LAN、良好な3G、2G...) を含むドロップダウンメニューが利用できます。

関連情報
----

* 合成モニタリング


Transport Layer Security (TLS) - MDN Web Docs 用語集: ウェブ関連用語の定義

Transport Layer Security (TLS)
==============================

**TLS (Transport Layer Security)** は、以前は SSL (Secure Sockets Layer) として知られていたもので、ネットワーク上で安全に通信するためにアプリケーションが使用するプロトコルであり、電子メール、ウェブ閲覧、メッセージング、その他のプロトコルの改ざんや盗聴を防止します。 SSL と TLS はどちらもクライアント・サーバー型のプロトコルであり、暗号化したプロトコルを使用してプライバシーを保証することで、ネットワークを通じたセキュリティを提供します。サーバーとクライアントが TLS を使用して通信するすれば、どのメッセージも第三者によって盗聴や改ざんされていないことが保証されます。

最新のブラウザーはすべて TLS プロトコルに対応しており、有効なデジタル証明書の提供をサーバーに要求してその身元を確認し、安全な接続を確立します。クライアントとサーバーの両者がそれぞれのデジタル証明書を提供すれば、相互に認証することができます。

**メモ:** TLS 1.0 と 1.1 への対応は、2020 年の初頭にすべての主要なブラウザーから削除される予定です。今後はウェブサーバーが TLS 1.2 や 1.3 に対応していることを確認する必要があります。 Firefox はバージョン 74 時点で、古いバージョンの TLS を使用しているサーバーに接続する場合に Secure Connection Failed エラーを返すようになる予定です (Firefox バグ 1606734)。

1. 仕様書
    1. RFC 5246 (The Transport Layer Security Protocol, Version 1.2)
2. Wikipedia の記事
    1. Transport Layer Security
3. 関連情報
    1. Transport Layer Security
    2. OWASP: Transport Layer Protection Cheat Sheet
4. 用語集
    1. HTTPS
    2. SSL


Wrapper (ラッパー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Wrapper (ラッパー)
==============

JavaScript のようなプログラミング言語において、ラッパー (wrapper) は 1 つ以上の他の関数を呼び出すための関数であり、時には純粋に利便性のために、時にはプロセス中でまったく異なるタスクに合わせるために使用されます。

例えば、AWS の SDK ライブラリはラッパーの例になります。

理解を深める
------

### 一般知識

Wikipedia の Wrapper function (英語)

1. MDN Web Docs 用語集
    1. API
    2. Class
    3. Function


markup (マークアップ) - MDN Web Docs 用語集: ウェブ関連用語の定義

markup (マークアップ)
===============

マークアップ言語は、テキストを定義し提示するために設計された言語です。 HTML (HyperText Markup Language) は、マークアップ言語の一例です。

HTML ファイルなどのテキストファイル内で、要素はコンテンツのその部分の目的を説明するタグを使用して*マークアップ*されます。

マークアップ言語の種類
-----------

**視覚マークアップ:**

伝統的な WYSIWYG (what you see it is what you get) に基づくワードプロセッサーで使用されています。これは人間の作成者、ユーザー、編集者から隠蔽されているものです。

**手続きマークアップ:**

テキストと組み合わせてテキスト処理をプログラムへ指示するものです。このテキストは作成者から視覚的に操作されます。

**意味マークアップ:**

文書の区間をプログラムがどのように扱うべきかでラベル付けします。例えば、 HTML の `<td>` は HTML の表でセルを定義します。

1. MDN Web Docs 用語集
    1. HTML
    2. XHTML
    3. XML
    4. SVG


Flex コンテナ - MDN Web Docs 用語集: ウェブ関連用語の定義

Flex コンテナ
=========

Flexbox レイアウトは親要素の `display` プロパティの値に `flex` または `inline-flex` を指定することで定義されます。この親要素が\*\*「flex コンテナ」\*\*となり、その子要素が 「flex アイテム」(flex item) となります。

値に `flex` を指定すると、この要素はブロックレベルの flex コンテナとなり、`inline-flex` を指定すると、インラインレベルの flex コンテナとなります。これらの指定は、その要素に対する\*\*「flex 整形文脈 (flex formatting context)」\*\*を作成します。Flex 整形文脈は、フロートがコンテナに侵入せず、コンテナのマージンがアイテムのマージンによって相殺されないという点で、ブロック整形文脈と同様のものです。

関連項目
----

### プロパティリファレンス

* `align-content`
* `align-items`
* `flex`
* `flex-direction`
* `flex-flow`
* `flex-wrap`
* `justify-content`
### 参考文献

* CSS フレックスボックスガイド: *フレックスボックスの基本概念*
* CSS フレックスボックスガイド: *フレックスコンテナー内のアイテムの配置*
* CSS フレックスボックスガイド: *フレックスアイテムの折り返しをマスターする*


Glyph (字体) - MDN Web Docs 用語集: ウェブ関連用語の定義

Glyph (字体)
==========

**字体**は、1 つ以上の文字を視覚的に表現するためにタイポグラフィで使用される用語です。

ウェブサイトで使用されるフォントには、フォントの文字を表すさまざまな字体のセットが含まれています。

詳細情報
----

### 一般知識

* 字体 (Wikipedia)
* Glyph, character and grapheme on Quora


IETF - MDN Web Docs 用語集: ウェブ関連用語の定義

IETF
====

Internet Engineering Task Force (IETF) は、インターネットの背後にあるメカニズム (特に TCP/IP やインターネットプロトコルスイート) を規定する仕様書を作成する世界的な組織です。IETF はオープンで、ボランティアが運営し、インターネットソサエティが後援します。

より詳しく知る
-------

### 一般知識

* IETF の公式ウェブサイト
* Wikipedia 上の IETF
* インターネットソサエティ の公式ウェブサイト
* Wikipedia 上の インターネットソサエティ


Thread (スレッド) - MDN Web Docs 用語集: ウェブ関連用語の定義

Thread (スレッド)
=============

コンピュータ科学におけるスレッドは、複数のタスクやプログラムを同時に実行することです。それぞれのコードを実行できる機能の単位は**スレッド**と呼ばれています。

**メインスレッド** はそのうちの一つで、ブラウザーがユーザーイベントを扱い、画面に表示や描画を行い、通常のウェブページやアプリを構成するコードの大部分を実行します。これらのものがすべて一つのスレッドで行われるため、速度の遅いウェブサイトやアプリのスクリプトがブラウザー全体の速度を落とします。さらに悪いことに、サイトやアプリのスクリプトが無限ループに入ると、ブラウザー全体がハングアップすることがあります。これは使い勝手がのろく (または悪く) 失望させるものになります。

しかし、最近の JavaScript は追加のスレッドを生成する方法を提供しており、それぞれが独立して実行され互いに通信することができます。これは **ウェブワーカー** のような技術で実現されており、独自のスレッドでメインスレッドと同時に実行されるサブプログラムを分岐させるために使用することができます。これによって遅いタスク、複雑なタスク、実行に時間がかかるタスクをメインスレッドから独立して実行し、サイトやアプリの全体的な性能を、ひいてはブラウザー全体の性能を保護します。これで最近のマルチコアプロセッサーの利点を活用することもできます。

**サービスワーカー** と呼ばれる特殊な種類のワーカー —ユーザーの許可により—サイトの背後に隠れてユーザーがサイトを使用していないときにも実行されるものを作成することもできます。これにより、サイトを頻繁に操作していない間に何かが起こった時、ユーザーに通知することができるサイトを作成するために使用することができます。例えばメールサービスにログインしていない状態でも新しいメールが届いたことをユーザーに通知したりするなどです。

全体的に見て、オペレーティングシステム内のこれらのスレッドは非常に有用であることがわかります。これらのスレッドは、コンテキストの切り替え時間を最小限に抑え、より効率的な通信を可能にし、マルチプロセッサアーキテクチャのさらなる利用を可能にします。

関連情報
----

* 非同期 JavaScript
* ウェブワーカー API
* サービスワーカー API
* 用語集
    + メインスレッド


Rendering engine (レンダリングエンジン) - MDN Web Docs 用語集: ウェブ関連用語の定義

Rendering engine (レンダリングエンジン)
=============================

**レンダリングエンジン**は画面にテキストと画像を描画するソフトウェアです。このエンジンは構造化文書 (たいてい HTML) を描画して、所与のスタイル定義 (たいてい CSS にて与えられる) に基づいて整形します。レイアウトエンジンの例としては、 Blink, Gecko, EdgeHTML, WebKit があります。

詳細情報
----

### 一般知識

* Wikipedia の HTMLレンダリングエンジン
### 技術リファレンス

* Gecko のドキュメント
* Venkatraman.R - Behind Browsers (Part 1, Basics)


XForms - MDN Web Docs 用語集: ウェブ関連用語の定義

XForms
======

**XForms** はウェブフォームを構築し、フォームのデータを XML 形式で処理するための慣例です。

**メモ:** もう主要なブラウザーは XForms に対応していません。 — 代わりに HTML5 フォームを使うことをお勧めします。


Data structure (データ構造) - MDN Web Docs 用語集: ウェブ関連用語の定義

Data structure (データ構造)
======================

**データ構造**は、データを効率的に使用できるように整理する特別な方法です。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の データ構造


Syntax error (構文エラー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Syntax error (構文エラー)
====================

あらかじめ定義された構文の誤った使用による例外。構文エラーは、ソースコードのコンパイルまたは構文解析中に検出されます。

例えば、JavaScript 関数を定義するときに閉じ括弧（`}`）を省略すると、構文エラーが発生します。ブラウザー開発ツールは、JavaScript と CSS の構文エラーをコンソールに表示します。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の Syntax error (英語)
* `SyntaxError` JavaScript オブジェクト


URN - MDN Web Docs 用語集: ウェブ関連用語の定義

URN
===

URN (Uniform Resource Name) は URI の基本的なフォーマットの一つであり、リソースを参照をしますが、場所を特定したり存在の有無を確認したりする必要はありません。RFC3986からの例です: `urn:oasis:names:specification:docbook:dtd:xml:4.1.2`

詳細情報
----

### 一般知識

* ウィキペディアのURN の記事です


Input method editor (インプットメソッドエディター) - MDN Web Docs 用語集: ウェブ関連用語の定義

Input method editor (インプットメソッドエディター)
====================================

インプットメソッドエディター (IME) は、テキスト入力のための特殊なユーザーインターフェイスを提供するプログラムです。インプットメソッドエディターは多くの場面で使用されています。

* ラテンキーボードを使用した中国語、日本語、韓国語の入力
* テンキーを使用したラテン文字の入力
* 手書き文字認識を使用したタッチ画面のテキスト入力

1. Wikipedia の記事
    1. インプットメソッド
2. 用語集
    1. 国際化対応


Plugin (プラグイン) - MDN Web Docs 用語集: ウェブ関連用語の定義

Plugin (プラグイン)
==============

ブラウザープラグインとは、ブラウザーがネイティブに対応できないコンテンツを扱うために、ユーザーがインストールすることができるソフトウェアコンポーネントのことです。ブラウザープラグインは通常、 NPAPI (Netscape Plugin Application Programming Interface) アーキテクチャを使用して記述されています。

最も有名で広く使われていたプラグインは Adobe Flash Player で、これによりブラウザーで Adobe Flash コンテンツを実行できるようになりました。

ブラウザーがより強力になるにつれて、プラグインはあまり有用ではなくなってきました。また、プラグインはウェブユーザーにセキュリティやパフォーマンスの問題を引き起こしてきた歴史があります。

2016 年から 2021 年にかけて、ブラウザーベンダーはプラグイン、特に Adobe Flash の廃止ロードマップに取り組み、今日では、プラグインは主要なブラウザーが対応しなくなりました。

プラグインはブラウザーの拡張機能と混同してはいけません。こちらはプラグインとは異なり、バイナリーではなくソースコードとして配布され、特に WebExtensions システムを使用してブラウザーがまだ対応しているものです。

関連情報
----

* Adobe Flash 終了アナウンス


Opera Browser - MDN Web Docs 用語集: ウェブ関連用語の定義

Opera Browser
=============

**Opera** は、5 番目に多用されるウェブブラウザーであり、1996 年に公式リリースされた当初は Windows のみで動作していました。Opera は、2013 年からレイアウトエンジンとして Blink を使用しています (以前は、Presto でした)。Opera には、モバイルやタブレット端末バージョンもあります。

詳細情報
----

### 一般知識

* Wikipedia 上の Opera
* Opera ブラウザーウェブサイト


ICANN - MDN Web Docs 用語集: ウェブ関連用語の定義

ICANN
=====

**ICANN** (Internet Corporation for Assigned Names and Numbers、**アイキャン**) は国際非営利組織で、ドメインネームシステム や IP アドレスのレコードをメンテナンスしています。

関連項目
----

### 一般知識

* Official website
* Wikipedia の ICANN


Modularity (モジュール性) - MDN Web Docs 用語集: ウェブ関連用語の定義

Modularity (モジュール性)
===================

モジュール性という用語は、システムのコンポーネントを分離して再結合できる程度を指しており、またソフトウェアパッケージを論理ユニットに分割することもあります。モジュラーシステムの利点は、部品を独立して考えることができることです。

関連項目
----

* Wikipedia 上の Modularity （英語）
* Wikipedia 上の モジュール


ARIA - MDN Web Docs 用語集: ウェブ関連用語の定義

ARIA
====

**ARIA** (*Accessible Rich Internet Applications*) は、支援技術の W3C 仕様で、ユーザーに応じてセマンティクスやその他のメタデータを HTML へ付加します。

例えば、`<p>` タグに `role="alert"` 属性を付加することで、そのタグ内の情報が重要かつ時間依存であることを視覚に障害を持つユーザーに知らせることができます（仮に視覚に障害のないユーザーであれば、文字色を変えることでも同じ内容を伝えられるかもしれません）。

関連項目
----

* ARIA


HTTP header (HTTP ヘッダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

HTTP header (HTTP ヘッダー)
=======================

**HTTP ヘッダー**は、 HTTP リクエストおよび HTTP レスポンスのフィールドで、メッセージや本文のセマンティクスを変更したり、より詳細に説明したりするための追加情報を渡します。ヘッダーは大文字と小文字を区別せず、行の先頭から始まり、直後に `':'` とヘッダー自体に依存する値が続きます。値は、次の CRLF またはメッセージの最後で終了します。

従来より、ヘッダーはカテゴリ分けされてきましたが、この分類は仕様書では定義されていません。

* 一般ヘッダー: リクエストとレスポンスの両方に適用され、最終的に本文の中で送信されるデータとは関係のないヘッダー。
* リクエストヘッダー: 取得するリソース又はクライアント自体に関する詳細情報を含むヘッダー。
* レスポンスヘッダー: レスポンスについての追加情報、例えば場所やサーバー自身についての情報 (名前、バージョン、など) を含むヘッダー。
* エンティティヘッダー: コンテンツの長さや MIME タイプなど、エンティティの本文に関する詳細情報を含むヘッダー。

一つのヘッダーを持つ基本的なリクエストの例です。
```

GET /example.http HTTP/1.1
Host: example.com
```

リダイレクトの場合は、必須のヘッダー (`Location`) があります。
```

302 Found
Location: /NewPage.html
```

典型的な一連のヘッダーの例です。
```

304 Not Modified
Access-Control-Allow-Origin: *
Age: 2318192
Cache-Control: public, max-age=315360000
Connection: keep-alive
Date: Mon, 18 Jul 2016 16:06:00 GMT
Server: Apache
Vary: Accept-Encoding
Via: 1.1 3dc30c7222755f86e824b93feb8b5b8c.cloudfront.net (CloudFront)
X-Amz-Cf-Id: TOl0FEm6uI4fgLdrKJx0Vao5hpkKGZULYN2TWD2gAWLtr7vlNjTvZw==
X-Backend-Server: developer6.webapp.scl3.mozilla.com
X-Cache: Hit from cloudfront
X-Cache-Info: cached
```

1. 仕様書
    1. HTTP 仕様書におけるヘッダーの構文。
2. 技術リファレンス
    1. 全ての HTTP ヘッダー一覧
3. 用語集
    1. HTTP ヘッダー
    2. 一般ヘッダー
    3. リクエストヘッダー
    4. レスポンスヘッダー
    5. エンティティヘッダー
    6. 禁止ヘッダー名
    7. 禁止レスポンスヘッダー名
    8. CORS セーフリストリクエストヘッダー
    9. CORS セーフリストレスポンスヘッダー


Code splitting (コード分割) - MDN Web Docs 用語集: ウェブ関連用語の定義

Code splitting (コード分割)
======================

**コード分割**とは、コードをさまざまなバンドルまたはコンポーネントに分割することです。そうすることで、必要に応じて特定のコンポーネントのみを読み込んだり、並列で読み込んだりすることを可能にします。

たとえアプリケーションの複雑さが増すことなく、シンプルに維持されるとしても、CSS や JavaScript、バンドルといったファイルのサイズは増大するのが普通です。特にサードパーティのライブラリを導入していた場合、それらのファイルサイズ増大に伴ってアプリケーションのサイズも増します。そうした大きくなってしまったファイルを読み込むことを避けるために、コード分割を実施します。

ページの読み込み時すぐに必要なファイルはその時点で読み込み、そうでないものはその後に読み込みを行って対応します(遅延読み込み)。こうすることで、コード総量は同じであっても『初期ロード中に必要なコード量』を減らすことができパフォーマンスを向上させることができます。

関連項目
----

* Bundling
* Lazy loading (en-US)
* HTTP/2
* Tree shaking


frame rate (フレームレート, FPS) - MDN Web Docs 用語集: ウェブ関連用語の定義

frame rate (フレームレート, FPS)
=========================

**フレームレート**は、ブラウザーが表示するコンテンツの再計算、レイアウト、描画をすることができる速度です。**フレーム毎秒** (frame per second) または **fps** は、1 秒間に何枚のフレームを再描画できるかを表します。ウェブサイトのコンピューターグラフィックスでのフレームレートの目標値は 60fps です。

映画では一般に、フレームレートは 24fps です。フレームレートが低くても大丈夫なのは、被写体ぶれで錯覚が発生するためです。コンピューターの画面上を動く場合は被写体ぶれはありません (被写体ぶれのある画像スプライトを動かしている場合を除いて)。

1. Glossary
    1. FPS
2. Wikipedia 記事
    1. フレームレート


パケット - MDN Web Docs 用語集: ウェブ関連用語の定義

パケット
====

パケット、またはネットワークパケットはは、ネットワーク上で送られる整形されたデータの塊です。パケットはユーザーデータと制御情報を含みます。ユーザーデータは*ペイロード*として知られています。制御情報はペイロードを送るための制御情報です。この制御情報は、送信元と送信先のネットワークアドレス、順序情報、エラー検知コードで構成されており、通常パケットのヘッダーとフッターで見られます。

パケットに含まれるもの
-----------

### ホップ制限

ホップとは、パケットがあるネットワークから次のネットワークに渡されるときに発生するものです。これは、パケットが通過するたびに 1 ずつ減少するフィールドで、 0 になると失敗してパケットは破棄されます。

時間が経つにつれ、パケット数は閉回路内を循環する原因となり、循環するパケット数は蓄積され、最終的にはネットワークの失敗につながることになります。

### 誤り検出訂正

誤り検出訂正とは、データを受信者に送信する際に発生する誤りを検出して訂正するためのコードです。誤り訂正には、後方誤り訂正と前方誤り訂正の２種類があります。後方誤り訂正とは、受信機が送信機に対してデータ単位全体の再送信を要求する場合です。前方誤り訂正は、受信機が自動的に誤りを訂正する誤り訂正符号を使用する場合です。

送信側では、パケットが送信される前に計算が行われます。宛先で受信すると、チェックサムが再計算され、パケット内のチェックサムと比較されます。

### 優先度

このフィールドは、どのパケットが他のパケットよりも高い優先度を持つべきかを示します。優先度の高いキューは、ネットワークが混雑しているときに、優先度の低いキューよりも早く空になります。

### アドレス

ネットワークパケットをルーティングする際には、送信元ホストの送信元アドレスと受信先ホストの送信先アドレスの 2 つのネットワークアドレスが必要になります。

### ユーザーデータ - ペイロード

ペイロードとは、アプリケーションに代わって運ばれるデータのことである。ペイロードの長さは通常可変で、ネットワークプロトコルや場合によっては経路上の機器によって設定される最大値までの長さがあります。

使用したリファレンス
----------

* https://en.wikipedia.org/wiki/Network\_packet
* https://en.wikipedia.org/wiki/Hop\_(networking)
* https://www.techradar.com/news/computing/how-error-detection-and-correction-works-1080736


Round Trip Time (ラウンドトリップタイム) - MDN Web Docs 用語集: ウェブ関連用語の定義

Round Trip Time (ラウンドトリップタイム)
=============================

**ラウンドトリップタイム (RTT)** とは、データパケットが宛先に送信されるのにかかる時間と、そのパケットの確認応答が発信元で受信されるのにかかる時間の長さです。ネットワークとサーバー間の RTT は、`ping` コマンドを使用して計測できます。

```bash
$ ping example.com
PING example.com (216.58.194.174): 56 data bytes
64 bytes from 216.58.194.174: icmp\_seq=0 ttl=55 time=25.050 ms
64 bytes from 216.58.194.174: icmp\_seq=1 ttl=55 time=23.781 ms
64 bytes from 216.58.194.174: icmp\_seq=2 ttl=55 time=24.287 ms
64 bytes from 216.58.194.174: icmp\_seq=3 ttl=55 time=34.904 ms
64 bytes from 216.58.194.174: icmp\_seq=4 ttl=55 time=26.119 ms
--- google.com ping statistics ---
5 packets transmitted, 5 packets received, 0.0% packet loss
round-trip min/avg/max/stddev = 23.781/26.828/34.904/4.114 ms
```

上記の例は、最終行に平均ラウンドトリップタイムが 26.8ms と表示されています。

関連情報
----

* Time to First Byte (TTFB)
* レイテンシー


EXIF - MDN Web Docs 用語集: ウェブ関連用語の定義

EXIF
====

**Exchangeable Image File Format (EXIF)** は、マルチメディアファイルのメタデータをファイル内に埋め込む方法を定めた規格です。例えば画像の場合、次のような情報を記述した EXIF データを含んでいることがあります。ピクセル単位の幅や高さ、解像度、シャッタースピード、絞り、 ISO 設定、撮影日など。

関連情報
----

* EXIF (Wikipedia)
* CIPA 規格類, including "CIPA DC-008-2019 デジタルスチルカメラ用画像ファイルフォーマット規格 Exif 2.32"


Statement (文) - MDN Web Docs 用語集: ウェブ関連用語の定義

Statement (文)
=============

コンピュータープログラミング言語では、**文**はタスクを実行するコード行です。すべてのプログラムは文の連続から成っています。

関連項目
----

### 一般知識

* Wikipedia の 文\_(プログラミング)
### 技術リファレンス

* JavaScript の文と宣言


Block (ブロック) - MDN Web Docs 用語集: ウェブ関連用語の定義

Block (ブロック)
============

**ブロック**という用語は、文脈に応じていくつかの意味を持つことがあります。以下のものを参照してください。

Block (ブロック) (CSS)
ウェブページにおいて **ブロック** (block) は、新しい行、つまり、横書きでは前の要素の下、次の要素の上に現れる HTML のelementです（よく*ブロックレベル要素*として知られています）。例えば、 `p` は既定ではブロックレベル要素であり、それに対して `a` は*インライン要素*です。 — HTML ソース内で複数のリンクを互いに隣に置くことができ、出力時には互いに同じ行に表示されます。
Block (ブロック) (スクリプティング)
JavaScript では、ブロックは、中括弧 ("`{}`") で囲まれた関連するstatementの集合です。 たとえば、 `Statements/if...else` ブロックの後に文のブロックを置くことができます。これは、条件が真であればインタープリターがブロック内のコードを実行する必要があることを示し、条件が偽の場合はブロック全体をスキップします。


CORS-safelisted response header (CORS セーフリストレスポンスヘッダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

CORS-safelisted response header (CORS セーフリストレスポンスヘッダー)
======================================================

*CORS セーフリストレスポンスヘッダー* は、CORS レスポンスに含まれる HTTP ヘッダーで、クライアントスクリプトに公開しても *安全* であると見なされます。セーフリストに含まれたレスポンスヘッダーのみがウェブページで利用できます。

既定では以下のレスポンスヘッダーがセーフリストに含まれます。

* `Cache-Control`
* `Content-Language`
* `Content-Length`
* `Content-Type`
* `Expires`
* `Last-Modified`
* `Pragma`

`Access-Control-Expose-Headers` ヘッダーを使用して追加のヘッダーをセーフリストに追加することができます。

**メモ:** `Content-Length` は既定のセーフリストではありませんでした。 [参照]

例
-

### セーフリストの拡張

`Access-Control-Expose-Headers` ヘッダーを使用して、CORS セーフリストレスポンスヘッダーのリストを拡張することができます。
```

Access-Control-Expose-Headers: X-Custom-Header, Content-Encoding
```

関連情報
----

* HTTP
* HTTP headers
* `Access-Control-Expose-Headers`
* 用語集
    + CORS
    + CORS セーフリストリクエストヘッダー
    + 禁止ヘッダー名
    + リクエストヘッダー


BiDi (双方向) - MDN Web Docs 用語集: ウェブ関連用語の定義

BiDi (双方向)
==========

**BiDi** (BiDirectional、双方向) は、右から左および左から右に向かって書くテキストの両方を含む文書を指します。両方の方向性が同じパラグラフで発生しても、各言語のテキストは適切な方向性で表示されなくてはなりません。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の 双方向テキスト
### 技術文書

* Bidi アプリの開発


High-level programming language (高水準言語) - MDN Web Docs 用語集: ウェブ関連用語の定義

High-level programming language (高水準言語)
=======================================

高水準言語は、コンピューターの命令の詳細を**大幅に抽象化**します。人間が容易に理解できるように設計されているため、別のソフトウェアで翻訳する必要があります。低水準言語とは異なり、自然言語要素を使用したり、コンピューティングシステムの大半の領域を自動化（または完全に隠蔽）して、低水準言語に比べて開発プロセスをより簡単で理解しやすいものにします。提供される抽象化の量によって、プログラミング言語がいかに「高水準」であるかが定義されます。

マシンコードに自動的に変換可能だが人間のロジックに近い言語のアイデアは、1950 年代にコンピューターサイエンスに導入されました。特に **John Backus**（IBM）の仕事のおかげで、最初の高水準言語 Fortran が広く流通しました。この革新により、Backus はチューリング賞を受賞しました。


GPU - MDN Web Docs 用語集: ウェブ関連用語の定義

GPU
===

GPU (Graphics Processing Unit) は、コンピューターの構成要素で、CPU (Central Processing Unit) に似ています。モニター上のグラフィックス (2D と 3D の両方) の描画に特化しています。


XInclude - MDN Web Docs 用語集: ウェブ関連用語の定義

XInclude
========

XInclude は、文書に他の文書または他の文書の一部を含められるようにする、包含タグを定めた W3C 勧告です。他の XML ファイルやテキストファイルからコンテンツを取り込むことができます。

主要なブラウザーは、XInclude の仕組みを標準ではサポートしていません。

関連情報
----

* XInclude standard
* `XPath`


API - MDN Web Docs 用語集: ウェブ関連用語の定義

API
===

API (Application Programming Interface) とは、あるソフトウェアプログラム(アプリケーション)が、他のソフトウェアやハードウェア等、外部とやりとりをするために備えている機能や規則の集まりです - 人間のユーザーインターフェイスと比較されます。API は、それを提供するアプリケーションと、第 3 者のソフトウェアやハードウェアといった他の項目との間の、単純な契約(インターフェイス)です。

Web 開発においては、API と言えば一般的にはコーディング上の取り決めです (例えば メソッド 、プロパティ 、 events、URL) が挙げられます。ブラウザーのコンポーネントやユーザーのコンピューター上にあるソフトやハード、第 3 者のウェブサイトやサービスとやり取りするアプリケーションを開発するには API を使います。

例えば:

* getUserMediaAPI はユーザーの Webcam から音声やビデオを利用することを可能とし、例えばビデオや音声の記録や、それらを電話会議の他のユーザーに流したり、ビデオから静止画を取り出すなどの方法で開発者の望むままに利用されます。
* Geolocation API はデバイスで有効なあらゆるサービス（例えば GPS など）を用いてユーザーの位置情報を取得でき、例えば Google Maps API と組み合わせることでユーザーの位置をカスタマイズした地図にプロットし、そのエリアにどのような観光名所があるか表示することを可能とします。
* Twitter APIs はウェブページに最新のツイートを表示するなど、ユーザーの Twitter アカウントからデータを取り出すために利用されています。
* Web Animations API は画像を動かしたり回転させるなど、Web ページの一部をアニメーションにするために利用されています。
関連項目
----

### 一般知識

* Wikipedia 上の記事「API 」
### 技術リファレンス

* Web API リファレンス


Graceful degradation (グレースフルデグラデーション) - MDN Web Docs 用語集: ウェブ関連用語の定義

Graceful degradation (グレースフルデグラデーション)
=====================================

**グレースフルデグラデーション** (上品な劣化) とは設計哲学の一つで、最新のブラウザーで動作するように新しいウェブサイトやアプリケーションを構築するものの、古いブラウザーでも、良いものでなくても基本的なコンテンツや機能を引き続き提供する使用方法で代替できるようにしようとすることを目指したものです。

ポリフィルを使用して JavaScript で不足している機能を構築することは可能ですが、 CSS のカスケードや HTML の代替の振る舞いなど、可能な限りスタイル付けやレイアウトなどの機能の代替案を用意する必要があります。いくつかの良い事例は、一般的な HTML と CSS の問題の扱いで見ることができます。

これは、ウェブサイトが複数の未知のユーザーエージェントからアクセスされるという状況下で、ウェブ開発者が最良の可能性を持ったウェブサイトを開発することに集中できるようにするために有用なテクニックです。プログレッシブエンハンスメントは関連していますが、異なります。これはよくグレースフルデグラデーションとは反対の方向に向いているとよく見られます。実際には、両方のアプローチが有効であり、互いに補完することができます。

1. Wikipedia 上の Graceful degradation (英語)
2. 一般的な HTML と CSS の問題への対処
3. 機能検出の実装
4. MDN Web Docs 用語集
    1. グレースフルデグラデーション
    2. ポリフィル
    3. プログレッシブエンハンスメント


Grid Areas (グリッド領域) - MDN Web Docs 用語集: ウェブ関連用語の定義

Grid Areas (グリッド領域)
===================

**グリッド領域**はグリッド上で一つ以上の グリッドセル からなる長方形の領域です。グリッド領域は線指定による配置や名前付きグリッド領域で領域を定義すると作成されます。

![ハイライトされたグリッド領域を示す画像](/ja/docs/Glossary/Grid_Areas/1_grid_area.png)

グリッド領域はその性質上、必ず長方形の領域となります。例えば T 字型や L 字型のグリッド領域を作ることはできません。

例
-

次の例ではグリッドコンテナーに 2 つのグリッドアイテムを含み、これらに `grid-area` プロパティで名前を付け、グリッド上に `grid-template-areas` を使ってレイアウトしています。これによりグリッドセルと 4 つ含むものと、2 つ含むものの 2 つのグリッド領域ができます。
```

\* {
  box-sizing: border-box;
}

.wrapper {
  border: 2px solid #f76707;
  border-radius: 5px;
  background-color: #fff4e6;
}

.wrapper > div {
  border: 2px solid #ffa94d;
  border-radius: 5px;
  background-color: #ffd8a8;
  padding: 1em;
  color: #d9480f;
}
```

```css
.wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 100px 100px;
  grid-template-areas:
    "a a b"
    "a a b";
}
.item1 {
  grid-area: a;
}
.item2 {
  grid-area: b;
}
```

```html
<div class="wrapper">
  <div class="item1">Item</div>
  <div class="item2">Item</div>
</div>
```

関連情報
----

### プロパティリファレンス

* `grid-template-columns`
* `grid-template-rows`
* `grid-auto-rows`
* `grid-auto-columns`
* `grid-template-areas`
* `grid-area`
### 参考資料

* CSS グリッドレイアウトガイド: *グリッドレイアウトの基本概念*
* CSS グリッドレイアウトガイド: *グリッドテンプレート領域*
* Definition of Grid Areas in the CSS Grid Layout specification


Robots.txt - MDN Web Docs 用語集: ウェブ関連用語の定義

Robots.txt
==========

Robots.txt は通常、ウェブサイトのルートに配置されているファイルです。このファイルは、クローラー からウェブサイトへのアクセスを許可するか、禁止するかを決定します。

例えば、サイト管理者はクローラーが特定のフォルダー（とそこに含まれるすべてのファイル）にアクセスしたり、特定ファイルをクロールするのを禁止でき、通常はこれらのファイルが他の検索エンジンによってインデックスされることを防ぐために使われます。

詳細情報
----

### 一般的な知識

* Wikipedia 上の Robots.txt
* https://developers.google.com/search/reference/robots\_txt
* 標準ドラフト仕様: https://tools.ietf.org/html/draft-rep-wg-topic
* https://www.robotstxt.org/


Specification - MDN Web Docs 用語集: ウェブ関連用語の定義

Specification
=============

**specification** とは、製品を出荷する前にどのような機能や属性を含める必要があるかを詳しく説明したドキュメントです。 Web を説明する文脈において "specification" という用語 (多くの場合 "spec" と略される) は、一般にオープンな Web テクノロジーの完全なセットを構成する言語、技術、または API を説明するドキュメントを意味します。

関連項目
----

### 一般知識

* Wikipedia 上の 仕様
### 技術リファレンス

* Open Web platform specifications


Web standards (ウェブ標準) - MDN Web Docs 用語集: ウェブ関連用語の定義

Web standards (ウェブ標準)
=====================

ウェブ標準は国際標準化団体によって策定される、 ウェブ の仕組み (またときには インターネット を制御する方法) を定義する規則です。

 いくつかの標準化団体がウェブのさまざまな側面を定義する責任があり、すべての標準はウェブを最大限に利用可能でアクセス可能に保つために調整する必要があります。
 ウェブ標準は、現在の状況を改善し、新しい状況に適応するために進化しなければなりません。

次のリストはウェブサイトやネットワークシステムが準拠しなければならない標準の一部です:

* **IETF** (Internet Engineering Task Force): インターネット標準 (STD) であり、特に、URI、HTTP、MIME の設定と使用を管理しています。
* **W3C**: マークアップ言語 (HTMLなど) 、スタイル定義 (CSS)、 DOM、アクセシビリティ の仕様を策定しています。
* **IANA** (Internet Assigned Numbers Authority): 名前や番号の登記を管理しています。
* **Ecma インターナショナル:** 特に JavaScript 向けのスクリプティング標準の策定。
* **ISO** (International Organization for Standardization、国際標準化機構): 文字エンコーディング、ウェブサイトの管理、ユーザーインターフェイス設計などを含む、多種多様な標準を管理しています。
関連項目
----

### 一般知識

* Wikipedia の ウェブ標準


Dynamic typing (動的型付け) - MDN Web Docs 用語集: ウェブ関連用語の定義

Dynamic typing (動的型付け)
======================

**動的型付け言語**では、(JavaScript のように) インタプリターが実行時に、変数の値 に基づいて、変数 にデータ型 を割り当てます。

関連項目
----

### これについて学習する

* JavaScript のデータ型とデータ構造
### 一般知識

* Wikipedia の 型システム


Digest - MDN Web Docs 用語集: ウェブ関連用語の定義

Digest
======

ダイジェストはメッセージ全体からハッシュ関数によって生成された小さな値です。理想的にはダイジェストは即座に計算でき、不可逆であり、予測不可能なため、メッセージが改ざんされたかどうかの判定に利用することができます。

ダイジェストを使用して、下記のようないくつかのタスクを実行できます:

* 非暗号化アプリケーション（例えば、ハッシュテーブルのインデックス、重複データの検出やファイルの一意な識別に使用されるフィンガープリントなど）
* メッセージの整合性の検証（改ざんされたメッセージは異なるハッシュ値を持ちます）
* パスワードを解読されないようにしつつも、チェックできるように保存できます（これをより安全に行うためには、パスワードに salt を付与する必要もあります）。
* 擬似乱数の生成
* 暗号鍵の生成

衝突や予測可能性を避けるために、ユースケースに適したハッシュ関数を選択することが重要です。

関連項目
----

* ハッシュ関数
* Wikipedia の ハッシュ関数


Script-supporting element (スクリプト対応要素) - MDN Web Docs 用語集: ウェブ関連用語の定義

Script-supporting element (スクリプト対応要素)
=====================================

HTML 文書において、**スクリプト対応要素**はページの表示やレイアウトに直接貢献しない要素です。その代わり、スクリプト自体やスクリプトからのみ使用される情報を持っています。これらの要素は重要な場合もありますが、ページのスクリプトが正確に作用しなければ表示されているページに影響しません。

スクリプト対応要素は `<script>` 及び `<template>` の 2 つしかありません。

技術リファレンス
--------

詳しくは透過的コンテンツモデルを参照してください。


Syntax (構文) - MDN Web Docs 用語集: ウェブ関連用語の定義

Syntax (構文)
===========

構文は、正しく構造化されたコードを構成する文字の必要な組み合わせと順序を指定します。構文は一般に、文法とそれを書く上で適用される規則、例えば Python にはインデントの要件などを含みます。

構文は言語によって異なります (たとえば、HTML と JavaScript では構文が異なります)。しかし、例えば「オペランド 演算子 オペランド」の規則が JavaScript と python で共通であるように、構文の面では言語間でいくらかの類似点を持つことがあります。これは、 2 つの言語が構文を共有していることを意味するものではありません。

構文は、プログラミング言語 (コンピューターへの指示) とマークアップ言語 (文書構造情報) の両方に適用されます。

構文は順序と構造のみを管理します。命令は、意味論の領域で意味をもたなければなりません。

コードを正しくコンパイルするには、正しい構文を使用する必要があります。そうでない場合は、構文エラーが発生します。括弧が抜けているなどの小さなエラーなら、ソースコードのコンパイルを続けることができます。

フレームワークは、シンプルで読みやすく簡潔な結果を生成する場合、「クリーン」な構文を持つと言われています。コードベースで「たくさんの構文」が使用されている場合、同じ機能を実現するにはさらに多くの文字が必要です。

関連項目
----

### 一般知識

* Wikipedia 上の Syntax (プログラミング言語) （英語）


Jank - MDN Web Docs 用語集: ウェブ関連用語の定義

Jank
====

**Jank** は、メインスレッドで長いタスクを実行したり、レンダリングをブロックしたり、バックグラウンドプロセスでプロセッサパワーを浪費したりすることによって、ユーザーインターフェイスの低速化を引き起こすことを指します。


Clickjacking - MDN Web Docs 用語集: ウェブ関連用語の定義

Clickjacking
============

クリックジャッキングとは、ウェブサイトの利用者をだまして、悪意のあるリンクを無意識にクリックさせるインターフェイスベースの攻撃です。クリックジャッキングでは、攻撃者は、ウェブサイト内のボタンや正規のページに悪意のあるリンクを埋め込みます。攻撃が仕込まれたサイトでは、ユーザーが正規のリンクをクリックするたびに、攻撃者はそのユーザーの機密情報を取得し、最終的にインターネット上でのユーザーのプライバシーを侵害することになります。

クリックジャッキングは、Content Security Policy (frame-ancestors) の実装と、Set-Cookie 属性の実装により防ぐことができます。

さらに学ぶ
-----

* ウェブセキュリティ：クリックジャックからの保護
* Wikipedia 上の Clickjacking （英語）
* OWASP 上の Clickjacking （英語）


XHR (XMLHttpRequest) - MDN Web Docs 用語集: ウェブ関連用語の定義

XHR (XMLHttpRequest)
====================

`XMLHttpRequest` (XHR) とは AJAX リクエストを作成する JavaScript API です。これはブラウザー とサーバー との間のネットワークリクエストの送信を可能にするメソッドです。.

詳しく学習する
-------

### 一般知識

* Wikipedia での XMLHttpRequest
* Synchronous vs. Asynchronous Communications
### 技術リファレンス

* `XMLHttpRequest` オブジェクト
* XMLHttpRequest の使い方についての MDN ドキュメント


Transient activation (一時的な有効化) - MDN Web Docs 用語集: ウェブ関連用語の定義

Transient activation (一時的な有効化)
==============================

**一時的な有効化** (または「ユーザーによる一時的な有効化」) とは、ユーザーが最近ボタンを押したか､マウスを動かしたか､メニューを使用したか､他の何らかの操作をしたことを表すウインドウの状態です｡

 この状態は、ウェブ API がユーザーによる操作がきっかけの時にのみ機能するようにするための機構として利用されることがあります。
 例えば、スクリプトは *一時的な有効化* を必要とするポップアップを自由に出すことはできません。すなわち、UI 要素のイベントハンドラーをきっかけとして出す必要があります。

*一時的な有効化* を必要とする API の例は､ユーザーによる有効化によって制御される機能 を参照してください｡

プログラムから現在のウインドウの一時的な有効化の状態を参照するには､`UserActivation.isActive` プロパティを参照します｡

**メモ:** 一時的な有効化は (他の操作によって更新されなければ) タイムアウトによって無効になり､API によって「消費される」こともあります｡最初にセットされた後はリセットされないユーザーによる有効化は、粘着的な有効化を参照してください。

関連情報
----

* HTML Living Standard > Transient activation
* 粘着的な有効化
* `UserActivation.isActive`


DTLS (Datagram Transport Layer Security) - MDN Web Docs 用語集: ウェブ関連用語の定義

DTLS (Datagram Transport Layer Security)
========================================

**Datagram Transport Layer Security** (**DTLS**) とは、データグラムベースの通信を安全にするためのプロトコルです。ストリーム中心の Transport Layer Security (TLS) に基づいており、類似の水準のセキュリティーを提供します。一般的なデータグラムプロトコルと同様に、DTLSはメッセージが届く順番は愚か、メッセージが届くかどうかさえ保証しません。しかしながら、DTLSはデータグラムプロトコルの恩恵 ―― 特に低いオーバーヘッドや、レイテンシーの縮小 ――ももたらします。

こうした特徴は DTLS が活躍する最もありふれた領域、WebRTC において有用です。WebRTC に関連するすべてのプロトコルは DTLS で通信を暗号化することが求められています。これには SCTP (en-US)や SRTP (en-US)、 STUN も含まれます。

詳細情報
----

* Datagram Transport Layer Security (*Wikipedia*)
* 仕様:
    + RFC 9147: The Datagram Transport Layer Security (DTLS) Protocol Version 1.3
    + RFC 6347: Datagram Transport Layer Security Version 1.2
* 関連する仕様
    + RFC 5763: Framework for Establishing a Secure Real-time Transport Protocol (SRTP) Security Context Using DTLS
    + RFC 5764: DTLS Extension to Establish Keys for the Secure Real-time Transport Protocol (SRTP)
    + RFC 6083: DTLS for Stream Control Transmission Protocol (SCTP)
    + RFC 8261: Datagram Transport Layer Security (DTLS) Encapsulation of SCTP Packets
    + RFC 7350: Datagram Transport Layer Security (DTLS) as Transport for Session Traversal Utilities for NAT (STUN)
    + RFC 7925: TLS / DTLS Profiles for the Internet of Things


Unix time (UNIX 時間) - MDN Web Docs 用語集: ウェブ関連用語の定義

Unix time (UNIX 時間)
===================

UNIX 時間はタイムスタンプを表す方法の一つで、通常、 UNIX 元期の開始（1970 年 1 月 1 日午前 0 時 (UTC)）からの秒数で定義されます。うるう秒は無視されます。

ウェブプラットフォームでは、 UNIX 時間がタイムスタンプに使用され、 UNIX 元期の開始からのミリ秒数として与えられます。

関連情報
----

* UNIX 時間（ウィキペディア）
* うるう秒（ウィキペディア）


Advance measure - MDN Web Docs 用語集: ウェブ関連用語の定義

Advance measure
===============

**advance measure** は字体がとるすべての間隔で、記述方向（横書き・縦書き）によって水平方向または垂直方向の間隔を表します。カーソルがある文字の手前から背後までを進む距離と等しいです。

 この用語は幾つかの CSS の `<length>` の単位の定義で使われます。
 *advance measure* における単位 `ch` は文字 "0" の書体の幅または高さを表し、記述方向（横書き・縦書き）によります。同様に単位 `ic` は文字 "水" の書体の幅または高さを表します。

関連情報
----

* `<length>`


Netscape Navigator - MDN Web Docs 用語集: ウェブ関連用語の定義

Netscape Navigator
==================

Netscape Navigator または、単に Netscape は、1990 年代の主要なブラウザーでした。Netscape は Mosaic をベースにして作られており、開発チームは、Mosaic のコードを書いていたプログラマーである Marc Andreessen によって率いられていました。

Netscape のおかげで、ウェブはテキストのみの表現に留まらず、よりグラフィカルになりました。多くのブラウジング機能は、Netscape が導入したことによって標準化していきました。Netscape は読み込み中にウェブページを表示したり、JavaScript によってフォームやインタラクティブなコンテンツを可能にしたり、セッション情報を Cookie に保存したりすることを可能としました。しかし、ネットスケープの技術的優位性と初期の高いシェアにもかかわらず、1990 年代後半には、Internet Explorer によって急速に市場シェアを奪われました。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事 Netscape\_Navigator\_(ネットスケープコミュニケーションズ)


Progressive web apps (プログレッシブウェブアプリ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Progressive web apps (プログレッシブウェブアプリ)
====================================

プログレッシブウェブアプリは、ウェブアプリ開発の現代的な姿を表す用語です。これには検索エンジンによる見つけやすさ、URL を使用したリンク、複数の形式要素で動作することなど、ウェブのあらゆる優れた部分を活用した標準的なウェブサイト/アプリを利用し、最新の API (Service Workers や Push など) やネイティブアプリに由来するさまざまな利点をより一般的にもたらす機能を提供すること含みます。

これらの機能は、インストール可能で、オフラインで動作し、簡単に同期できてユーザーがサーバーに簡単に再接続できます。

詳細情報
----

* MDN 上の アプリセンター (en-US)
* Google Developers 上の Progressive web apps


Deserialization (デシリアライズ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Deserialization (デシリアライズ)
=========================

下位レベルのフォーマット（例えば、ネットワークを介して転送された、またはデータストアに格納された）が、読み取り可能なオブジェクトまたは他のデータ構造に変換されるプロセス。

たとえば、JavaScript では、`JSON.parse()` 関数を呼び出すことで、JSON 文字列をオブジェクトにデシリアライズすることができます。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の シリアライズ


XHTML - MDN Web Docs 用語集: ウェブ関連用語の定義

XHTML
=====

**XHTML** は、 HTML 文書のうち XML の構文規則に適合して書かれたものを指すために歴史的に使用されてきた用語です。

詳細情報
----

* XHTML


IMAP - MDN Web Docs 用語集: ウェブ関連用語の定義

IMAP
====

IMAP (Internet Message Access Protocol) は、電子メールの取得と保存に使用されるプロトコルです。 POP3 より新しい IMAP では、サーバー上のフォルダとルールが可能です。

POP3 とは異なり IMAP では、1 つのメールボックスへの複数同時接続が可能です。 メールボックスにアクセスするクライアントは、他のクライアントからの状態変更に関する情報を受け取ることができます。 IMAP はまた、クライアントが接続を維持し、必要に応じて情報を受け取るモードを提供します。

Mark Crispin は、1986 年に *Interim Mail Access Protocol* として IMAP を開発しました。 IMAP4 リビジョン 1 は、RFC 3501 で定義されている最新バージョンです。

より詳しく知る
-------

* RFC 3501
* POP3
* IMAP on Wikipedia


HPKP - MDN Web Docs 用語集: ウェブ関連用語の定義

HPKP
====

**HPKP** (HTTP 公開鍵ピンニング、 HTTP Public Key Pinning) は、偽造された証明書による MITM 攻撃のリスクを減らすために、特定の暗号化公開鍵を特定のウェブサーバーに関連付けるようにウェブクライアントに指示するセキュリティ機能です。

より詳しく知る
-------

* `Public-Key-Pins` (en-US)
* `Public-Key-Pins-Report-Only` (en-US)
* RFC 7469 （英語）
* Wikipedia 上の HTTP Public Key Pinning （英語）


Fetch directive (フェッチディレクティブ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Fetch directive (フェッチディレクティブ)
=============================

**CSP のフェッチディレクティブ**は `Content-Security-Policy` ヘッダーで使用され、特定のリソース種別の読み込み先を制御します。たとえば、 `script-src` では、開発者は信頼できるスクリプトのソースを許可してページ上で実行できるようし、 `font-src` では、ウェブフォントのソースを制御できます。

すべてのフェッチディレクティブは `default-src` で代替することができます。つまり、フェッチディレクティブが CSP ヘッダーにない場合、ユーザーエージェントは `default-src` ディレクティブを探します。

完全な一覧についてはフェッチディレクティブを参照してください。

関連情報
----

* 用語集
    + CSP
    + 報告ディレクティブ
    + 文書ディレクティブ
    + ナビゲーションディレクティブ
* リファレンス
    + https://www.w3.org/TR/CSP/#directives-fetch
    + `upgrade-insecure-requests`
    + `block-all-mixed-content`
    + `require-sri-for`
    非推奨
    + `Content-Security-Policy`


DTMF (Dual-Tone Multi-Frequency signaling) - MDN Web Docs 用語集: ウェブ関連用語の定義

DTMF (Dual-Tone Multi-Frequency signaling)
==========================================

**Dual-Tone Multi-Frequency** (**DTMF**) シグナリングは、キーパッド上で押されているボタンを表すために可聴音を使用するシステムです。 米国ではしばしば「タッチトーン」と呼ばれています（パルスダイヤルから DTMF への移行が開始されたときにタッチトーンの商標が使用されたので）。 DTMF は、数字 [0] 〜 [9] と、文字 [A] 〜 [D] と、記号 [#] と [\*] を送信することができます。 いくつかの電話のキーパッドは、電話網による制御シグナリングのために典型的に使用される文字を含みます。

コンピュータは、モデムにダイヤルするとき、または電話会議または他の目的のためにメニューシステムにコマンドを送信するときに、DTMF を利用することができます。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の DTMF
* Wikipedia 上の ダイヤルパルス


WebIDL - MDN Web Docs 用語集: ウェブ関連用語の定義

WebIDL
======

**WebIDL** は、ウェブアプリケーションプログラミングインターフェイス (API) を構成するデータ型、インターフェイス、メソッド、プロパティ、およびその他のコンポーネントを記述するために使用されるインターフェイス記述言語です。これは、特定のプログラミング言語に依存しないやや定式化された構文を使用しているため、API のコンポーネントを JavaScript 互換の構造にマップすることが可能な一方で、各 API を構築するために使用される基礎となるコードは、どの言語であっても最適に記述できます。

WebIDL はウェブのほぼすべての API 仕様で使用されており、その標準的な形式および構文のため、ウェブブラウザーを作成するプログラマーは、どのように API を実装するコードを書くかにかかわらず、ブラウザーが相互に互換性があることを容易に確認できます。

関連項目
----

### 技術情報

* Specification
* Information contained in a WebIDL file
* WebIDL bindings
* WebIDL (英語)


Gutter (溝) - MDN Web Docs 用語集: ウェブ関連用語の定義

Gutter (溝)
==========

**溝** (Gutters) もしくはアレーはコンテンツトラック間に空間を開けることです。CSS グリッドレイアウトで `column-gap`、`row-gap`、`gap` プロパティを使うと溝が作成されます。

例
-

下の例では 3 列 2 行のトラックを持つグリッドを、列トラックの間には 20 ピクセルの、列トラックの間には `20px` のすき間を空けています。
```

\* {
  box-sizing: border-box;
}

.wrapper {
  border: 2px solid #f76707;
  border-radius: 5px;
  background-color: #fff4e6;
}

.wrapper > div {
  border: 2px solid #ffa94d;
  border-radius: 5px;
  background-color: #fff8f8;
  padding: 1em;
  color: #d9480f;
}
```

```css
.wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1.2fr);
  grid-auto-rows: 45%;
  column-gap: 20px;
  row-gap: 20px;
}
```

```html
<div class="wrapper">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
  <div>Four</div>
  <div>Five</div>
</div>
```

グリッドのサイズ決定においては、溝によるすき間は通常のグリッドトラックのように扱われますが、すき間の中には何も配置できません。すき間の分だけその場所のグリッドラインのサイズが増えるように振る舞うため、そのラインの後のグリッドアイテムはすき間の後から始まるように配置されます。

トラックに余白を生じさせる原因は `row-gap` と `column-gap` プロパティだけではありません。マージン、パディング、ボックス配置の余白分配プロパティなどいずれも視覚上のすき間を作ります。したがって、追加の余白をこれらの方法で一切作らないデザインをしていない限り、 `row-gap` および `column-gap` プロパティと「溝サイズ」が一致するようには見えません。

関連情報
----

### プロパティリファレンス

* `column-gap`
* `row-gap`
* `gap`
### 参考情報

* CSS グリッドレイアウトガイド: *グリッドレイアウトの基本概念*
* CSS グリッドレイアウト仕様における溝の定義


Number - MDN Web Docs 用語集: ウェブ関連用語の定義

Number
======

JavaScript において、 **Number** は 倍精度64ビット浮動小数点形式 (IEEE 754) を持つ数値データ型です。その他のプログラミング言語では、それ以外の数値型もあります。たとえば、 Integer、Float、Double、Bignum などです。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事「データ型」
### 技術リファレンス

* JavaScript のデータ構造 : Number
* JavaScript のグローバルオブジェクト `Number`

* MDN 用語集
    + JavaScript
    + Primitive
* `Number`
* JavaScript データ型とデータ構造


W3C - MDN Web Docs 用語集: ウェブ関連用語の定義

W3C
===

*World Wide Web Consortium* (W3C) は、ウェブに関するルールや枠組みを整備する国際団体です。

W3C は 350 を超える加盟組織から成り、加盟組織は連帯してウェブ標準を開発し、ウェブの普及計画を遂行し、ウェブについて話し合うための開かれた場を整備しています。 W3C は業界の各企業に対して同じ W3C の標準を実装するよう働きかけています。

それぞれの標準は、草案 (Working Draft; WD)、勧告候補 (Candidate Recommendation; CR)、勧告案 (Proposed Recommendation; PR)、そして W3C 勧告 (W3C Recommendation; REC) の 4 つの段階を経て成熟していきます。

詳細情報
----

### 一般知識

* W3C のウェブサイト
* ウィキペディアの W3C の記事


Mobile First (モバイルファースト) - MDN Web Docs 用語集: ウェブ関連用語の定義

Mobile First (モバイルファースト)
========================

**モバイルファースト**は、ある種の プログレッシブエンハンスメントで、ウェブ開発やウェブデザインにおいて、モバイル画面サイズのデザイン・開発をデスクトップ画面サイズのデザイン・開発より優先して注力するアプローチです。 モバイルファーストアプローチの根拠は、すべての画面サイズにおいて良いユーザー体験を提供することです — はじめに小さい画面でうまく動作するユーザー体験を作成して、その次にその上に画面サイズが増えるごとにもっと豊かなユーザー体験を与えていきます。 モバイルファーストアプローチは、デスクトップ画面サイズをデザインしてからその後に小さい画面サイズを追加する、古いアプローチと対照をなします。


TURN - MDN Web Docs 用語集: ウェブ関連用語の定義

TURN
====

**TURN** (Traversal Using Relays around NAT) は、Network Address Translator (NAT) やファイアウォールの内側からコンピューターがデータを受信および送信できるようにする プロトコル です。TURN は WebRTC で使用され、インターネット上の任意の 2 つのデバイスがピアツーピア接続できるようにします。

関連情報
----

* TURN （ウィキペディア）
* WebRTC プロトコル
* 仕様
* IPv6 に関する仕様の更新


Response header (レスポンスヘッダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Response header (レスポンスヘッダー)
===========================

**レスポンスヘッダー**は、 HTTP レスポンスで使用できる HTTP ヘッダーで、メッセージの内容には関連しないものです。 `Age`, `Location`, `Server` のようなレスポンスヘッダーは、レスポンスのものより詳細な文脈を提供するために使用されます。

レスポンスに現れるすべてのヘッダーが仕様書で*レスポンスヘッダー*に分類されている訳ではありません。例えば `Content-Length` ヘッダーは*表現メタデータヘッダー*であり、レスポンスメッセージの本文の長さを表します (そして、古いバージョンの仕様書ではエンティティヘッダーでした)。しかし、これらのエンティティヘッダーもそのような場面ではレスポンスヘッダーと呼ばれることがよくあります。

以下に、 `GET` リクエストの後のレスポンスヘッダーをいくつか示します。なお、正確に言えば、 `Content-Encoding` 及び `Content-Type` ヘッダーはエンティティヘッダーです。
```

200 OK
Access-Control-Allow-Origin: *
Connection: Keep-Alive
Content-Encoding: gzip
Content-Type: text/html; charset=utf-8
Date: Mon, 18 Jul 2016 16:06:00 GMT
Etag: "c561c68d0ba92bbeb8b0f612a9199f722e3a621a"
Keep-Alive: timeout=5, max=997
Last-Modified: Mon, 18 Jul 2016 02:36:04 GMT
Server: Apache
Set-Cookie: mykey=myvalue; expires=Mon, 17-Jul-2017 16:06:00 GMT; Max-Age=31449600; Path=/; secure
Transfer-Encoding: chunked
Vary: Cookie, Accept-Encoding
X-Backend-Server: developer2.webapp.scl3.mozilla.com
X-Cache-Info: not cacheable; meta data too large
X-kuma-revision: 1085259
x-frame-options: DENY
```

1. Learn more
    1. すべての HTTP ヘッダーの一覧
2. 用語集
    1. エンティティヘッダー
    2. ヘッダー
    3. レスポンスヘッダー
        1. フェッチメタデータレスポンスヘッダー
    4. リクエストヘッダー


Selector (セレクター) (CSS) - MDN Web Docs 用語集: ウェブ関連用語の定義

Selector (セレクター) (CSS)
======================

**CSS セレクター**は CSS のルールの一部で、文書中のどの要素がルールと一致するかを記述します。一致した要素にはルールで指定されたスタイルが適用されます。

例
-

この CSS を見てください。

```css
p {
  color: green;
}

div.warning {
  width: 100%;
  border: 2px solid yellow;
  color: white;
  background-color: darkred;
  padding: 0.8em 0.8em 0.6em;
}

#customized {
  font:
    16px Lucida Grande,
    Arial,
    Helvetica,
    sans-serif;
}
```

ここでのセレクターは `"p"` （すべての `<p>` 要素内の文字列に緑色を適用）、 `"div.warning"` （`<div>` 要素でクラスが `"warning"` であるものがすべて警告ボックスのように見えるようにする）、 `"#customized"` （`"customized"` の ID を持つ要素の基本フォントを 16 ピクセルの高さの Lucida Grande またはいくつかの代替フォントに設定）です。

この CSS を次のような HTML に適用します。

```html
<p>This is happy text.</p>

<div class="warning">
  Be careful! There are wizards present, and they are quick to anger!
</div>

<div id="customized">
  <p>This is happy text.</p>

  <div class="warning">
    Be careful! There are wizards present, and they are quick to anger!
  </div>
</div>
```

結果的に、ページの内容は次のように整形されます。

関連情報
----

* CSS 入門内の CSS セレクターについての詳細
* 基本的なセレクター
    + 要素型セレクター `elementname`
    + クラスセレクター `.classname`
    + ID セレクター `#idname`
    + 全称セレクター `* ns|* *|*`
    + 属性セレクター `[attr=value]`
    + 状態セレクター `a:active, a:visited`
* グループ化セレクター
    + セレクターリスト `A, B`
* 結合子
    + 次兄弟結合子 `A + B`
    + 後続兄弟結合子 `A ~ B`
    + 子セレクター `A > B`
    + 子孫セレクター `A B`
* 擬似クラス・要素
    + 擬似クラス `:`
    + 擬似要素 `::`


ARPA - MDN Web Docs 用語集: ウェブ関連用語の定義

ARPA
====

**.arpa** (address and routing parameter area) はインターネットインフラ関連の目的で使われるトップレベルドメインです。特に DNS 逆引き(IPアドレスからドメイン名を調べること)のために使われます。

詳細情報
----

### 一般知識

* 公式サイト
* Wikipedia 記事 .arpa


Guard  (ガード) - MDN Web Docs 用語集: ウェブ関連用語の定義

Guard (ガード)
===========

ガードは、`Fetch 仕様`で定義されている `Headers` オブジェクトの機能で、`set()` や `append()` などのメソッドがヘッダーのコンテンツを変更できるかどうかに影響します。 例えば、`immutable`（不変）ガードは、ヘッダーを変更できないことを意味します。 詳しくは、Fetch の基本概念: ガードを参照してください。


Long task - MDN Web Docs 用語集: ウェブ関連用語の定義

Long task
=========

**long task** とは、完了するまでに 50 ミリ秒以上かかるタスクです。 main UI thread が 50 ミリ秒以上ビジーである中断のない期間です。一般的な例では、長時間実行されるイベントハンドラ、高価なリフロー、その他の再レンダリングが含まれ、50 ミリ秒を超えるイベントループの異なるターン間でブラウザーが実行する作業が含まれます。

関連項目
----

* Long task API


Presto - MDN Web Docs 用語集: ウェブ関連用語の定義

Presto
======

Presto は、バージョン 15 までの Opera browser を強化する為に使用された独自のブラウザーレイアウトエンジンでした。それ以降の Opera browser は、 Blink レイアウトエンジンを使用する Chromium をベースにしています。

関連項目
----

* Wikipedia 上の Presto layout engine


Router (ルーター) - MDN Web Docs 用語集: ウェブ関連用語の定義

Router (ルーター)
=============

ウェブでは**ルーター**には 3 つの定義があります。

1. ネットワーク層において、ルーターはデータパケットの方向を決めるネットワーク機器です。これらは、ユーザーがインターネットに接続できるように小売店で販売されています。
2. アプリケーション層の SPA においては、ルーターは指定された URL に対してどのようなウェブページを提供するかを決定するライブラリーです。このミドルウェアモジュールは、次のページを開くためにレンダリングされるファイルへのパスが与えられるため、すべての URL 関数に使用されます。
3. サービスレイヤーにおける API の実装では、ルーターは、リクエストを解析し、プログラム内のさまざまなハンドラーにリクエストを指示またはルーティングするソフトウェアコンポーネントです。ルーターのコードは通常、ハンドラーからのレスポンスを受け取り、そのレスポンスをリクエスト元に返すことを容易にします。
関連情報
----

ネットワーク層の文脈:

* ルーター (ウィキペディア)

アプリケーション層の SPA の文脈 (主要な SPA フレームワークのライブラリー):

* Angular router
* React router
* Vue router


Nullish value - MDN Web Docs 用語集: ウェブ関連用語の定義

Nullish value
=============

JavaScript では Nullish value は `null` または `undefined` のいずれかの値です。Nullish values は常に falsy です。


IRC - MDN Web Docs 用語集: ウェブ関連用語の定義

IRC
===

**IRC** (*Internet Relay Chat*) は、インターネット接続と IRC サーバーを介してメッセージを送受信する IRC クライアントを必要とする世界的なチャットシステムです。

1980 年代後半に Jarrko Oikarinen によって設計された IRC は、TCP を使用し、オープンプロトコルです。 IRC サーバーは、多数の IRC チャネル（各自が独自の ID を持つ）の 1 つに接続されているすべての人にメッセージをブロードキャストします。


CIA（Confidentiality, Integrity, Availability） - MDN Web Docs 用語集: ウェブ関連用語の定義

CIA（Confidentiality, Integrity, Availability）
=============================================

CIA（CIA トライアド、または AIC トライアドとも呼ばれます）は、秘匿性（Confidentiality）、完全性（Integrity）、可用性（Availability）からなり、情報セキュリティに関する組織の方針のガイドとなるモデルです。

関連項目
----

### 一般知識

* Wikipedia の 情報セキュリティの定義


LGPL - MDN Web Docs 用語集: ウェブ関連用語の定義

LGPL
====

LGPL (GNU Lesser General Public License) は、フリーソフトウェア財団が発行したフリーソフトウェアライセンスです。 LGPL は、厳密にコピーレフトされた GPL に対して、より許容された選択肢を提供します。 GPL ライセンスプログラムを使用する派生作品は、同じ条件（自由に使用、共有、研究、変更）で公開する必要がありますが、LGPL では、派生プログラムの LGPL ライセンスコンポーネントが LGPL を引き続き使用することを要求しますが、プログラム全体ではありません。 LGPL は、通常、ライブラリ（`.dll`、`.so`、`.jar` など）などの共有コンポーネントをライセンスするために使用されます。

より詳しく知る
-------

### 一般知識

* GNU LGPL on Wikipedia
* gnu.org の LGPL ライセンスのテキスト


Table Grid Box (表グリッドボックス) - MDN Web Docs 用語集: ウェブ関連用語の定義

Table Grid Box (表グリッドボックス)
==========================

**表グリッドボックス** (Table Grid Box) は、キャプションを除くすべての表の内部のブロックレベルボックスです。キャプションを含むボックスは表ラッパーボックスと呼ばれます。


Synthetic monitoring (合成モニタリング) - MDN Web Docs 用語集: ウェブ関連用語の定義

Synthetic monitoring (合成モニタリング)
===============================

**合成モニタリング**は、可能な限り一貫性のある環境で、通常は自動化ツールを使用して、「実験室」環境でページの性能をモニタリングすることです。一貫性のあるベースラインがあれば、合成モニタリングはコード変更が性能に及ぼす影響を測定するのに適しています。しかし、必ずしもユーザーが体験していることを反映しているとは限りません。

合成モニタリングでは、エンドユーザがウェブアプリケーションを介して進む経路をシミュレートするためのスクリプトを展開し、シミュレーターが体験した性能をレポートします。一般的な合成モニタリングツールの例としては、 WebPageTest や Lighthouse などがあります。測定されるトラフィックは、実際のユーザーのものではなく、ページの性能に関するデータを収集するために合成して生成されたトラフィックです。

RUM とは異なり、合成モニタリングはユーザーの違いを考慮せず、性能の狭い範囲のビューを提供するため、アプリケーションの性能に関する基本的なデータを取得したり、開発環境で性能をスポットチェックしたりするのに役立ちます。ネットワークスロットリングなどの他のツールと組み合わせることで、潜在的な問題領域についての優れた洞察を提供することができます。

関連情報
----

* 実ユーザーモニタリング (RUM) (en-US)
* 実ユーザーモニタリング (RUM) と合成モニタリング (en-US)
* ビーコン


ATAG - MDN Web Docs 用語集: ウェブ関連用語の定義

ATAG
====

ATAG (Authoring Tool Accessibility Guidelines の略、オーサリング・ツール・アクセシビリティ・ガイドライン) は 利用しやすいコンテンツを生産する、アクセシブル・オーサリングツールをビルドするための W3C 勧告です。

関連項目
----

### 一般知識

* Wikipedia 上の Web Accessibility Initiative 記事内の ATAG
### 技術リファレンス

* Authoring Tool Accessibility Guidelines (ATAG) Overview
* The ATAG 2.0 recommendation


XSLT - MDN Web Docs 用語集: ウェブ関連用語の定義

XSLT
====

*eXtensible Stylesheet Language Transformations* (**XSLT**) は、XML 文書を他の XML 文書に変換するために使用される宣言的言語であり、HTML、PDF、プレーンテキストなどが含まれます。

XSLT には XML 入力、または XQuery および XPath データモデルに変換可能な任意のフォーマットを受け入れる独自のプロセッサーがあります。XSLT プロセッサは XML ドキュメントと XSLT スタイルシートに基づいて新しいドキュメントを作成し、プロセス内の元のファイルに変更を加えません。

関連情報
----

* ウィキペディアの「XSLT」
* MDN の XSLT のドキュメント


Character set (文字コード) - MDN Web Docs 用語集: ウェブ関連用語の定義

Character set (文字コード)
=====================

**文字コード**は、コンピューターに文字 (文字、数字、区切り記号、空白文字などを含む) を理解させるための符号化システムです。

各国では個別の言語が使用されているため、日本語の漢字 JIS コード (例えば Shift-JIS, EUC-JP など)、繁体字中国語の Big5、ロシア語の KOI8-R などのように独自の文字コードを開発しました。しかし、全世界の言語に対応するために、次第に Unicode が最も利用される文字コードになりました。

文字コードが誤って使用すると (例えば、Big5 でエンコードされた記事に Unicode を使用すると)、壊れた文字ばかりが表示されることがあり、これは文字化けと呼ばれます。

1. Wikipedia の記事
    1. 文字コード
    2. 文字化け
2. 用語集
    1. 文字
    2. Unicode


Null - MDN Web Docs 用語集: ウェブ関連用語の定義

Null
====

コンピュータサイエンス分野において、一般的に **`null`** という値は、存在しないまたは無効なオブジェクトやアドレスへのポインター参照を表します。 null による参照が持つ意味は、言語実装によって様々です。

JavaScript では、 `null` は動作がプリミティブらしく見えるので、プリミティブ値の一つであるとされています。

しかし、場合によっては、 `null` はそれらしく見えても「プリミティブ」ではありません。あらゆるオブジェクトが `null` 値から派生しており、そのため `typeof` で検査すると `object` が返るという一面もあります。

```js
typeof null === "object"; // true
```

* **用語集**
    + JavaScript
    + 文字列
    + number
    + bigint
    + boolean
    + null
    + undefined
    + symbol
* JavaScript のデータ型
* JavaScript のグローバルオブジェクト: `null`
* Wikipedia 上の記事「Null」


Shim (シム) - MDN Web Docs 用語集: ウェブ関連用語の定義

Shim (シム)
=========

**シム** (shim) とは、すでに存在するコードの動作を修正するために使用されるコードの一部で、通常は問題を回避する新しいAPIを追加することで動作します。古いブラウザーにサポートされていない新しい API を実装するポリフィルとは異なります。

関連情報
----

* ウィキペディア(英) Shim


Endianness (エンディアン) - MDN Web Docs 用語集: ウェブ関連用語の定義

Endianness (エンディアン)
===================

**エンディアン** (もしくは**バイト順**) は、コンピューターが数字を表現するために各バイトを構成する方法を説明するものです。

メモリの個々の領域にはインデックス、もしくはアドレスが付与されています。各バイトには 8 ビット (つまり `0x00` から `0xff` まで) の数値しか保存できないため、それ以上大きな値を保存するには 1 バイトよりも大きな領域を予約しなければなりません。1 つの数値における複数のバイトの*順序*で断然最もよく使われているものは**リトルエンディアン**で、インテルのすべてのプロセッサーで使用されています。リトルエンディアンは小さいバイトから大きいバイトの順で (つまり、もっとも小さなバイトを最初または最下位のアドレスに) 格納するので、ちょうどヨーロッパの日付の書き方 (例えば 31 December 2050) と同様です。

当然、**ビッグエンディアン**は逆の順序で、 ISO 日付形式 (2050-12-31) と同様です。ビッグエンディアンはよく「ネットワークバイトオーダー」と呼ばれますが、これはインターネット標準では通常、標準 UNIX ソケットレベルからウェブバイナリデータ構造に至るまですべて、データをビッグエンディアンで格納することを要求しているためです。また、 68000 系や PowerPC のマイクロプロセッサーを使用した古い Mac では、ビッグエンディアンを使用していました。

例えば `0x12345678` (十進法では 305 419 896) は、それぞれ次のように表現されます

* *リトルエンディアン*: `0x78 0x56 0x34 0x12`
* *ビッグエンディアン*: `0x12 0x34 0x56 0x78`
* *ミックスドエンディアン* (古く非常に稀): `0x34 0x12 0x78 0x56`

1. 関連情報
    1. `ArrayBuffer`
    2. `DataView`
    3. 型付き配列
2. Wikipedia 記事
    1. エンディアン
3. 用語集
    1. データ構造


SISD - MDN Web Docs 用語集: ウェブ関連用語の定義

SISD
====

SISD はコンピュータ・アーキテクチャの分類（フリンの分類）の一つである **Single Instruction/SIngle Data** （単一命令/単一データ）を略したものです。SISD アーキテクチャでは単一のプロセッサが単一の命令を実行し、メモリ内の単一データ列を演算します。

1 回の演算で多重データ列を処理可能な並列アーキテクチャの SIMD についても参照ください。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事 「SISD」


Block-level content (ブロックレベルコンテンツ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Block-level content (ブロックレベルコンテンツ)
==================================

CSS において、ブロックレイアウトに関係するコンテンツは**ブロックレベルコンテンツ**と呼ばれます。

ブロックレイアウトでは、ボックスは次々と垂直に、包含ブロックの上からレイアウトされます。各ボックスの左の外辺は、格納するブロックの左の辺に接します。ブロックレベル要素は常に新しい行から始まります。英語やアラビア語のような横書きでは、親要素（コンテナー）の水平空間全体と、コンテンツを含む高さに等しい垂直空間を占めるため、「ブロック」を作成することになります。

**メモ:** 上記のブロックレイアウトの動作は、包含ブロックの書字方向 (`writing-mode`) が既定値と異なる場合には変わります。

**メモ:** HTML (*HyperText Markup Language*) の要素は従来、「ブロックレベル」要素または「インライン要素」の何れかに分類されてきました。これは表示特性であることから、現在は CSS において定義されています。

例
-

この例では、2 つの段落 (`<p>`) 要素が `<div>` の中に収められています。

```html
<div>
  <p>
    これは最初の段落です。これらの段落の背景色は、親要素と区別できるよう色付けされています。
  </p>
  <p>これが 2 番目の段落です。</p>
</div>
```

段落 (`<p>`) 要素は既定ではブロックレベルです。このためブロックレイアウトで表示されます。
```

p {
  background-color: #8abb55;
}
```

関連情報
----

* インラインレベルコンテンツ
* ブロック整形コンテキスト
* `display`
* `writing-mode`


Visual Viewport (視覚的ビューポート) - MDN Web Docs 用語集: ウェブ関連用語の定義

Visual Viewport (視覚的ビューポート)
===========================

ビューポート のうち、現在表示されている部分は視覚的ビューポートと呼ばれています。これは、ユーザーがピンチ操作で拡大をした場合などに、レイアウトビューポートよりも小さくなることがあります。視覚的ビューポートは画面の視覚的な部分であり、これは画面上のキーボード、ピンチ操作で拡大したことにより画面外に出た領域、その他のページの寸法に合わせて拡大縮小されない画面上の部分を除いたものです。

詳細情報
----

### 一般知識

* Visual Viewport API (en-US)
* Viewport (Wikipedia)
* A tale of two viewports (Quirksmode)
* ビューポート (MDN 用語集)
* レイアウトビューポート (en-US) (MDN 用語集)


Media - MDN Web Docs 用語集: ウェブ関連用語の定義

Media
=====

**メディア**という用語は、ウェブについて話すときに複数の意味で使われます。これは文脈によって異なる意味を取ります。

Media (CSS)
CSS (Cascading Style Sheets) の文脈において、***メディア***という用語はrendering engineによって描画される文書の出力先を参照します。これはふつうは端末の画面ですが、プリンターや読み上げ装置、点字ディスプレイ、あるいはそのほかの装置の可能性もあります。
関連情報
----

* Wikipedia 上のメディア


ISO (国際標準化機構) - MDN Web Docs 用語集: ウェブ関連用語の定義

ISO (国際標準化機構)
=============

**ISO**（International Organization for Standardization、国際標準化機構）は、各主要産業の企業を調整する統一基準を開発する世界的な協会です。

より詳しく知る
-------

### 一般知識

* 公式ウェブサイト
* Wikipedia 上の 国際標準化機構


Safe (安全) - MDN Web Docs 用語集: ウェブ関連用語の定義

Safe (安全)
=========

**安全**という用語は、文脈によって意味が異なることがあります。以下の可能性があります。

Safe (安全) (HTTP メソッド)
HTTP メソッドが**安全**であるとは、その HTTP メソッドがサーバーの状態を変更しないということです。言い換えれば、読み取り専用操作につながる場合、メソッドは安全です。一般的な HTTP メソッドのうちでは `GET`, `HEAD`, `OPTIONS` が安全です。安全な HTTP メソッドはすべてidempotentでもあります。しかし、すべてのべき等なメソッドが安全とは限りません。例えば、 `PUT` や `DELETE` はべき等ですが、安全ではありません。


Encryption (暗号化) - MDN Web Docs 用語集: ウェブ関連用語の定義

Encryption (暗号化)
================

暗号学 において**暗号化**とは、 平文を暗号文に変換することを意味します。暗号文とは、認証されていない読み手にとって解読不能な文章のことです。

暗号化は、暗号プリミティブ ( サイファーと呼ばれる暗号化アルゴリズムを用いて、平文を暗号文へと変換する方法) です。現代的なサイファーによる暗号化は、特定の暗号化アルゴリズムと、暗号鍵と呼ばれる秘密の値を用いて行われます。アルゴリズムはだいたい公開されるので、暗号化が安全なままであれば、暗号鍵は秘密のままにしておかなければなりません。

![How encryption works.](/ja/docs/Glossary/Encryption/encryption.png)

秘密の値が知られない限り、暗号化の逆操作である復号を行うことは数学的に困難です。どれほど困難になるかは、選択した暗号化アルゴリズムと暗号解析法の進歩に依存します。


Main Axis (主軸) - MDN Web Docs 用語集: ウェブ関連用語の定義

Main Axis (主軸)
==============

flexbox における主軸は、`flex-direction` プロパティの設定方向によって定義されます。`flex-direction` が取り得る値は以下の 4 つです。

* `row`
* `row-reverse`
* `column`
* `column-reverse`

`row` または `row-reverse` を選んだ場合は、主軸はインライン要素の並ぶ方向に伸びる軸となります。

![flex-direction が row の場合の主軸](/ja/docs/Glossary/Main_Axis/basics1.png)

`column` または `column-reverse` を選んだ場合は、ページの上から下に向かってブロック要素の並ぶ方向に伸びる軸となります。

![](/ja/docs/Glossary/Main_Axis/basics2.png)

アイテムの `flex` プロパティを使って、フレックスアイテム自体が使える幅を指定することで、主軸に沿ったサイズを制御することができます。また、アイテム間そしてアイテムの周囲の空間については、`justify-content` プロパティを使って制御することができます。

関連情報
----

### プロパティリファレンス

* `flex-basis`
* `flex-direction`
* `flex-grow`
* `flex-shrink`
* `justify-content`
* `flex`
### 参考文献

* CSS フレックスボックスガイド: *フレックスボックスの基本概念*
* CSS フレックスボックスガイド: *フレックスコンテナー内のアイテムの配置*
* CSS フレックスボックスガイド: *主軸方向のフレックスアイテムの比率の制御*


Texel (テクセル) - MDN Web Docs 用語集: ウェブ関連用語の定義

Texel (テクセル)
============

3D グラフィックにおいて、**テクセル** (texel) はテクスチャ内の 1 ピクセルのことです。テクスチャは、 3D レンダリング画像内のポリゴンの表面に表示される画像です。テクスチャは、テクセルの集まりによって特徴付けられます。これは、画像がピクセルの集まりによって特徴付けられるのと似ています。

ラスター画像ファイルのピクセルは、カラーデータ、場合によっては不透明度データを含む一連のビットで、コンピュータのモニターなどの出力デバイス上の表示ピクセルにマッピングされます。ピクセルがテクスチャリソースとして使用される画像に属する場合、それは「テクスチャピクセル」と呼ばれ、「テクセル」と短縮されます。テクセルデータは、画面のピクセルに直接マッピングされるのではなく、モデル化される 3D オブジェクトの座標空間の位置にマッピングされます。テクスチャは、色や、深さや反射率などの表面の性質を伝えるために使用することができます。複数のテクスチャを重ねて、複雑な表面のオーバーレイを作成することもできます。

適切なテクセルをポリゴン上の対応する点にマッピングするプロセスは、**テクスチャマッピング**と呼ばれます。テクスチャマッピングは、ディスプレイ用に 3D 画像をレンダリングするプロセスの一段階です。入力元と出力先のピクセルグリッドが揃っていない場合、さらに**テクスチャフィルタリング**を適用して、テクスチャマッピングされたピクセルを滑らかにします（テクスチャのマグニフィケーションまたはミニフィケーション）。レンダリングプロセスの最終的な出力は、 3D モデルの平坦化された 2D 投影で、テクスチャはモデルに「ラップ」されます。

レンダリングのパイプラインでは、テクスチャマッピングは通常、シーンを照明する前に行われますが、 WebGL では、照明はテクスチャマッピング処理の一部として実行されます。

関連情報
----

* テクセル （ウィキペディア）
* テクスチャマッピング （ウィキペディア）
* テクスチャフィルタリング （ウィキペディア）
* WebGL でのテクスチャの使用
* WebGL でのライティング
* WebGL におけるテクスチャのアニメーション


Cipher (サイファー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Cipher (サイファー)
==============

暗号学では、**サイファー**は平文を暗号化して読めなくし、それを復号するアルゴリズムです。

サイファーは、情報化時代のかなり前から一般的でしたが（例えば、換字式暗号、転置式暗号）、それらはワンタイムパッドを除いて、どれも暗号的に安全ではありませんでした。

現代のサイファーは、暗号解読者が発見した攻撃 に耐えるように設計されています。すべての攻撃方法が検出されたという保証はありませんが、各アルゴリズムは既知の種類の攻撃に対して判断されます。

サイファーは、データの連続したブロックまたはバッファのブロック暗号と、連続的なデータフロー（多くの場合、音声または動画）のストリーム暗号の 2 つの方法で動作します。

それらはまた、暗号鍵がどのように扱われるかによって分類されています。

* 共通鍵暗号は、メッセージの暗号化と復号に同じ鍵を使用します。メッセージを秘密のままにする場合は、鍵を安全に送信する必要があります。
* 公開鍵暗号は、暗号化と復号に異なる鍵を使用します。

1. 一般知識
    1. Wikipedia 上の Cipher (英語)
    2. Wikipedia 上の 暗号
    3. 暗号化と復号
2. MDN Web Docs 用語集
    1. 暗号利用モード
    2. サイファー
    3. 暗号文
    4. 暗号スイート
    5. 暗号解読
    6. 暗号学
    7. 復号
    8. 暗号化
    9. 暗号鍵
    10. 平文
    11. 公開鍵暗号
    12. 共通鍵暗号


Grid Axis (グリッド軸) - MDN Web Docs 用語集: ウェブ関連用語の定義

Grid Axis (グリッド軸)
=================

CSS グリッドレイアウトはコンテンツを**行**と**列**でレイアウトできるようにする 2 次元レイアウトです。したがって、すべてのグリッドには、**ブロックもしくは列の軸**と、**インラインもしくは行の列**という、 2 つの軸があります。

各アイテムはこれら 2 つの軸に沿って、ボックス配置仕様書で定義されているプロパティを使って配置されます。

CSS では、ブロックもしくは行の軸がテキストのブロックをレイアウトするのに使用する軸となります。右から左、上から下に書く言語で 2 つの段落があるばあい、ブロック軸に沿って一方が他方の下にレイアウトされます。

![CSS グリッドレイアウトのブロック軸を示す図。](/ja/docs/Glossary/Grid_Axis/7_block_axis.png)

インラインもしくは行の軸はブロック軸と交差し、通常のテキストが流れる方向沿った軸です。 CSS グリッドレイアウトでは次のような行の軸となります。

![CSSグリッドレイアウトのインライン軸を示す図。](/ja/docs/Glossary/Grid_Axis/7_inline_axis.png)

これらの軸の物理的な方向は文書の書字方向によって変更可能です。

関連情報
----

* CSS グリッドレイアウトガイド: *グリッドレイアウトの基本概念*
* CSS グリッドレイアウトガイド: *グリッドレイアウトのボックス配置*
* CSS グリッドレイアウトガイド: *グリッド、論理的な値、書字方向*


JSON - MDN Web Docs 用語集: ウェブ関連用語の定義

JSON
====

*JavaScript Object Notation* (**JSON**) はデータ交換フォーマットです。厳密なサブセットではありませんが、JSON は JavaScript のサブセットに似ています。多くのプログラミング言語が JSON をサポートしていますが、JSON はウェブサイトやブラウザの拡張機能を含む JavaScript ベースのアプリケーションに特に便利です。

JSON は数値、真偽値、文字列、`null`、配列 (順序付けられた値のシーケンス)、およびこれらの値 (または他の配列やオブジェクト) で構成されるオブジェクト (文字列値マッピング) を表すことができます。 JSON は関数、正規表現、日付などのより複雑なデータ型はネイティブに表現できません。(Date オブジェクトはデフォルトで ISO 形式の日付を含む文字列にシリアライズされるため、情報は完全に失われません。) JSON で追加のデータ型を表す必要がある場合は、シリアライズされる時やデシリアライズされる前に値の変換を行ってください。

JSON は伝統的な CSV 形式とは異なり、XML のような階層データを格納することができます。多くのツールが、オンライン上の JSON to CSV Converter や他の JSON to CSV Converter のように、これらのフォーマット間の変換する機能を提供しています。

関連項目
----

### 一般知識

* Wikipedia の JSON の記事
### 技術リファレンス

* MDN の JSON


XML - MDN Web Docs 用語集: ウェブ関連用語の定義

XML
===

eXtensible Markup Language (XML) は W3C によって規定された汎用マークアップ言語です。情報技術 (IT) 産業では、データ記述言語として多くの XML を基にした言語を使用しています。

XML タグは HTML タグに似ていますが、XML はユーザーが独自のタグを定義することができるため、はるかに柔軟です。このようにして XML はメタ言語のように振る舞う――すなわち RSS のような他の言語を定義することができるのです。それに加えて、HTML はプレゼンテーション言語であるのに対し、XML はデータ記述言語です。つまり、XML には ウェブだけにとどまらないとても広い応用範囲があるということを意味します。例として、ウェブサービスは XML をリクエストとレスポンスの交換に使用することができます。

関連項目
----

* XML のイントロダクション


Viewport (ビューポート) - MDN Web Docs 用語集: ウェブ関連用語の定義

Viewport (ビューポート)
=================

ビューポートは、現在表示されているコンピューター画像の中の、多角形 (通常は長方形) の領域を表します。ウェブブラウザーの用語としては、閲覧中の文書のうち、ウィンドウ (または、文書が全画面モードで表示されている場合は画面) の中で現在見えている部分を指します。ビューポートの外にあるコンテンツは、スクロールによってビューの中に移動するまで画面上では見えません。

ビューポートの中で現在見えている部分を\*\*視覚的ビューポート\*\*と呼んでいます。これは、ユーザーがピンチ操作により拡大縮小しているときなど、レイアウトビューポートより小さくなることがあります。レイアウトビューポート (en-US)は変わりませんが、視覚的ビューポートはより小さくなります。

詳細情報
----

### 一般知識

* Visual Viewport API (en-US)
* Viewport (Wikipedia)
* A tale of two viewports (Quirksmode)
* 視覚的ビューポート (MDN 用語集)
* レイアウトビューポート (en-US) (MDN 用語集)


CMS - MDN Web Docs 用語集: ウェブ関連用語の定義

CMS
===

CMS (Content Management System, コンテンツ管理システム) とは、ユーザーに色々な種類のコンテンツ (テキストだけでなく組み込み画像、動画、音声、インタラクティブなコードも) の発行、編集、変更、削除ができるようにするソフトウェアです。

詳細情報
----

### 一般知識

* Wikipedia の コンテンツ管理システム


Grid Column (グリッド列) - MDN Web Docs 用語集: ウェブ関連用語の定義

Grid Column (グリッド列)
===================

**グリッド列**とは CSS グリッドレイアウトにおける縦のトラックであり、二つの垂直方向のグリッド線に挟まれた領域のことです。グリッド列は `grid-template-columns` プロパティまたは一括指定の `grid` や `grid-template` プロパティで定義されます。

加えて、明示的グリッド *(explicit grid)* で作られる列の外にアイテムが配置される場合は、暗黙的グリッド *(implicit grid)* にもグリッド列が作られます。これらの列はデフォルトでは自動的に大きさが決定されますが、`grid-auto-columns` プロパティでサイズ指定することもできます。

CSS グリッドレイアウトの中で位置調整 (alignment) をする場合、列が並ぶ軸を *ブロック軸もしくは列軸* と呼びます。

関連情報
----

### プロパティリファレンス

* `grid-template-columns`
* `grid-auto-columns`
* `grid`
* `grid-template`
### 参考情報

* CSS グリッドレイアウトガイド: *グリッドレイアウトの基本概念*