スマホサイトでケータイも対応する－画像問題解決編－

画像が問題で、スマホサイトとケータイサイトが１つにはならないと思っていませんか？

[ラウンドアバウトでスマホサイトをガラケーで表示した場合]

スマートフォン基準のコンテンツからケータイも対応するコンセプトのモバイルコンテンツ変換「ラウンドアバウト」を使えば、画像のことは気にする必要はありません。

通常、スマホ向けに高画質画像をたくさん使ったサイトをそのままガラケーで表示すると、画像サイズが大きすぎたり、１ページの容量が大きすぎたりで、下の画像のようにレイアウトが崩れるなど、トラブルが出てしまいます。

[スマホサイトをガラケーでそのまま表示]

しかし、スマートフォン向けのサイトをガラケーにも展開できる「ラウンドアバウト」は、２つの強力な画像変換機能を搭載しているので、こうしたレイアウト崩れなどの画像に関する諸問題をすべて解決します。

その２つの強力な機能とは

• オートレイアウト
• 自動容量調整

です。


「デザインに差が出るオートレイアウト」

今までのケータイサイトに比べ、スマートフォン向けのサイトを作成するときは画像を沢山使います。例えば、メニューをアイコン化し、3x3の並びでいかにもスマートフォン向けのサイトっぽく見せたり、右のサンプルサイトのようにPCサイトに似せて、サイトトップにメニューを横並びに画面幅ぴったりに作ってレイアウトしたりします。その他にも絵文字の代わりに小さなアイコン画像も多く使い、スマートフォンサイトらしいデザインを求める場合もあるでしょう。

でも、本来はそんなデザインをしたスマートフォン向けサイトはガラケーではちゃんと見えるはずがないと思いませんか？きっと、ケータイサイト制作で苦労されてきた方ほど、「そんなレイアウトをワンソースでは無理！」と思うでしょう。

その代表的な理由が

• 画面幅がガラケーとスマートフォンで違う

です。

例えば横幅320pxに合わせて制作したレイアウトも、画面幅が320px以外だと画像が改行されてしまう、画像が小さくなってしまうなど、意図したとおりになりません。本当に思い通りのレイアウトになるのは約1000機種以上の中で一握りだけです。

そのため、通常は画像を複数サイズ用意して出し分けたり、パーセント調整で済む程度のデザインになるように制約を設けます。さらに、凝ったレイアウトをするのはトップページだけで、１階層下のページはシンプルにするなどします。

でも、もう心配いりません。

ラウンドアバウトがアクセスしてきたモバイル端末の画面幅に合わせて、すべての画像を自動リサイズします。だからレイアウト崩れを気にする必要はありません。


オートレイアウト機能に任せれば、画像の配置は自由自在です！

「キレイな画像が表示できる自動容量調整」

今まではガラケーに対しては１ページで表示できる容量が決まっていたので、画像の容量と格闘しながらサイト制作してましたが、スマートフォンでは違います。

せっかくのスマートフォンサイト、どうせならきれいな画像を見せたいですよね！？

実際、アパレル系ECサイトでは、きれいな画像が表示できるか否かが、モバイル端末からの売上に大きく左右すると言われています。

例えば、ワンピースの写真でもスマートフォン向け高画質画像（約60KB）とガラケー向けの低画質画像(約10KB)とで比べたら、スマホ向けの画像は色もデザインも鮮明なのに対して、ガラケー向けは全体的にぼんやりした　　　　　　　　　　　　　　　画像になってしまいます。その違いは一目瞭然ですよね。

左：スマホ向け　　　　　　　　　　　　　　　　　　　右：ガラケー向け

通常、スマートフォンサイトでは左のスマホ向け画像を１ページ内にいくつも表示しても容量制限がないためエラーになることはなく、画質もキレイなまま表示されます。

ですが、そのスマートフォンサイトをそのままガラケーに表示しようとすれば、すぐに容量オーバーエラーになってしまいます。

でも、またまた心配はいりません。

オートレイアウトに続き、今度は画像容量を自動調整してくれるのが自動容量調整機能です。ラウンドアバウトがアクセスしてきたモバイル端末の表示可能な容量に従って、エラーを起こさないように自動調整します。結果として、制作側の手間は一切なく、それぞれの端末にとっての最高画質を表示できるようになります。

自動調整機能で、最高画質を表現することが可能です！

このオートレイアウト機能と自動容量調整機能があるから、ラウンドアバウトはスマートフォン向けのサイト１つでケータイもカバーできてしまうのです。

各機能のより詳細については製品サイトをご覧ください。

早速、ラウンドアバウトの変換を試してみたい場合は以下のトライアルサービスをご利用ください。

Facebookはじめました。「ラウンドアバウト」

http://www.facebook.com/symmetric.roundabout

よろしければ「いいね！」をお願いします。