【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

ECサイト構築クラウド型プラットフォーム

【本日】誠に勝手ながら、全社員研修のため、2017年4月20日(木)の13:00以降はお電話によるサポート受付を休止させていただきます。

モバイルファーストマーケティングラボ

CVまでの導線がスムーズ!優れたUIのECサイトが行う5つの方法

CVまでの導線がスムーズ!優れたUIのECサイトが行う5つの方法

ショップ名 HERE’S
URL http://www.here-s.com/ec/
QRコード HERE'S公式サイトQRコード

サイトのUIを検証

1.選択したCOLORとSIZEに連動した在庫表示

商品詳細画面のUI
欲しい商品が見つかり、商品ページに遷移すると複数の商品COLORが設定されている商品では、画面上で欲しい色を選択します。その際、選択したCOLORに対し、SIZEと連動して在庫状況が表示され、購入可能なCOLOR×SIZEの組み合わせを一目で確認することができます。
また、在庫無しの場合は、カートに入れるボタンがタップできないようになっており、誤ってボタンを押させて余分な画面遷移をさせずに済みます。

2.決済方法によって選択肢が変動

決済方法と選択肢のUI
お届け日の希望を受け付けるにあたって「クレジットカード決済」や「代金引換決済」の場合は、お届け日の指定が可能であっても、「コンビニ決済」や「振込」関係の前払い決済の場合は、入金が確認できるまでお届け日を確定できませんよね。確定できない情報を選択できないようにするのは当然と言えば当然のUIです。この他にも決済方法によって可能は配送手段が決まっていたり、代金引換を選択された場合は宅配BOXへの配送を選択させない等、決済方法によって選択肢が変動させることができれば、色々な応用が可能になります。

3.カートステップ

カート内のUI
注文内容を確認・確定後に決済を入力する画面遷移の場合、「注文確定する」ボタンで次の決済画面に進ませるのではなく、「決済画面へ」のボタンで次の操作をさせることで、今からやろうとしているアクションを明確にさせることがでいます。「今からアクションさせる動作」をボタンの文言に表示させておくことで、購入者の戸惑いも無くなります。ちょっとした文言の工夫です。

4.動かしたい箇所だけJSを使用。シンプルなサイト構成で快適速度表示

シンプルなJAVASCRIPT
TOPページのバナー切替スライダーや、ヘッダーメニュー、ピックアップ商品の切替など、Javascriptを使用する範囲を要所要所に抑え、サイト全体はシンプルに構成されています。サイトの操作も快適で、表示速度も問題ありません。

5.スマートフォンサイト表示速度調査

表示速度計測
実際にTOPページのサイト表示速度を計測してみました。TOPページの表示速度は計測値上5.14秒ですが、ファーストビューの範囲は2秒以内に表示されました。TTFBの値も0.5秒程度、各ファイルの読み込みも1秒以内で、速度表示のパフォーマンスとしては問題無いレベルです。サイトの構築時に、「1商品でも多く表示させたい」「他のサイトでは見られない凝った作りにしたい」といった声も多くありますが、サイトの表示速度を重視させるならば、シンプルな構成にして厳選したコンテンツを表示させておくのも重要なポイントです。

次回のレビューもお楽しみに!

”スマホで売れる”ためには必須の「レスポンシブECサイト」とは?

CTA-IMAGE 2019年、ECサイトの利用者は今やスマ―トフォンからが7割を超え、市場のニーズは完全にPCからスマホに転換しました。
また、検索エンジン大手のGoogleも「モバイルファーストインデックス」を打ち出し、スマホ対応の手段として正式に「レスポンシブWEBデザイン」を推奨しています。 そのような背景から、昨今のEC市場ではスマートフォンへの適切な対応が急務となっており「レスポンシブECサイト」のニーズが非常に高まってきています。本パンフレットではECサイト運営を取り巻く環境の変化を、レスポンシブECサイト構築導入実績No.1のプラットフォームである「aishipR」の機能や実績を踏まえながらまとめました。

・レスポンシブECサイトがなぜ今選ばれるのか
・これまでのECサイトの課題とは何なのか
・どのようにすれば解決できるのか

といったノウハウから、プラットフォーム変更で得られる効果の実例まで網羅して解説しています。
ECサイトの運営されておられる経営者様だけでなく、運営担当者様にも必ずお役に立つ内容となっておりますので、是非ご活用ください。
機能のご確認はお気軽にお問合せ、もしくは2週間無料お試し利用で。
aishipRの無料体験、お問合わせはお気軽に。説明会・資料請求も受付中。
0120-173-163
0120-173-163
無料体験
  • 無料体験
  • 問合せ
  • 説明会
  • 資料請求
  • 問合せ
  • 説明会
  • 資料請求
+