このページの本文へ

スマートフォンサイト制作の基礎知識

2012年01月26日 11時00分更新

文●アンティー・ファクトリー

  • この記事をはてなブックマークに追加
本文印刷
web-keyword

 スマートフォンは、PC向けのWebサイトをほぼそのまま閲覧できる「フルブラウザー」を搭載しています。しかし、画面解像度や回線速度の制限、タッチパネル操作が主流といった特性から、PC向けサイトのままでは見づらく、使いづらい場合も少なくありません。

 そこで、スマートフォンに最適化された「スマートフォンサイト」を用意する企業も増えています。

スマートフォンサイトとPCサイトの違い

 スマートフォンにはさまざまなプラットフォームがありますが、スマートフォンサイトでは国内シェアが高いiPhone/Androidが対象になることがほとんどです。

 iPhone/Androidの標準ブラウザーは、どちらもPC用のSafariなどと同じ「WebKit」というレンダリング(描画)エンジンを採用しています。このため、iPhoneとAndroidの表示結果は似ており、PCのSafariとも近い表示結果になります。

 一方で、PCとの違いもあります。スマートフォンのブラウザーは常に全画面で表示され、ウィンドウサイズは変更できません。そのため、ボタンや文字は全画面で表示されることを前提に、読みやすく、タッチ操作しやすい大きさに調整します。

 1ページに使用できるファイルの容量やJavaScriptの処理時間にも制限があります。iPhone/Android端末ともにサイズの大きなページを開くと動作が遅くなりますし、PCに比べて通信速度も遅いので、ケータイサイトと同様、できるだけ軽量に作る必要があります。

 また、ほとんどのスマートフォンのブラウザーでは、プラグインが使用できません。iPhoneはFlash Playerに対応していないので、Flashは再生できません。AndroidにはFlash Playerがありますが、すべての端末に搭載されているわけではありません。

 プラグインが利用できない代わりに、iPhoneやAndroidではHTML5やCSS3といった最新技術が利用できます。リッチな表現が求められる場合は、こうした代替技術の利用を検討しましょう。

スペックや仕様変更にも注意しよう

 スマートフォンは、PCに比べてハードウェアの性能が低いので、PCでは問題なく動作していたサイトでも、スマートフォンでは処理能力が追いつかず、適切なパフォーマンスが得られないこともあります。

 OSのアップデートや新機種投入のサイクルが早く、ハードウェアの性能や仕様、制限事項もその都度変わっています。ここで触れたポイントも、本書が発行された時点ではすでに過去のものとなっている可能性もあります。Webディレクターは常に最新の情報を得るようにして、サイト制作に反映するよう心がけましょう。

著者:アンティー・ファクトリー

アンティー・ファクトリーはWeb戦略だけでなく、タッチパネルやスマートフォンなどの各種インターフェイス・アプリケーション開発、次世代広告コミュニケーションの設計や開発を行っています。ワールドワイドなクリエイティブを展開し、発展しつづける会社です。

書影

書籍版は、企画・設計・制作・運用など、Webディレクション業務の大まかな流れに沿って構成。最新情報を盛り込み、書き下ろしのコラムや用語集も収録しました。ずっしり重い1030g、厚さ19.5mmで、苦手分野を穴埋めしたい新米Webディレクターや、これからWebディレクターを目指す方におすすめの1冊です。

Webディレクション標準スキル152

本体 4,280円+税、AB判392ページ(オール4色刷)
ISBN:978-4-04-868746-1

Amazon.co.jpで買う 楽天ブックスで買う

この連載の記事

一覧へ

この記事の編集者は以下の記事をオススメしています