スマホ化する時に気をつけるポイント

最近業務でPCサイトのデザインをスマホ化することが増えてきました。

同じデザインだからこそ、ケアレスミスは許されません。

PCサイトをスマホ化する時に気をつけるポイントをまとめます！

気をつけるポイント

・640pxで作成する

ースマホサイズは320pxですが、作成するときは640pxで作成します。

　理由は簡単。iPhone3とiPhone6などで解像度が異なるため、

　高い解像度でもぼやけないようにするために大きく作成します。

※iPhoneの解像度のシェアに準じて変わります

・フォントはヒラギノ角ゴで

ースマートホンのデバイスフォントを理解して展開します。

・全ての要素を2で割り切れるサイズで作成する

ーフォントも線も図形も全て2で割り切れるサイズで作成します。

　奇数で作成すると、スマホは画面が小さいため縮小するときにぼやけてしまいます。

・PSD上での感覚で見ていてはいけない

ーPSD上でみえるもの（特にフォント）も、

　実際のスマホで見るとサイズ感が全く異なります。

　PSDで確認するのではなく、実際にjpgで書き出して、

　スマホでどのように見えるか確認する必要があります。

まとめ・感想

スマホ化をする時に私が気をつけていることをまとめさせて頂きました。

まだまだ経験は浅いので、

これから数をこなしていく中で気づくことがあれば

その時は随時更新していこうと思います。