LP(ランディングページ)デザイン参考一覧

業種・テイスト別のLP(ランディングページ)デザイン実例を毎日更新
  • PCデザイン
  • SPデザイン
登録数
No.1
PCデザイン総登録数
46,413
※弊社実績数ではありません
登録数
No.1
SPデザイン総登録数
38,881
※弊社実績数ではありません
カラーから探す
カテゴリーから探す
カラーから探す
カテゴリーから探す
MENU
求人・採用

#モバイル LPデザインまとめ

モバイル向けのランディングページ(LP)は、スマートフォンやタブレットでの見え方と操作性を最優先に設計することが重要です。ここでは傾向と制作のポイント、注意点、使いやすいモチーフと配色を紹介します。

モバイルとは?

モバイルは主にスマートフォンやタブレットで閲覧されるウェブ体験を指します。画面サイズが小さく、タッチ操作が基本となるため、情報は簡潔で視覚的に分かりやすい構成が求められます。業種としてはサービスや保険・金融、通信機器、端末やアプリ、イベントやキャンペーンなどが多く、ブルーやホワイトを基調にした信頼感のある配色や、ピンクやイエローで親しみやすさを出す表現がよく使われます。モバイル特有の文脈を踏まえ、スクロール誘導や短い導線でコンバージョンを促す設計がポイントです。

モバイルLPデザインの制作方法

まずターゲットと利用シーン(移動中・短時間閲覧など)を想定し、優先度の高い情報を上部に配置します。ファーストビューは一目で訴求が伝わる見出しとビジュアル、明確なコールトゥアクションを用意し、ボタンは親指で押しやすい大きさと位置にします。画像は軽量化して表示速度を確保し、テキストは行間とフォントサイズを考慮して可読性を高めます。フォームは入力項目を絞り、自動入力やキーボードタイプの指定で負担を減らします。さらに実機での確認やA/B テスト、アクセス環境別の検証を繰り返して改善します。

モバイルLPデザインの注意事項

読み込み速度の遅さやタップ領域の不足は離脱につながりやすいため、画像最適化や遅延読み込み、不要なスクリプトの削減を心がけます。文字が小さすぎたりコントラストが低い配色は視認性を損なうのでアクセシビリティを意識した色選びとフォント設計を行います。長文や複雑なナビゲーションは避け、フォームは段階的に分けるなど入力負荷を下げる工夫をします。ネットワーク環境が不安定な状況でも機能する設計や、プライバシーに配慮した情報提示も重要です。実機での操作感と指の届く配置を必ず確認して調整します。

<ベースカラー>
<アクセントカラー>
<テキストカラー>

#1E90FF
#FFD166
#0A0A0A

モチーフ:スマートフォンと通信アイコン

#FFB6C1
#FFFFFF
#1F1F1F

モチーフ:かわいいキャラクターと吹き出し

#0B0B0B
#00C853
#FFFFFF

モチーフ:回線と回路のクールビジュアル

モバイルICOCAならスマホで完結のLPデザイン(国内旅行・海外旅行/ブルー系/爽やか系)PC版
どくにふれるのLPデザイン(イベント・キャンペーン・体験/カラフル系/かわいい系)PC版
セットアップコレクションのLPデザイン(ファッション/ホワイト系/シンプル系)PC版
BIGLOBEモバイルキャンペーンページのLPデザイン(イベント・キャンペーン・体験/ブルー系/かっこいい系)PC版
TUTAYAのスマホTONEのLPデザイン(サービス・保険・金融/ホワイト系/シンプル系)PC版
購入者満足度大調査!パソコンのLPデザイン(サービス・保険・金融/グリーン系/かわいい系)PC版
UQ WiMAXのLPデザイン(家電・パソコン・通信機器/ピンク系)PC版
GLIDiC 3wirelessのLPデザイン(家電・パソコン・通信機器/ブルー系/かっこいい系)PC版
楽天でんきお申込みで2000ポイントのLPデザイン(イベント・キャンペーン・ギフト/イエロー系/かわいい系)PC版
破壊チャレンジキャンペーンのLPデザイン(通信・ネットワーク機器/オレンジ系/かっこいい系)PC版
200万回線突破!感謝キャンペーンのLPデザイン(サービス・保険・金融/ピンク系/にぎやか系)PC版
UQゼロ学割のLPデザイン(サービス・保険・金融/ピンク系/にぎやか系)PC版
遊戯王 デュエルリンクスのLPデザイン(本・音楽・ゲーム/ブラック系/かっこいい系)PC版
AirPAYのLPデザイン(サービス・保険・金融/ブルー系/信頼・安心系)PC版
キャッシュレス決済のLPデザイン(サービス・保険・金融/ブルー系/シンプル系)PC版
イオンモバイルキャンペーンのLPデザイン(サービス・保険・金融/イエロー系/信頼・安心系)PC版
GLIDiCのLPデザイン(家電・パソコン・通信機器/ブルー系/かっこいい系)PC版
エレコム流 オンラインSTYLEのススメのLPデザイン(インターネットサービス/イエロー系/マンガ・イラスト系)PC版
セブンティーンアイスのLPデザイン(サービス・保険・金融/カラフル系/かわいい系)PC版
タダノリキャンペーン 第二弾のLPデザイン(サービス・保険・金融/ブルー系/にぎやか系)PC版
スマホ月額基本利用料 半額キャンペーンのLPデザイン(インターネットサービス/グリーン系/シンプル系)PC版
タダ学割のLPデザイン(家電・パソコン・通信機器/レッド系/にぎやか系)PC版
東北新幹線開業35周年記念 モバイルスタンプラリーのLPデザイン(サービス・保険・金融/グリーン系/かっこいい系)PC版
brotherのLPデザイン(サービス・保険・金融/ブルー系/シンプル系)PC版
OCN モバイル ONEのLPデザイン(タブレット・スマートフォン/カラフル系/シンプル系)PC版

エヌ・ティ・ティ・コミュニケーションズ株式会社様

Category:
タブレット・スマートフォン

48

1dayインターンのLPデザイン(求人・採用関連/グレー系/かっこいい系)PC版
防災アウトドアシリーズのLPデザイン(旅行・アウトドア/イエロー系/かっこいい系)PC版
グランピングのLPデザイン(旅行・アウトドア/ブルー系/爽やか系)PC版
リファコラーゲンエンリッチのLPデザイン(健康・美容食品・サプリ/レッド系/シンプル系)PC版
マッサージ店向けクラウド型ポイントシステム|ピーカチシステムのLPデザイン(サービス・保険・金融/ブラック系/キレイ系)PC版
XZ6 ノートパソコンのLPデザイン(パソコン・周辺機器/ブルー系/シンプル系)PC版
モバイルPASMOのLPデザイン(サービス・保険・金融/ピンク系/かわいい系)PC版
デジタル名刺ビューア 「DA-1モバイル」のLPデザイン(日用雑貨/ホワイト系/シンプル系)PC版
cheeroのLPデザイン(家電・パソコン・通信機器/ホワイト系/シンプル系)PC版
cheero Energy Plus miniのLPデザイン(家電・パソコン・通信機器/ホワイト系/ナチュラル系)PC版
株式会社ディンプス 採用サイトのLPデザイン(求人・採用関連/ホワイト系/マンガ・イラスト系)PC版
通話もネットもコミコミのLPデザイン(通信・ネットワーク機器/ゴールド系/かっこいい系)PC版
モバイルスタンプラリーのLPデザイン(インターネットサービス/ブルー系/シンプル系)PC版
モバイル保険のLPデザイン(企業・会社・お店/グレー系/かわいい系)PC版
Style AthleteのLPデザイン(スポーツ/ブラック系/かっこいい系)PC版
毎月変わる!ラッキータッチキャンペーンのLPデザイン(サービス・保険・金融/イエロー系/にぎやか系)PC版
ドコモ・au・ソフトバンクユーザー全員集合!3,000ポイントバックキャンペーンのLPデザイン(インターネットサービス/カラフル系/シンプル系)PC版
年商5億円以上の店舗サポート実績!楽天・ヤフーに特化した制作会社 トップページ、商品ページ、バナーなどの制作から反映までOK!

ヒント

キャッチコピーを一覧確認

現在表示されているデザイン一覧のランディングページで使われているメインのキャッチコピーを一覧で確認する事ができ、キャッチコピー作成時の参考としてご利用頂けます。

次へ

ヒント

お気に入り登録が可能!

このサイトのランディングページデザインをフォルダ毎に分けて自分が参考になるデザインだけを集めて利用する事ができます。