ハクソク

世界を動かす技術を、日本語で。

郵便番号を最初に記入してください

45日前原文(zipcodefirst.com)

概要

  • ZIPコードを使えば、都市・州・国の自動入力が可能
  • 多くのサイトは未だに非効率な住所フォームを提供
  • API利用やHTML属性で簡単に改善可能
  • 自動入力でユーザーと運営の双方が利益を得られる
  • 現状の問題点と具体的な改善策を解説

住所フォーム設計の非効率さへの批判

  • **ZIPコード（米国郵便番号）**は5桁で、都市・州・国が特定可能

  • 1つの入力欄で3項目の自動入力ができるにも関わらず、多くのフォームは未対応

  • 現状の多くのサイトは以下の手順を強いる設計

    • 番地入力
    • 都市入力
    • 50州のドロップダウンから州選択
    • ZIPコード入力
    • 200カ国以上のリストから国選択
      • 「The United States of America」で「T」に分類されている場合も多い

  • 実際はZIPコード入力だけで都市・州・国が判明し、他のフィールドは自動入力可能

  • API利用例（zippopotam.us）を使えば、数行のコードで実現可能

    const res = await fetch(`https://api.zippopotam.us/us/${zip}`)
const data = await res.json()
city.value = data.places[0]["place name"]
state.value = data.places[0]["state"]
country.value = "United States"

  • ZIPコード入力後に自動で都市・州・国が埋まるデモも紹介

住所フォームの「恥の殿堂」パターン

  • Tier 1: ZIPコードが一番下
    • 先に住所・都市・州・国を入力させ、最後にZIPコード
    • Amazon、Target、Walmartなど大手もこの設計
    • 数十億時間が「Illinois」を探すスクロールに浪費
  • Tier 2: 自動入力なし
    • ZIPコードを取得しても何も活用しない
  • Tier 3: 国選択ドロップダウン
    • 240カ国のリストをスクロール、検索や入力補助なし
    • 「United States」が「T」に分類、または無秩序な並び順
  • Tier 4: 戻るボタンで入力内容消失
    • 14項目入力後にエラーが起きて戻ると全消去
    • 開発者はぐっすり眠っているという皮肉

すぐできる改善策

  • **inputmode="numeric"**を設定
    • ZIPコード、電話番号、クレジットカード番号などは数字キーボード表示
  • autofill属性の正しい利用
    • postal-code、address-line1、countryなど
    • ブラウザのオートフィル機能と協調動作が重要
  • 国選択を先にしてもOK
    • IPアドレスで国をプリセット→郵便番号入力→自動入力
    • **「国フィールドを省略しろ」ではなく「既知の情報は再入力させるな」**が本質

まとめと呼びかけ

  • ZIPコードを最初に入力
  • 都市・州・国を自動入力
  • 番地入力は最後にし、ZIPで絞った候補から自動補完
  • 技術的障壁はない。APIも無料。実装は数行。
  • 現状維持は「思考停止のコピペ文化」
  • なぜZIPコードを一番下に？今すぐ直すべき。

問題提起・共有の呼びかけ

  • ZIPコードが最後、国リストがカオス、涙が出るフォームを見つけたら共有を推奨
  • 「恥の壁」公開予定も告知
  • 今すぐフォーム改善を。全員が得する解決済みの問題。

要点: ZIPコードで自動入力を徹底し、無駄な入力やスクロールを排除すべき。APIもHTML仕様も既に揃っており、実装は容易。今すぐ住所フォームを改善すべき。

Hackerたちの意見

でも、これはアメリカのコードしか取得しないから、アメリカ以外に住んでる人は自分の郵便番号を入力すると、地球の反対側のランダムな場所に飛ばされちゃうんだよね。結局、フィールドを埋めなきゃいけないし、最初にクリアしなきゃならないし。
└
明らかに国を最初に入れて、その後に郵便番号の相当するものを入れるべきだよね。イギリスでは、郵便番号を入れると平均して15〜16件の配達先に絞られるから、あそこでは誰も本当に住所を入力する必要がないんだ。
└
郵便番号も住民票も持ってないから、急いでる時に地元の郵便番号を探すのがめんどくさいんだよね。バカなアイデアだわ。
郵便番号を入力したらウィスコンシンになっちゃって、実際の郵便番号がギリシャなのに国を変更できなかった。UXの改善提案は素晴らしいけど、地球の95%のことも忘れないでほしいな。
└
そうだね。IPアドレスを使って国を事前に選択することはできると思うよ（必要ならオーバーライドもできるし、VPN使って他の国から注文することもできるし）。それに基づいて郵便番号を聞くって感じかな。
「郵便番号を最初に入れれば、都市、州、国が一度の入力でわかる」って言うのは簡単だけど、アメリカ以外の顧客はどうなるの？彼らには入力する郵便番号がないし、もし何かの郵便番号があってもフォーマットが違うんだよね。トルクメニスタンにいる人たちはどうやってサインアップするの？
└
郵便番号の入力をスキップして、他の情報をいつも通り入力すればいいと思う。
アメリカ中心すぎる。メキシコの郵便番号（5桁）を入力したら、メイン州のどこかに飛ばされた。だから、「郵便番号だけでアメリカにいるってわかる」っていう前提は完全に間違ってる。
└
そうそう、投稿の2文目は間違ってる。> その5文字から都市や州、国を特定できる。郵便番号から国を推測することはできないよ。
└
うん、郵便番号の実装は本当にひどいよ。各国で表示やフォーマットの仕方が違うし、追加のバリデーションルール（例えば、有効な郵便区）もある。これが素晴らしいはずなんだけど（実際素晴らしい）、そんなバリデーターを維持していると、クライアントが本来間違えるべきじゃないミスをするバグが絶えず発生することになる（その後の処理が難しくなることが多い）。それに、誰かの本当に存在する住所を受け入れないと、その人が非常に不満を持つことになる（それは当然だよね）。だから、明らかな解決策は、geo-ipやブラウザの信号などから事前に入力されることだね。
└
タイトルは「郵便番号と国を先に入力するべき」ってすべきだね。誰かに郵便番号を先に入力させて、その郵便番号に関連する国をドロップダウンの一番上に持ってくるのは簡単だよ（アルファベット順で）。他の国はその下に（これもアルファベット順で）。すべてのフィールドは編集可能にして、郵便番号は単に提案したり、ランク付けしたり、事前に入力されるだけでいいと思う。これなら、郵便番号が一つの都市だけを指さない場合や、郵便番号が変更されたり追加された場合のエッジケースも処理できるはず。
└
UIのパターンはまだまだバカみたいだよ。こういうフォームはキーボードでサクッと入力できるべきだよね。車の部品を探すときは、「ホンダ」、「モデル年」、「モデル」、「トリム」って選ぶから。住所フォームでは、キーボード対応のフィールドに「U」って入力すると、「アメリカ合衆国の小さな外れの島」ってデフォルトになっちゃう。対応しようとする場所はアメリカとカナダを先に表示するけど、国を先に聞いたら郵便番号の方法を利用できるよね。一部のサイトは住所を自動入力しようとするけど、個人的にはそれがうざい。だって、私の通りは一般的な名前だから。
└
一番面白いのは、アメリカのeコマースサイトが自信満々に外国の住所をチェックしようとする時だね。そこに配送を許可してるのに、ノルウェーの郵便番号には5桁が必要だって言われたことがあるけど、ノルウェーは4桁なんだよ。配送のウェブフォームでノルウェーを選んだのに。あと、特殊文字が使えないって言われるけど、その「特殊文字」ってのはノルウェー語のアルファベットの文字なんだ。私の住所にはøが含まれてる。これらはユニコードでもなく、拡張8ビットASCIIセットに入ってる。なんでこれをチェックしてるの！？こういうことはしょっちゅう起こるよ。ありがたいことに、私たちの郵便システムはこれを認識していて、いくつかの置き換えを許可してる（å=aa、ø=oe、æ=ae）。
└
そうそう。フランスの郵便番号（コード・ポスタル）を入力したら、アメリカの都市を推測された…でも、著者の言ってることには一理あるね。ウェブクライアントの国レベルのジオロケーションと組み合わせれば、99%の確率でうまくいくと思う。ただし、VPNユーザーのようなエッジケースを除いて。
└
1990年代半ば、私の国に大きな存在感を持つ多国籍企業（IBM）から情報を求めたことがあるんだ。彼らはカナダの郵便番号の6文字を、数字とアルファベットが交互に入ったものを5桁のZIPコードに変えてしまった。さらに混乱を招いたのは、封筒は手書きでニューヨーク州から送られてきたこと。アメリカ人の中には、世界の他の部分が自分たちの鏡だと思っている人がいて、その信念を維持するために変なことをすることがあるんだ。（公平を期すために言うと、英語圏の国々の間にわずかな違いを許容する、もう一つのレベルがある。）でも、著者のアドバイスをある程度実践しているウェブサイトも見たことがあるよ。国ごとに特化していて、郵便システムのデータベースに基づいている。郵便番号に一致する住所のリストを表示するけど、特定の住所に郵便番号がない場合はあまり機能しないんだ。そういうこともあるよ。
アメリカ以外の地域にサービスを提供するサイトでこれが機能するとは思えないんだけど、郵便番号がないか、重複しているか、全く別のものがある場合もあるし。ドイツには5桁のPLZがあるけど、有効なものを入力しても結果が出ない。著者は他の国について考えていないみたい。エントリーを関連性で並べ替えることには賛成だけど、国から始めないとダメだよ。それも検索としては良いアイデアだし、どんな言語であっても国名を入れてもすぐに見つかるはず。郵便番号（アメリカではZIPだけど）は、その後に関係してくる。
郵便番号を入力したら…あれ、間違った国：ドイツに住んでるんだよね。たとえそれを知っていたとしても、郵便番号からわかるのは都市だけだよ。せいぜい、いくつかの小さな村が一つの郵便番号を共有してるから。要するに、これが一般的かつグローバルなレベルで全く機能しないってことだと思う。だから、ウェブサイトがこれを違うやり方でやる理由があるんだろうね…
> その5文字から都市や州、国を特定できるってのは間違いだよ。多くの郵便番号は複数の都市を含んでたり、州をまたいでたりすることもあるし、国によってコードの違いも分からないことがある。だから、ただフォームをすぐに埋めるだけじゃなくて、複雑な多国籍フィルタリングロジックや編集可能なドロップダウンを実装することになる。大体、ほとんどのウェブフォームを実装してる人たちの無能さを考えると、これは大惨事を招くよ。むしろ、ブラウザの自動入力機能を使うことを学んで、それを考慮してサイトをデザインした方がいい。うまくやれば、ユーザーは一文字も入力しなくて済むんだから。数字のコードを入力するよりもずっといいよ。残念ながら、これすらウェブフォームを実装する人たちには難しいみたいだね。
└
これ、1000回言いたい。OPが言ってることを実装しようとしたけど、すぐに不可能だってわかった。都市は複数の郵便番号に存在することもあるし、同じ州に同じ名前の都市が複数あることもあるからね。だから、安全を考えると、都市、州、郵便番号を入力しなきゃいけないんだ。
└
うん、最初に郵便番号を入力して、他のドロップダウンや検索結果にマッチするものを上に持ってくるのはいいアイデアだと思う。ただ、いつもそうなるわけじゃないけどね。
└
もし95%の確率で効率的で、残りの時間も普通と同じくらい効率的なら、それでもいい解決策だよね。
└
リンクされた記事は、「郵便番号について知らないこと」っていうタイトルのレスポンス記事に、次の48時間から1週間以内にリンクされる気がする。
└
もし複数の都市があるなら、自動入力しない方が90%の人には早くて簡単だと思う（ただの予想だけど）。郵便番号に複数の都市がある人には変わらないしね。
└
> その代わりに、ブラウザの自動入力機能を使うことを学んで、それを考慮してサイトを設計しよう。うまくやれば、ユーザーは一文字も入力しなくて済む。1997年頃のNetscape 2.0レベルの技術が最良の解決策だなんて面白いね。みんながどうやって余計なJavaScriptで人々の生活を悪化させるかを考えている間に、タグが何をするかを忘れたかのようだ。手紙に住所を書くのなんて、5歳の子供でもクレヨンでできることだよ。必要のないドロップダウンがたくさんあって、キーボード入力を拒否してマウスでスクロールしないといけない住所フォームは、私の人生の厄介者だ。
└
その詳細は効率性を損なわないよ。郵便番号が他のフィールドを事前にフィルタリングして、しばしば一つに絞り込むことができるからね。データは完璧じゃないし、時間とともに変わるから、ユーザーが自由にデータを入力できるようにしておくべきだと思う。
└
もし衝突があったら、自動入力しないでほしい。他の人たちは自動入力してくれると嬉しいから。
└
USPSは気にしてないよ。各ZIPコードには一つの推奨都市名と、複数の都市にまたがるZIPコードのための受け入れ可能な代替都市名のリストがあるんだ。でも、USPSの住所検証は、受取人がその都市の境界内に住んでいるかどうかに関係なく、ZIPに対して推奨都市名を使うことを優先する。これは、USPSが住所を完全にZIPコードに基づいて整理することを選んだからで、他の政治的境界は、住所の解釈に問題がある場合を除いては関係ない。これによって、住所フォームを完成させる人にとって「間違った」都市名が自動入力されることがあるけど、彼らが受け取る大量の郵便物はおそらくその都市名を使っているだろう。技術的には、ZIPコードは州をまたぐことは「ないはず」なんだけど、例外的なケースではいくつかある。そういう場合、USPSは同じように扱う：推奨都市の州がそのZIPコードの推奨州になる。推奨都市はほぼ常にそのZIPを担当する郵便局の所在地だから、直感的に理解しやすい。郊外の都市にある郵便局が、主要都市の一部を含むZIPを持っている場合、その郊外が推奨都市名になるという興味深い例もあるよ。ZIPの都市名や代替名はここで調べられるよ：https://tools.usps.com/zip-code-lookup.htm?citybyzipcode。国内郵便マニュアルにも載ってるけど、いくつかのセクションに分かれていて、主に住所の都市名と州名を検証するためのCity Stateデータベースの仕組みの一部だね。
└
GPS座標が答えだね。
アドレスについてアメリカのプログラマーが信じている誤解：アメリカ以外の国は存在しない、もしあったとしてもあまり重要じゃない。これを買った人は、90%の世界で機能しないもののためにドメインを丸ごと買って、機能するって主張してるけど、その仮定をテストすらしてない。素晴らしい仕事だね！
└
名前を出して恥をかかせる手法、最近あまり評価されてないよね。 :)
└
一般的にはあなたに同意するけど、彼は本当にそう主張してるの？私が見る限り、ページ全体がアメリカのことしか言ってないよ。
いいアイデアだね、アメリカだけを対象にして、エッジケースをカバーしないなら（外部APIに依存したり、古くなる可能性のある都市の郵便番号の地図を持ちたいなら）。これを適切に行うことは可能だよ。例えば、DHLやUPSはまあまあうまくやってるけど、簡単ではないね。
> 「トルクメニスタンをスルーする必要はなかったよ。郵便番号を聞く前に、絶対に自分がアメリカにいるって確認しなきゃね。」