Link
関連
種別
Entity
概要
リソース間の関連を示すために使用。HTMLの<link>タグと同等の機能をする。
slug
infographicIT/http/headers/link
Linkヘッダの概要
Linkヘッダは、HTTPレスポンスにおいてリソース間の関連を示すために使用されるHTTPヘッダ。このヘッダを使用することで、ウェブページやウェブアプリケーションが関連するリソース（CSS、JavaScript、画像など）を効率的にロードできるようになる。
また、ページ間の関連性（前のページ、次のページなど）を示すこともできる。
Linkヘッダの設定方法
一般的なLinkヘッダでCSS「/styles/main.css」とJavaScript「/scripts/main.js」を指定する例は以下の通り。URI、パスは<>で囲う必要がある。
Plain Text
| 設定値 | 概要 |
|---|---|
| rel | リソースとの関連性を示す。例えば、rel=stylesheetはスタイルシートリソースを示し、rel=preloadはリソースのプリロードを示す。 |
| as | リソースのタイプを指定する。例えば、as=scriptはスクリプトリソースを示す。 |
| crossorigin | リソースの取得にCORS（Cross-Origin Resource Sharing）ポリシーを適用するかどうかを示す。 |
Linkヘッダの効果
Linkヘッダを使用することで、以下のような効果が期待できる。
- リソースの効率的なロード Linkヘッダを使用することで、ブラウザは関連するリソースを効率的にロードできる。これにより、ページの表示速度が向上することがある。
- ページ間の関連性の表現 Linkヘッダを使用して、ページ間の関連性（前のページ、次のページなど）を示すことができる。これにより、ウェブページのナビゲーションが容易になり、ユーザー体験が向上する。
- リソースのプリロード 「rel=preload」ディレクティブを使用することで、ブラウザはページの表示に必要なリソースを事前にロードできる。これにより、ページの表示速度が向上し、ユーザー体験が改善される。
- ウェブアプリケーションのパフォーマンス向上 Linkヘッダを適切に設定することで、ウェブアプリケーションのパフォーマンスが向上する。これは、リソースの効率的なロードやプリロードにより、クライアント側での処理時間が短縮されるためである。