国旗の絵文字がWindowsでうまく表示されないのはなぜか？

「国旗の絵文字が単なる文字として表示される」という報告を受け取った開発者のライアン・ガイヤー氏が、なぜそのような事態が発生しているのか突き止めたレポートを公開しています。

The dumb reason why flag emojis aren't working on your site in Chrome on Windows
https://geyer.dev/blog/windows-flag-emojis/

最初に「国旗の絵文字が表示されない」という報告を受け取ったとき、ガイヤー氏は、とんでもなく古いマシンを使っているか、絵文字をサポートしていない時代遅れのウェブブラウザを使用しているのかと疑ったそうですが、実際のところ、問題の環境はWindowsでChromeの最新バージョンを使用していました。

ChatGPTに聞いても解決しなかったためガイヤー氏は自ら深掘りを行い、「Windowsがシステムフォントに国旗の絵文字を入れていない」ことが原因だと突き止めました。

では、今後は「なぜMicrosoftがWindowsのシステムフォントに国旗の絵文字を入れていないのか」という問題に突き当たりますが、ガイヤー氏は「政治的に、特定の『国』が存在すると認める立場なのだと受け取られては困るから」だと推測しています。

Windows 10向けの絵文字フォント「Segoe UI Emoji」に国旗が含まれていないことは以前から指摘されていました。たとえば、UI・UXデザイナーのオーリー・ウィリアムズ氏は自らのブログ「Fully Stacked」でWindowsでは、独自に国旗表示を実装しているFirefoxを除いて、国旗絵文字が表示されないと報告しています。

Using emoji on the web
https://fullystacked.net/using-emoji-on-the-web/

Firefoxは独自に対応できているわけなので、Chromeでも同様のことは可能なはず。しかしガイヤー氏が調べたところ、2021年5月にフォーラムで国旗絵文字が表示されない件が取り上げられた際、Google従業員は「現在のところ、独自の絵文字フォントをウェブブラウザと一緒に出す計画はない」と回答していました。

Add support for country flag emojis [40766658] - Chromium
https://issues.chromium.org/issues/40766658

ガイヤー氏は、どうしても国旗の絵文字が使いたい場合の解決法を2つ示しています。

1つは、ハードコードされたSVGアイコンに置き換える方法で、ニーズが単純であれば適切な方法だと考えられます。ただ、実行時までどの国旗が必要かわからないような、より動的な作業を行う場合には面倒なことになる可能性があります。

もう1つは、国旗絵文字を含むカスタムフォントをポリフィルで使用する方法です。たとえば、Firefoxで国旗絵文字表示に使われている「Twemoji」フォントを、国旗部分をカバーするサブセットだけ呼び出すことが可能です。ただし、1.4MBあるフォントファイル全体をダウンロードする必要があります。

なおガイヤー氏は「最大の教訓は、国旗絵文字をサイトデザインの不可欠な部分にすべきではないということです。破ってしまうと、苦しむことになります。理想的な世界ならいつか修正されるでしょうが、何年も動きがないのでもう期待していません。ありがとう、Microsoft 🇹🇼」とコメントしています。

ちなみに、以下の画像は国旗絵文字がどのように見えるかを示した画像。上の列がスマートフォンやWindows版Firefoxなどで見た場合、下の列がFirefox以外のWindowsブラウザで見た場合です。