技術的なことから意味のないことまで、忘れたくないことをただ綴っていきます。RSSAmazon検索キーワード:HTML5時代の作法をまとめてみた2012年8月4日そろそろHTML5を業務で使い始めていいんじゃないかと思い、HTML5で記述するにあたって記述しておくべき定義(作法?)をまとめてみました。別の環境から見たらおまじないみたいに見えるものとか、そんな感じです。IE6での標準準拠モードにするためのDOCTYPEの書き方みたいな。基本的にはheadタグの中に書くべきものを説明していきます。DOCTYPEとかHTML5のタグの説明は期待しないで下さい...。content="IE=edge,chrome=1">これはIEの互換性を明示的に記述しています。contentの中はカンマ区切りで2種類の定義を記述しています。インストールされていれば使用する」という意味です。initial-scale=1.0">これはスマートフォンで表示する際の、仮想的なブラウザサイズの定義です。iPhoneやAndroidのブラウザで対応しているみたいですが、何の規格かはわかりませんでした...。「initial-scale=1.0」は「初期の倍率は1倍」という意味です。「initial-scale=1.0」だけでいいと思うのですが、「width=device-width」を書いているところが多いようですね。href="512.png">これは、iPhoneやiPadのWebクリップアイコンの画像の指定です。iPhoneは57ピクセル(Retinaディスプレイのものは114ピクセル)、iPadは72ピクセル(Retinaディスプレイのものは144ピクセル)のアイコンが表示されるようです。サンプルでは上記のように4種類指定されていました。ちなみに、sizes属性を付けない場合は512×512ピクセル、もしくは1024×1024ピクセルの画像を指定することになるそうです。...でか過ぎじゃないですかね(汗)ちなみに、「apple-touch-icon-precomposed」の代わりに「apple-touch-icon」を指定する方法もありますが、ここでは割愛します。あと、次のは作法ではないですが、後方互換のためのメモです。src="IE9.js"></script><![endif]-->「html5shiv-printshiv.js」はIE8以前でもhtml5のタグを使えるようにするものです。html5shivというプロジェクトのものです。このプロジェクトの成果物にはhtml5shiv.jsというものもあるのですが、html5shiv-printshiv.jsはプリントアウト対応ということなので、こちらを定義しておけば間違いないかと。(サイズはこちらの方が大きいので必要に応じて使い分けた方がいいですが)IE9.jsはIE8以前のブラウザの挙動を出来るだけIE9に近づけるようにするものです。これは、ie7-jsというプロジェクトのものです。同様のプロジェクトも色々あるようですが、これが一番無難かと。そんなに高性能じゃないので、IE8での「border-radius」等は実現できないようです。他にもCSS3PIEやModernizr等もよく使われていますが、これはサイトによっては必要ないかもしれません。コメント(0)コメントはまだありません»コメントはまだありません。