URLエンコードとは
Webアドレスに使える文字はごく一部に限られています。アルファベット、数字、そして -、.、_、~ などの少数の記号です。それ以外の文字には特別な役割があります。? はクエリ文字列の始まり、& はパラメータの区切り、= は名前と値をつなぎ、# はフラグメントの始まりを表します。スペースや、日本語のような英語以外の文字はそもそも使えません。
この問題を解決するのが、パーセントエンコードとも呼ばれる URLエンコードです。使えない文字はそれぞれ UTF-8 のバイトに変換され、各バイトが % と2桁の16進数で書き表されます。スペースは %20、& は %26、é は %C3%A9 になります。日本語の場合、たとえば 日本語 は %E6%97%A5%E6%9C%AC%E8%AA%9E になります。日本語のページ名や検索語を含むURLをコピーしたときに、長い % の並びになるのはこのためです。
URLエンコーダーの使い方
エンコードする。 「プレーンテキスト」欄にテキストを入力するか貼り付けます。エンコードされた結果が「URLエンコード済み」欄に表示されます。「コピー」を押すと取り出せます。
デコードする。 エンコードされたテキストを「URLエンコード済み」欄に貼り付けます。左側に読める文字が表示されます。
何をエンコードするかは、欄の下にあるメニューで選びます。
- 値、またはURLの一部（encodeURIComponent）：ほとんどの場合はこれが正解です。アルファベット、数字、
- _ . ~以外をすべてエンコードします。検索語、パラメータの値、パスの一部に使います。 - URL全体、: / ? & = を残す（encodeURI）：アドレスの構造はそのままにして、スペース、英語以外の文字などだけをエンコードします。
- フォームデータ、スペースを + に（x-www-form-urlencoded）：HTMLフォームを送信したときにブラウザが送る形式と同じです。スペースは
+になり、デコード時には+がスペースに戻ります。
「クリア」を押すと両方の欄が空になります。
仕組み
テキストはまず UTF-8 のバイトに変換されます。使えないバイトは、% とその値の16進数に置き換えられます。é は UTF-8 で2バイトなので、%C3%A9 の2つのエスケープになります。ひらがなや漢字は1文字3バイトなので3つ、絵文字は4バイトなので4つのエスケープになります。
値モードでは、このツールはブラウザ標準の関数より一歩踏み込んだ処理をします。RFC 3986 に従い、! ' ( ) * もエンコードします。これらの文字は仕様上は使えますが、一部のサーバーやメールソフトで問題を起こしてきたためです。
デコードはその逆です。連続する %XX をまとめてバイトに戻し、UTF-8 として読み取ります。
変換例
| 入力 | 値（Component） | URL全体 | フォームデータ |
|---|---|---|---|
hello world |
hello%20world |
hello%20world |
hello+world |
Tom & Jerry |
Tom%20%26%20Jerry |
Tom%20&%20Jerry |
Tom+%26+Jerry |
a+b=c |
a%2Bb%3Dc |
a+b=c |
a%2Bb%3Dc |
50% off |
50%25%20off |
50%25%20off |
50%25+off |
café |
caf%C3%A9 |
caf%C3%A9 |
caf%C3%A9 |
it's (ok)*! |
it%27s%20%28ok%29%2A%21 |
it's%20(ok)*! |
it%27s+%28ok%29%2A%21 |
違いがいちばんよくわかるのは、完全なアドレスを入れたときです。https://example.com/a b?q=1&r=é を URL全体モードで変換すると https://example.com/a%20b?q=1&r=%C3%A9 になり、リンクとしてそのまま使えます。同じテキストを値モードで変換すると https%3A%2F%2Fexample.com%2Fa%20b%3Fq%3D1%26r%3D%C3%A9 になります。これが正しいのは、リダイレクト先の指定のように、アドレス全体が別のパラメータの値になる場合だけです。
ヒントと制限
- リンク全体ではなく値をエンコードしましょう。 先にリンクを組み立て、差し込む部分だけをエンコードします。
- 二重エンコードに注意しましょう。
%2520が見えたら、テキストが2回エンコードされています。1回デコードしてください。 - + がいつもスペースとは限りません。 + がスペースを意味するのはフォームデータの中だけです。パスの中の
+はただのプラス記号です。デコードする前に合ったモードを選んでください。 - エンコードは隠すことではありません。 エンコードされたテキストは誰でも読めます。リンクにパスワードを入れないでください。
- エスケープの大文字小文字は関係ありません。
%c3%a9と%C3%A9は同じ意味です。大文字で書くのが一般的です。 - 全角スペースにも注意しましょう。 日本語入力でうっかり入る全角スペースは半角スペースとは別の文字で、
%E3%80%80にエンコードされます。
そのほかの方法
JavaScript。 encodeURIComponent('Tom & Jerry') は Tom%20%26%20Jerry を返します。元に戻すには decodeURIComponent を使います。ただし %zz のような壊れた並びがあるとエラーになります。このツールではその部分をそのまま残します。
Python。 urllib.parse.quote('Tom & Jerry', safe='') は Tom%20%26%20Jerry を返し、urllib.parse.quote_plus は Tom+%26+Jerry を返します。
Excel。 =ENCODEURL(A1) で、セル A1 のテキストをパーセントエンコードできます（Windows 版 Excel 2013 以降）。
コマンドライン。 curl --data-urlencode "q=Tom & Jerry" は、送信時にフォームの値をエンコードします。
関連ツール
キャンペーン用のリンクを作るなら、UTM 生成ツールがすべてのタグを自動でエンコードします。タイトルからすっきりしたパスを作るには、スラッグ生成ツールを使ってください。URLの中にバイナリデータを入れる場合は、URLセーフオプションを付けた Base64 エンコードの方が向いていることがよくあります。