パソコン向けサイトをたくさんつくってきたおまいさんたちでも
Androidブラウザが認識できるみたことがないMETAタグがあったりします。
これらは、スマートフォンWEBサイトをつくるときには
大変便利なものだったりします。
<meta name="viewport" content=" height = [pixel_value | device-height] , width = [pixel_value | device-width ] , initial-scale = float_value , minimum-scale = float_value , maximum-scale = float_value , user-scalable = [yes | no] , target-densitydpi = [dpi_value | device-dpi | high-dpi | medium-dpi | low-dpi] " />
それぞれサンプルコードをみてみます。
ビューポートの幅が正確にデバイスの画面の幅に合わせてズームする機能を無効にすることを必要があることを指定します。
<meta name="viewport" content="width=device-width, user-scalable=no" />
あなたのWebページを正確に幅320ピクセルになるように設計されている場合、その後、ビューポートの幅のためにそのサイズを指定する必要がある場合があります。
<meta name="viewport" content="width=320" />
正確なピクセルにビューポートの寸法を指定する代わりに、あなたは常に、それぞれ、値がデバイスの高さとデバイス幅とビューポートのプロパティの高さと幅を定義することによって、デバイスの画面の寸法に合わせてビューポートのサイズを設定することができます。
<meta name="viewport" content="width=device-width" />
ビューポートの尺度は、Webページに適用されるズームのレベルを定義します。ビューポートのプロパティを使用すると、次の方法でWebページの縮尺を指定することができます
<meta name="viewport" content="initial-scale=1.0" />
異なる画面密度用のWebページをスケーリングからAndroidのブラウザとWebViewのを防止するため、デバイス解像度にターゲットdensitydpiビューポートのプロパティを設定します。これを実行すると、ページが拡大縮小されません。その代わりに、ページが現在の画面の密度と一致するサイズで表示されます。このケースでは、あなたがまた、デバイスの幅に合わせて、ビューポートの幅を定義する必要があります、あなたのWebページが自然に画面のサイズに合うように。
<meta name="viewport" content="target-densitydpi=device-dpi, width=device-width" />
これらのスマートフォン独自の
メタタグを使うことによって、サイズが異なるandroid端末にも
うまく対応した画面が作成できたりします。
（追記：こんなこともできるようになってる！！）
Android標準ブラウザとなった Chrome を使っていれば来るであろう幸せのショートカッツ
