簡単じゃない!スマートフォン向けホームページ

PCと異なるスマートフォン向けホームページの特徴

最近はPC向けホームページのお問い合わせの際に「ついでにスマートフォンもお願いします。」というおまけの感覚でご相談いただくケースが増えてきました。

以前は「ガラケー」と呼ばれていた時代の携帯電話用ホームページは見た目に明らかにPCと同じようにいかないので「オマケ」というのはその通りかもしれませんね。

最近ではPCと同じような感覚でホームページが見れるようになってきました。またアクセスの割合も業種によってはPCを上回るところもあります。

「PCと同じように見れるなら、ついでにスマートフォンもお願いします」という感覚はお客様だけでなくノウハウの少ないホームページ制作会社にあるのも事実です。

しかしながらいざ作ってみると様々な問題が生じ予算超過、品質の低下等失敗につながるケースも少なくありません。そこでスマートフォン向けホームページの代表的な特徴、問題点についてご紹介させていただきます。

特徴1:レイアウトが固定できない

機種ごとに画面サイズがバラバラでかつ、縦向き、横向きの違いがあるので例えば「画面右端から○○PX」というように固定しても左側がすごく余白がでたり、逆に詰まっていたりして見た目が全く同じというのは大変厳しいです。

また画面縦向きで見た目に適当なサイズの画像があった場合、それが幅の広い横向きになった時、いくつかパターンがでてくるかと思います。

  1. 画像は常に中央ぞろえ
  2. 画面に対して右または左寄せ
  3. 縦向き、横向きいつでも画面に対して幅100%で表示

3などの場合は幅の広い横向きを考慮して大きめの画像が必要となります。

特徴2:画面の単位がPCと異なる

画面デザインはPCで行うと思いますが、最近はiPhoneメインで横幅640pxが標準です。

しかしiPhoneなどでは320dpという単位となっています。つまり実際のイメージは横幅640pxで作って、半分の320pxで確認することになります。なので文字サイズや余白の感覚も一般のPCのWEBデザインと異なります。これはスマートフォンの画質がPCよりも高密度のためです。

PCではMacBook Retinaなどがスマートフォンと同等の画質になりますが一般のPCでくっきり画像が表示されていてもRetinaやスマートフォンではぼやけて見えたりします。

特徴3:マウスオーバーがない

マウスオーバーとはPCでボタンなどの上にマウスが重なると色が変わったりメッセージが変化したりするアクションの事です。

スマートフォンは直接ボタンに触れるのでPCのようにマウスオーバーで何か演出ということはできません。

特徴4:同じフォントがない、PCでは動くものが動かない

例えばAndroid2.3などの古い機種では日本語の太字フォントがないので太字が表現されません。またアニメーション等PCと同じプログラムで「あの機種で動かない、この機種では動く」という事例も多く見受けられます。

お問い合わせフォームやショッピングの購入画面でこのようなトラブルが発生するかもしれません。

特にAndroidの場合はメーカー毎にいろんなバージョンのものが存在します。Androidに関してはOSのシェアを考えると2.3でなく4.0以上を基準とされる方がいいかと思います。

他にも多くの特徴があるのですがこれらを事前に把握してしっかりとした設計で臨めば恐れることはありません。またスマートフォンとPCの連携も重要なポイントです。

詳しくは弊社まで気軽にお問い合わせくださいませ。

【無料】「ホームページ・スマートフォンよろず相談」

ホームページ運営やスマートフォンでのサイト制作、アプリ開発などに関して無料にて「よろず相談」承ります。   自社のホームページ診断や参考にしたい参考にしたい他社のサイト。企画しているスマートフォンサイトやアプリ等。   対象となるサンプルがありましたらURLにてご紹介くださいませ …

ビジネスコラム提供者情報

  • IT:ソフトウェア開発
  • Storyboard
  • 兵庫県姫路市花田町高木295-22

スマートフォンの登場と共にこの数年でWEBマーケティングとそれを上手く活用するためのホームページやアプリの運用方法も大きく変わっています。 スマートフォンからのホームページの流入、利用の割合が非常に大きくなり、 「いつでも、 …

比較ビズに掲載しませんか

Webシステム開発・導入

簡単じゃない!スマートフォン向けホ …

最近はPC向けホームページのお問い合わせの際に「ついでにスマートフォンもお願いします。」というおまけの感覚でご …

プログラミング言語に関する基本用語

こんにちは!!このページにアクセスいただいてありがとうございます。 今回は、プログラミング言語について …

インテリジェントレーベルのWebコン …

成功するホームページのポイントPoint1CRMを導入する!顧客維持率の高い何度でも訪問したくなるホームページ制作をし …

オープンCMSで 業務システム構築!

業務系システム構築時のゼキテクチャとしてJavaや.netを選択する企業が多い。 インターネットの世界では、PHPが一般的 …

Webマーケティング

簡単じゃない!スマートフォン向けホ …

最近はPC向けホームページのお問い合わせの際に「ついでにスマートフォンもお願いします。」というおまけの感覚でご …

ホームページ制作時に出来るSEO対策

ホームページを制作するにあたり、できるだけ希望のキーワードでヒットするようにしたいのは、皆さんが考えられるポイ …

マルチ言語による3次元ホームページ

あなたの会社のホームページは 何の目的ですか?有効に機能していますか?HP以外に活用していますか・同業者との差別 …

御社の「売上げが上がる」ホームペー …

SEOって?   SEOとは、検索エンジンで上位に表示されるように工夫することです。 特定の用語で検索された場合 …

会員メニュー

おすすめコンテンツ

▲ページTOP