結論
<meta name="format-detection" content="telephone=no">
これをheadに追加すればOKです。
使用例
<!DOCTYPE html>
<html>
<head>
<meta name="format-detection" content="telephone=no">
<title>文書のタイトル</title>
</head>
なぜこのメタタグが必要なのか?
iPhoneサファリで勝手に電話番号リンクされる使用になっています。
09012345678 のような文字列があると自動的にハイパーリンクになり、押すと電話が起動するというもの。
電話番号とは関係ない文字列の場合機能してしまい、
電話番号情報をテキスト表示したいだけ、製造ナンバーなどの表示なども電話番号として認識してしまうため、
このメタタグが必要となりました。
タップしたら電話がかけられるaタグ
ちゃんとした電話番号にはタップしたら電話がかけられるようにしたい場合は、
<a href="tel:0123456789">電話番号</a>
のようにしてa要素で電話番号と認識させます。
これによってiPhoneサファリ以外のブラウザでも電話番号リンクが表示されタップすると電話をかけられるようになりますし、
メタタグでiphone向けに全体で自動電話番号リンクを無効化している場合でも
これで電話番号認識させる事ができます。
まとめ
全員でこのメタタグが抜けていないかチェックしていけたらと思っています。
チェックの際などに「番号でボタンが押せちゃう」などがありましたら
このメタタグをコピー&ペーストで入れていきましょう!
株式会社ビーエムビー
〒114-0031 東京都北区十条仲原1-4-8 商店街会館311 TEL&FAX:03-5948-5996
東京都北区のWEBやDTP(印刷物)のデザイン制作会社です。ホームページ制作やLP(ランディングページ)の作成、ECサイト(楽天ストアなど)の構築などのWEBデザイン、チラシ・ポスター・名刺・パンフレット・看板などの印刷物デザインに対応しています。お客様の業務形態や用途に合わせたwordpressによるCMSサイトをフルスクラッチにて構築することが可能です。お気軽にお問い合わせください。