そろそろスマホ対策を考えてみる

そろそろスマホ対策を考えてみるに関する記事です。

 
2017/07/08(土)

端末シェアで伸び

ブログ作成記らしいネタを書いてみようと思います。ここのところ、スマートフォン(スマホ)が大人気ですが、バッテリー消費の話を聞くと、どうにもほしいと思えず、個人的には所有していませんでしたが、最近zenfone2という格安sim対応のスマホを購入しました。それはともかく、ホームページを閲覧している端末のシェアでは、スマホの割合が増加しているようなので、対策を考えたいところです。

スマホはPC用サイトを閲覧できる

スマホは、基本的にPC用サイトを閲覧できます。最新のスマホブラウザでは、HTML5やCSS3も解釈できるとのことです。しかし、画面サイズがやはり小さいので、ユーザーが快適に閲覧できるように、スマホは振り分けて表示させるサイトも多くあります。

振り分け方法

スマホとPC、携帯からのアクセスを振り分けるには、PHPか、htaccessなどを利用します。Google解析でスマホ閲覧者の直帰率を比較すると、スマホ未対応サイトの直帰率は対応サイトよりも高くなっているようですので、効果はあるかもしれません。

基本ワザ

PCとスマホを振り分けをする場合、HTMLはそのままで、外部ファイル化したCSSだけを変える、というのもアリではないかと思います。よく使われる基本ワザは、PC表示の場合は、CSSで、floatまたはdisplay inlineを利用して横並びのメニューバーを表示し、スマホ表示の場合は、通常通り、縦並びのメニューバーを表示させる、というものです。

viewport

スマホ画面は、viewportと呼び、メタタグで状態を指定できます。 スマホの画面は、実寸320pxまたは480pxです。HTMLで書かれたサイトは、横幅980pxとして表示するので、つまり1/2または1/3に自動的に縮小表示されます。 そこで、拡大表示せずに快適に閲覧できるようにCSSを設定し、メタタグのviewportで、勝手に拡大表示しないようにする、という手法が利用されることがあるようです。

CSS3のメディアクエリ機能

インターネットエクスプローラーの8以前は対応していませんが、CSS3のメディアクエリ機能を利用することもできます。 この場合、HTMLファイルを一つだけ用意すれば良いので、更新が楽です。IE8以前用は、respond.jsというもので、代用できます。CSS3のメディアクエリ機能が一番手軽のようです。

スマホ対応するインセンティブ

そういえばはてなブックマークをチェックしていたら、グーグルがスマホ対応が不適切なサイトの検索順位を引き下げるかもしれない、というニュースがありました。スマホ対応するインセンティブになるかもしれません。

格安SIM

最近は格安SIMの登場でモバイル回線が安くなっており、容量の小さいホームページの方が良いのでは、という気もしないではありません。いずれにせよ、スマホ対策を進める必要がありそうです。

更新情報

  • 2016/3/4
  • 2014/10/12
  • 2013/7/23

BLOG MENU

この記事へのトラックバック

コメントの投稿  お気軽にどうぞ!













管理者にだけ表示

おすすめリンクやRSS
Page Top ↑
このページはそろそろスマホ対策を考えてみるに関する記事です。
Mail:
copyright (c) 2013 ブログ作成記 fc2reviewer.blog109.fc2.com All right reserved.