キャブは、官公庁のWebサイトガイドライン作成も行うホームページの専門会社です。2019年12月27日こんにちは!インターン生の田中です。今日は12月27日(金)今日でキャブも仕事納めです(今年もあっという間だったな~)突然ですが自分はこの1年を一言で現すなら、「挑戦」だと思っています。周りで誰一人やっていなかったインターンも挑戦のうちの一つでしたし、学校やプライベートでは今までやってこなかったことをどんどんやってきました。プライベートでは知らない人に話しかけるキャンペーンみたいなのもやっていました(笑)かるく不審者ですね来年はこの「挑戦」の幅をもっともっと広げて、やったことないことは何でもやってみる年にしたいです!また、「挑戦」に加えて「継続」を大切に、さらに挑戦→継続から「結果」に結び付けられるような年にしたいなとも思っています。来年の抱負を語っていたらこれだけでブログが終わってしまいそうなのでここらへんで、、さて、今回のブログの内容は何かというと、最近へぇ~とおもったことをお話ししていきたいと思います。問題は日航ホテル系列のサイトの外国語ページで起こりました!検証では何も問題ないはずなのに、実機で確認したらフッターの郵便番号のテキストがなぜか青く表示されるという現象が起きました。日本語ページは大丈夫で英語のページだけおかしい。あ~、検証で確認できない不具合とかかんべんしてくれ~って感じです(笑)最初のうちはどんなどこに不具合の元があるのか探していたり、文字の色をcssで変更したりしたのですが、効果なし。それじゃあということでいろいろ調べていくと「あれ、これ不具合じゃないぞ」ということに気が付きました。いうことかというと、iPhoneなどのIOSの初期機能に電話番号と識別した数字に自動でリンクを付与してくれるという機能が付いているらしく。それが今回郵便番号に機能してしまったみたいです。こんな感じ(1)で<a>タグが無理やり挿入されてリンクがつくみたいで、色の指定もp>aという風な指定をしないと反映されないみたいです。</a></p>つまり、今回の不具合はIOSの「この数字、電話番号ならタッチするだけですぐに電話かけられるようにしてあげるよ~」という電話番号自動リンク機能の裏目がでて、電話番号じゃない郵便番号にリンクが付与されてしまった結果、文字が青くなり、検証では確認できず、色もうまく変えられないということが起きたのです。なんで郵便番を電話番号と勘違いしてしまったのかこれには文化の違い?が関係していました。日本の郵便番号ってこんな感じで書きますよね〒102-0083(キャブのをお借りしました)でもアメリカだと下のように書くようで00000‐0000なんと郵便マークいらないみたいです!今回はこの郵便番号がないことによって、電話番号だと誤認されたみたいです。(いやあ調べていくと勉強になりますね)じゃあこの自動リンクを無効にするにはどうすればいいのかについて最後話します。【解決策1】ヘッダーのメタ情報に下記を加え、自動リンクを全部無効にする。content=”telephone=no”>これは記入したページのすべてに反映されます。逆にリンク付けしたい電話番号も、自動リンクが無効になってしまうので、その時は下記のようにtelプロパティを設定しましょう。無効化したい一部のみ無効化する。}全部じゃなくて、一部分だけ自動リンクを無効化したいといった場合。