Chrome、日本語氏名のふりがなオートフィル拡張
日本語フォームの利用者と、そのフォームを実装する開発者に向けて、Chrome のオートフィルが氏名の漢字表記とふりがな（カタカナまたはひらがな）を同時に埋められるよう、ふりがな欄の検出と文字種の選択が拡張された。医療機関の登録や EC のチェックアウトなど、氏名と読みを分けて求める画面での入力負担を減らす狙いである。
HTML 標準にふりがな専用の autocomplete 値がないため、Chrome は複数の手がかりを組み合わせてふりがな欄かどうかを推定する。
ふりがな欄の検出
最も強い手がかりは autocomplete である。ただし非標準の値を付けると、フォールバックのヒューリスティックが働かずオートフィルが期待どおり動かなくなるため、仕様外の値は避ける。
ふりがな用には、属性を付けないか、通常の氏名と同じ標準値を使う。
- ふりがなのフルネーム:
autocomplete="name" - ふりがなの姓:
autocomplete="family-name" - ふりがなの名:
autocomplete="given-name"
標準値だけでは漢字欄と区別できないため、Chrome は name とラベル文言でふりがな欄を識別する。パーサが認識する例は次のとおりである。
| 種別 | 有効な name の例 | 有効なラベルの例 |
|---|---|---|
| ふりがなフルネーム | full-name-phonetic、セイメイ、せいめい | セイメイ、せいめい |
| ふりがなの姓 | family-name-phonetic、セイ、せい | セイ、せい、姓ふりがな |
| ふりがなの名 | given-name-phonetic、メイ | メイ、めい、名ふりがな |
ラベルと意味の分かる name を揃えておくと、漢字の氏名欄と並べても誤判定が起きにくい。
カタカナとひらがな
埋める文字種はラベル（name ではない）を見て決める。ラベルにカタカナが 1 文字でも含まれればカタカナで入力し、それ以外はひらがなが既定になる。
| ラベルの例 | 入力される文字種 |
|---|---|
| セイメイ（カタカナ） | カタカナ |
| せいめい（ひらがな） | ひらがな |
| Phonetic full name（英語のみ） | ひらがな |
| セイメイせいめい（混在） | カタカナ |
記事内デモ
Chrome でこのページを開き、あらかじめ chrome://settings/addresses（環境によっては chrome://settings/contactInfo）で氏名とふりがなを保存しておいたうえで、下の入力欄をフォーカスするとオートフィルを試せる。DevTools の「その他のツール」から Autofill ツールを開き、入力を走らせたあと、ふりがな欄が Alternative full name、Alternative family name、Alternative given name のいずれかとして分類されているかも併せて確認できる。
カタカナラベル（既定でカタカナが入る例）:
ひらがなラベル（既定でひらがなが入る例）:
利用者側の設定と氏名の分割
動作を試している場合は、まず chrome://settings/addresses（環境によっては chrome://settings/contactInfo）で連絡先を編集し、ふりがな欄に読みを入れておく。保存されたふりがなは、適切と判断された欄へ自動で流し込まれる。
漢字のフルネームから姓と名へ自動分割は常に正しいとは限らない。設定画面の氏名またはふりがな欄に、ハイフン、中黒（・）、ミドルドット（·）、全角スペース、通常のスペースなどの区切りを入れると、分割の手がかりにできる。実装側では、family-name と given-name を分けた入力にして曖昧さをなくすのが最も確実である。設定 UI 上のふりがな表示は、Google の連絡先と同様に既定でひらがなになる。