大阪ホームページ制作.com > ホームページ制作 > スマホサイトのデザインはどうすればいい？おすすめのスマホサイトデザイン集

2019/01/05

スマホサイトのデザインはどうすればいい？おすすめのスマホサイトデザイン集

ホームページ制作にあたって、スマホが普及している現代だからこそスマホサイトはとても大切です。

スマホで調べたり、スマホからアクセスする人が多いので、スマホサイトの影響力は計り知れないものとなります。

そこで、スマホサイトのデザインをお洒落にするために参考にできるようなギャラリーサイトを紹介します。

スマホサイトのデザインに煮詰まっている人は、必見です。

１．スマホサイトのUIで意識すべきポイント

UIとは、WEBサイトやスマホサイトをPCやスマホで見ている時に、その画面上で見られる情報の全てをUIと言います。

スマホサイトの制作にあたり、UIを意識して設計する必要があるのですが、デザインだけでなく基礎として押さえておきたいポイントを知っておきましょう。

①：回線速度に要注意

スマホサイトでは、LTEや４G回線を利用してアクセスしている可能性があります。

そうすると、サイト自体が重いとなかなか開かないためユーザーはストレスを感じて閲覧を止めてしまう可能性があるのです。

そのためには、スマホサイトであるということを考慮した上で回線の速度を考えた画像の選定を行いましょう。

表示される画像をできるだけ厳選して、サイト自体を軽くする必要があるのです、

②：指でタッチしやすいかどうか

PCサイトとスマホサイトの大きな違いは、ユーザーが画面を直接タップしたりスクロールして画面を見るという点です。

そのため、リンクを貼る場合には、指でタップしやすい構成を考えなくてはいけないのです。

デザインだけでなく、リンクを貼る位置やサイズなどによってタッチしやすいかどうかは変わってきます。

③情報を絞る

ホームページ制作では、情報が多くコンテンツ量がたくさんあるサイトが良いとされています。

しかし、スマホサイトは見える範囲が小さいため、ある程度情報は絞らなくてはいけません。

あまりに情報量が多い場合には、ユーザーが混乱してしまいます。

ユーザーがどういったものを求めているのか考えた上で必要な情報を絞り、スマホからでも見やすいサイトにする必要があるのです。

２．おすすめのスマホサイトのギャラリー集

それでは、スマホサイトの制作にあたって参考にすることができるようなギャラリーサイトを紹介していきます。

それぞれギャラリーサイトにも特徴があるので、自分の作りたいスマホサイトに合うようなギャラリーサイトを参考にしてみてください。

①：AGT

http://agtsmartphonedesign.com/

AGTは国内外問わずにスマホサイトのデザインが常時約300種類掲載されています。

豊富なデザインの中から、色や種類ごとにタグ付けされているため、検索もしやすいことが特徴です。

1つ1つのサイトデザインが大きく表示されているので非常に見やすく、気になるスマホサイトにマウスオーバーすると自動で縦スクロールされています。

そのため、ページをスクロールしたり、クリックしなくても気になるスマホサイトのデザインの全貌を見ることができます。

②：iPhoneDesignBox

http://design.web-hon.com/

海外のスマホサイトもありますが、主に国内のスマホサイトが集められているサイトです。

シンプルで見やすいながらもスタイリッシュさもあるようなデザインのスマホサイトが集められています。

類似デザインや人気デザインなどが一覧表示されるので、目的のデザインを見つけやすくなっています。

コンテンツが充実していることも特徴で、スマホサイトの制作に役立つような情報も得られるのが嬉しいポイントです。

③：スマートフォンサイト集めました

http://sp-web.jp/

400種類近くのスマホサイトが集められており、最新のスマホサイトが出る度に更新されているので最新デザインまで閲覧できます。

カラーだけでなく業種別にカテゴリ分けされているので、自身のスマホサイトの目的に近いサイトを見つけやすくなっている点がおすすめです。

サイト自体が分かりやすいので、初心者の人でも参考にしやすいでしょう。

デザインごとにユーザー評価もついているので、客観的な意見も知ることができます、

④：lovely ui

http://www.lovelyui.com/

日本ではなくて、海外のスマホサイトから新しいインスピレーションを取り入れたいという人におすすめのデザイン集です。

海外スマホサイト専門に集められており、WEBサイトのトレンドを押さえたサイトが中心になっています。

トレンド感があることから、若年層向けのデザインが多いので、若年層をターゲットにしたい場合にはおすすめでしょう。

⑤：SPS collection

https://spscollection.com/

デザイン性に優れたスマホサイトが集められており、カテゴリやカラーから検索することができます。

Detailボタンをクリックすれば、大きく表示されるので詳細まで確認することができます。

ブックマーク機能があるので、後から気になるスマホサイトのデザインを選別しやすいところが魅力です。

３．まとめ

スマホサイトは、これから更にスマホの普及によって活性化されていくと考えられます。

そのため、独自のスマホデザインにすることで他のサイトとは差別化することができ、アクセスを伸ばせる可能性が高まります。

どういったデザインにすべきかギャラリーサイトを参考にしながら、基本的なUIを押さえたスマホサイトを作りましょう。

バナーデザインについては以下をご覧ください。