URLの一般的なルール
この記事ではURLについて一般的なルール・形式を紹介します。
※一般的なWebサイトに利用される事項にフォーカスしつつ
ITの専門知識がなくても理解のしやすいように
本来のURLの仕様としては厳密でない表現をしている部分もあります。
URLの概要
まずURLは大まかに以下のような構成となっています。
https://blog-tips.sekenkodqx.jp/abc/index.html?id=aa&measure=1234#top
| 文字色 | 説明 |
|---|---|
| 赤 | URLの先頭はプロトコル（通信方法）を指定します。 Webアクセスでは「http://」か「https://」で始まります。 （他もありますが、一般的なWebアクセスでは出てきません） 「https://」はSSL/TLSで暗号化された通信で、そうでない通信が「http://」です。 指定必須ですが、ブラウザによっては省略した場合に自動で補完される場合がありますが、 補完は当てにせず、記載したほうがよいです。 |
| 青 | Webサーバの位置を示すドメイン名を指定します。 ドメインの最後に「:ポート番号の数字」を指定するケースもありますが 一般公開するサイトではレアです。（黄色マーカー部分は数字に変わります） ここまではURLとして必須です。 |
| 緑 | Webサーバの中での位置です。「/」区切りでディレクトリとフォルダを示します。 Webシステムによってはここがパラメータの場合も存在します。 基本的には必須ですが、「index.html」などは省略されることもあります。 （Webサーバの設定に依存） |
| 橙 | Webシステムに与えるパラメータです。 Google アナリティクスなどの計測システムのパラメータや、ECシステムで表示する商品のコードを指定するケースが多いです。 このパラメータは「?」で始まります。 URLが終わるか「#」が登場するまでがパラメータです。 「?」はURL中に1つだけしか登場しません。 詳細は別途、後述します。 |
| 紫 | 「#」はアンカー指定（ページ内リンクの位置指定）です。 指定内容はサイト作成者次第ですが「#top」、「#head」、 WordPressの見出し位置などが一般的です。 アンカー指定はURLに最後に一度しか登場しません。 また「#」はYahooのコンバージョン計測などで発生する場合があります。 |
パラメータについて
「?」より後ろでURLが終わるか「#」が登場するまでの部分がパラメータです。
基本形式
「?」はURL中に1つだけしか登場しません。
パラメータは「パラメータ名=値」の形式です。（赤字部分はURLによって変わります）
パラメータが複数ある場合は「&」で区切ります。
この「&」と「=」は、この用途以外では登場しない特殊文字です。
なお同一のパラメータ名は複数発生しません。
（発生した場合、どのように動作するかがシステム次第で不明のため控えた方が無難です）
値のエンコード
値の中には日本語やエスケープ文字（:&?/%#などURL上で特殊な意味を持つ文字）は発生しません。
これらの文字はURLエンコード（パーセントコーディング）する必要があり、
値に指定する文字列は基本的にURLエンコードしたほうが無難です。
（しないと意図したとおりに動かない可能性あり）
エンコードは手動で行うのは難しいため変換ツールか
ExcelのENCODEURL関数を利用しましょう。
なおエンコードはブラウザで勝手に翻訳してくれる場合がありますが頼らない方が無難です。
種類：アクティブとパッシブ（ダミー）
パラメータにはアクティブパラメータとパッシブパラメータ（ダミーパラメータとも）があります。
どちらもルールは同じですが用途が異なります。
| パラメータの種類 | 説明 |
|---|---|
| アクティブ | パラメータによりページの表示内容が変わるパラメータです。 商品番号などを指定する（ECサイトなどに多数）場合や、 背景色などを指定する場合もあります。 |
| パッシブ（ダミー） | パラメータによりページの表示内容が変わらないパラメータです。 主にアクセス計測用でGoogleアナリティクスのutm_sourceが代表例です。 |