消費者トラブルの現状

スマートフォンの画面サイズは機種によって2.4～4.3インチとまちまちで、解像度は480～540×360～960程度が標準となっています。

WEBサイトにはPC向けやケータイ向けなどがありますが、最近はケータイよりも利便性の高いスマートフォンサイトが増えてきています。

スマートフォンとケータイを比べると、スマートフォンにはJavaScriptやｊQueryを用いることが可能なので、これらを活かしたデザインをすることができるのがメリットです。
スマートフォンは指で操作するので、ケータイはもちろんパソコンともまた違ったデザインが工夫されています。

自分で作ろうと考えている人は「ASCII.jp サイト制作の前に知りたいiPhone／Androidの仕様｜実践！iPhone＆Androidサイト制作ガイド」や「スマートフォンサイトの制作－基礎編－ペーペーエンジニアのおぼえがき」「iPhone iPad向けサイトを制作するためのいろいろ」などといったサイトを参考にすると便利です。

また、実際にデザインをする段階では「スマートフォンサイトのデザイン集サイトのまとめ」あるいは「保存版、iPhone等のモバイルGUIデザイン作成用Photoshop用PSDファイル60個まとめ」などを活用することをおすすめします。後者のサイトはデザインに使用できるパーツを配布しているサイトがまとめられているので、何かと使いでがあるはずです。

中でも特に人気があるのは6種類のスクリーン画面をPhotoshopでデザインした無料ベクターキット「iPhone PSD Vector Kit」です。スマートなデザインで、個人はもちろんのこと、商用にも利用できますので一見の価値ありです。

一応デザインができたら、実機で確認してみることが大切です。

PCではよくできていても、スマートフォンで見るとかなり印象が違うことがあります。

これは、目からの距離がPCとスマートフォンでは違うからです。実機で確認してみると文字がかなり小さく感じることもしばしばあります。実機で確認するには、Dropboxなどを使って転送するのが最も手軽で簡単です。

スマートフォンで使用するフォントは基本的に「ヒラギノ角ゴW3」がいいようです。

ただし、ヒラギノ角ゴが入っていないAndroidなどでは別のフォントが採用されるため、若干違った表示されることも覚えておくといいと思います。

フォントサイズは12px以上で作成するのもきれいなサイトを作るコツです。
基本横幅は320pxで表示されるので、デザインする際にも320pxにしておくのが無難です。

高解像度デバイスに対応することを考えて640pxでデザインすることも可能ですが、この場合にはフォントサイズや余白などがすべて偶数になるようにデザインしておく必要があります。
これ以外にサイドバーやメニューはシンプルに絞ること、リキッド（可変幅）でデザインすること、そしてタッチ操作がしやすいように適度な余白や行間を取ってあげることも大切です。

余白が十分にないと間違えて別のリンクを押してしまったり、誤動作が出てしまったりすることがあります。
Flashを使わずにアニメgifやアプリ連携で対応する配慮なども忘れないようにしたいものです。

You Tubeのようにスマートフォンに対応している動画配信サイトへあらかじめ動画をアップロードしておいてここに誘導するのもいいアイディアではないかと思います。
スマートフォンサイトのデザインは何と言っても慣れが大切ですから、失敗を恐れずにいろいろとやってみるうちにコツがわかってくるものです。