meta要素
meta要素はtitle要素、base要素、link要素、style要素、script要素では表現できない情報を情報を提供する要素です。
エンコード
meta要素ではcharset属性を利用して文章のエンコードを指定できます。例えばHTML文章がUTF-8なら次のように指定します。
<meta charset="UTF-8">
エンコードの指定はtitle要素など文字列が登場する前に指定する必要があります。
標準name属性
meta要素は以下のname属性と組み合わせることで様々な情報を付加することができます。
application-name | Webアプリケーションの場合は名前を指定 |
---|---|
author | 筆者の情報 |
description | ページの説明 |
generator | ページを生成したソフトウェア |
keywords | ページに関するキーワード |
例えば、descriptionはcontent属性を利用して以下のように指定できます。
<meta name="description" content="meta要素はページにメタ情報を付加するための要素です。">
format-detection
meta要素にformat-detectionで各値にnoを指定することでコンテンツの自動リンク機能をオフにすることができます。
<meta name="format-detection" content="telephone=no">
自動リンク機能の値と対応デバイスは以下になります。
値 | リンク先 | iPhone | Android |
---|---|---|---|
telephone | 電話 | ◯ | ☓ |
メーラー | ☓ | ◯ | |
address | 地図(英語飲み) | ☓ | ◯ |
複数の値を指定したい場合はカンマ(,)で連結をおこないます。
<meta name="format-detection" content="telephone=no, email=no">
apple-mobile-web-app-capable
iPhoneやiPadなどのiOSではmeta要素にapple-mobile-web-app-capableを指定することでフルスクリーンモードでの描画が可能です。
<meta name="apple-mobile-web-app-capable" content="yes">
現在、フルスクリーンモードで描画されているかどうかはJavaScriptのNavigator.standaloneプロパティで判定できます。
参考URL
4.2.5 The meta element - W3C
Safari HTML Reference: Supported Meta Tags
登録日 : 2013年06月04日 最終更新日 : 2016年4月3日