めっちゃ参考になる！スマホデザイン特化のギャラリーサイト8選

WEBサイトを制作するときには参考をいくつか見てからイメージを膨らませる方が多いと思います。

勉強のために日頃からギャラリーサイトを眺めているという方もいるかもしれませんね。

また最近は、スマートフォン特化のサイトデザイン依頼も増えてきました。

2023年現在、スマートフォンの普及率はおよそ90％と非常に高いため、WEBサイトをデザインするときにはスマートフォン版のデザインも考慮しなければなりません。

そこで今回は、スマホデザインに特化したギャラリーサイト8つと、スマホサイトをデザインするときに知っておきたいコツをご紹介します。

ぜひブックマークして、いつでもチェックできるようにしておきましょう！

▼ ▼ 期間限定で無料プレゼント ▼ ▼

デザインをするときによく使うフリー素材イラスト。ただ、毎回イラストを探すのは大変、、、。そこでイラスト素材サイトを54個まとめた資料を作りました！無料でプレゼントしているのでぜひ受け取ってください。

プレゼントを受け取る

RWD JP（レスポンシブウェブデザインJP）

iPhoneデザインボックス

sps collection

AGTスマートフォンデザインギャラリー

SANKOU!sp

WebDesignClip

bookma!

スマホサイトをデザインするときのコツ

最後に、スマホサイトをデザインするときのコツを5つご紹介します。

デザインはシンプルにする

スマートフォンでのデザインは、できるだけシンプルにしましょう。

パソコン画面でデザインを作っているときにはつい忘れがちですが、スマートフォンの画面は想像より小さいです。

あれもこれもと詰め込んでしまうと、サイト全体がごちゃごちゃした印象に。

PC版のデザインを元にスマホ版を作る場合も、できるだけ装飾を減らしたりシンプルなデザインになるように意識してみてくださいね。

容量を軽くする

容量が重いと、サイトの読み込みに時間がかかってしまいます。

みなさんも経験があるかもしれませんが、開こうとしたページの読み込みが遅かったときはイライラしたり諦めて違うページを開いたりしませんでしたか？

サイトが重いとユーザーにストレスを与え、離脱につながる可能性も高くなるので、よく注意しましょう。

特に画像の圧縮は大切です。無料で画像を圧縮できるサイトもいくつかあるので、ぜひ活用してくださいね。

おすすめの無料圧縮サイト→iLoveIMG

ボタンは大きめに作る

先ほどもお伝えしましたが、スマートフォンの画面は想像より小さいです。

ボタンが小さいとクリック数が下がってしまうので、いつもより少し大きめに作りましょう。

また、普段ネットサーフィンをしていて、「このサイトのボタンは押しやすいな」「このくらいのボタンサイズがいいな」と思ったサイトがあればブックマークして保存しておくのもおすすめです。

今回ご紹介したギャラリーサイトにも、ボタンがついているサイトがいくつも載っているのでぜひ参考にしてくださいね。

フォントサイズは16px

スマートフォンサイトでは、16pxが最も良いフォントサイズと言われています。

それより小さいと読みづらく、大きいとスクロールが増えてストレスになるそうです。

サイトのターゲットが高齢者や小学生以下の子どもである場合は、20〜22pxくらいを使用すると見やすくなります。

また、行間のおすすめは1.5emです。

ファーストビューにとにかくこだわる

こちらはコツと呼べるかわかりませんが…スマートフォンサイト作成時は、ファーストビューにとにかくこだわりましょう。

その理由はこの2つです。

• PCサイトよりもファーストビューの範囲が小さいから
• スマホの操作ではサイト離脱がしやすいから

特に、スマートフォンサイトでは小さい画面のファーストビューでユーザーを惹きつけなければなりません。

ただPCサイトと同じファーストビューを入れるだけでは離脱される可能性が高いのです。

ファーストビュー：WEBサイトを開いたときに1番最初に目に入るエリアのことです

スマホデザイン参考サイトまとめ

今回は、スマホデザインに特化したギャラリーサイトを8つご紹介しました。

私も実際にブックマークしてよく使っているサイトです。

いまはまだデザインが半人前という方も、サイトを眺めているだけでセンスはぐんぐん身につきます。

ぜひ通勤通学の時間やちょっとしたスキマ時間に、今回ご紹介したサイトを眺めてみてくださいね！