ما يجب فعله وما لا يجب فعله في تصميم عربة التسوق عبر الهاتف المحمول: 6 عمليات تفكيك عملية (دليل تفصيلي للتجارة عبر الجوال)

أنت تعرف بالفعل أن صفحة عربة التسوق الخاصة بك هي ترس حيوي في آلة التجارة الإلكترونية الخاصة بك. ولكن هل صفحات عربة التسوق الخاصة بك - الصفحة التي يراها الزائرون قبل تسجيل الخروج - تسحب ثقلها؟

في Growcode ، وجدنا مرارًا وتكرارًا أن صفحات سلة التسوق هي واحدة من أكثر الأجزاء التي يتم تجاهلها في متاجر عملائنا ، خاصةً عندما يتعلق الأمر بالجوال. والعواقب وخيمة ، وتؤثر بشكل خطير على نتائجهم النهائية.

من المتوقع أن تمثل مبيعات التجارة عبر الهاتف المحمول 52.9٪ من إجمالي مبيعات التجارة الإلكترونية بحلول عام 2021. ومع ذلك ، في عام 2017 ، بلغ متوسط ​​معدل التخلي عن عربة التسوق عبر الهاتف المحمول 85.65٪.

هذا يعني أنه من بين جميع العملاء الذين أضافوا منتجًا أو منتجات إلى عربة التسوق ، غادر ما يقرب من 9 من أصل 10 دون إكمال عملية الشراء.

من المتوقع أن تمثل مبيعات التجارة الإلكترونية # 52.9٪ من إجمالي مبيعات التجارة الإلكترونية بحلول عام 2021. #EcommerceStats انقر للتغريد
يؤدي المحمول على التخلي عن عربة التسوق. تذكر أن البيانات المجمعة ، كما في الرسم البياني أعلاه ، لا تأخذ في الحسبان الاختلافات الكبيرة بين الصناعات. مصدر.
في هذا المنشور ، سنلقي نظرة على ستة أمثلة لصفحات مراجعة سلة التسوق. تستخدم الثلاثة الأولى ممارسات تصميم قوية يجب أن تفكر في تكرارها ، بينما تتضمن الأمثلة المتبقية العناصر التي من الأفضل تجنبها.

من الجدير بالذكر أيضًا أنه بينما نركز على أخطاء تصميمات معينة لعربة التسوق ، فإن هذا لا يعني أنها فظيعة تمامًا بشكل عام. دعنا نتعمق في أفضل ممارسات عربة التسوق على الأجهزة المحمولة.

1. افعل: أمازون

تعد عربة تسوق أمازون لمواقع الويب للجوال مثالًا رائعًا على تصميم عربة التسوق المحمولة بشكل جيد. إنه ليس مزدحمًا ، لكنه ليس بالحد الأدنى أيضًا. يتم تضمين جميع العناصر الضرورية ، دون لفت الانتباه بعيدًا عن CTA الرئيسي. هناك أيضًا عدد من "الوظائف الإضافية" غير المزعجة التي يمكن تحديدها لزيادة قيمة الطلب ، من تغليف الهدايا إلى العناصر ذات الصلة.
عربة تسوق أمازون للهواتف المحمولة ux. يتم تضمين كافة العناصر الضرورية.

النصيحة رقم 1: عبارة واحدة واضحة للحث على اتخاذ إجراء في الجزء العلوي من الصفحة مضبوطة بلون متباين. أثناء قيام المستخدم بالتمرير لأسفل ، تستمر عبارة الحث على الشراء هذه في الطفو في الجزء العلوي من الشاشة.

نصيحة تحسين #Mobile #cart: احصل على #CTA واحد واضح في الجزء العلوي من الصفحة مضبوطًا بلون متباين. #ecommerce #optimization انقر للتغريد
يطفو CTA في الجزء العلوي من الشاشة عندما يقوم المستخدم بالتمرير لأسفل.
النصيحة رقم 2: عبارة الحث على الشراء واسعة الشاشة لذا من السهل النقر عليها لمستخدمي اليد اليسرى واليمنى.
نصيحة رقم 3: إعادة الشحن المجاني أعلى الصفحة لتبديد أي شكوك و "حل الصفقة".
نصيحة رقم 4: رابط صور المنتج وأسماءه إلى صفحة الوصف لأولئك الذين يريدون إعادة التحقق من تفاصيل المنتج.
نصيحة رقم 5: توجد أزرار واضحة وسهلة النقر لتغيير مبلغ الطلب وحذف العناصر وحفظها في وقت لاحق.
النصيحة رقم 6: يطمئن إشعار "متوفر" العملاء بأنهم لن يضطروا إلى انتظار المنتج.
#Mobile #cart نصيحة التحسين: يطمئن إشعار "متوفر" # العملاء بأنهم لن يضطروا إلى انتظار المنتج. #ecommerce انقر للتغريد
نصيحة رقم 7: تعرض أمازون المنتجات التي تم "حفظها لوقت لاحق" ، مع زر "نقل إلى عربة التسوق" السهل أسفله.
العناصر المحفوظة لوقت لاحق مرئية بوضوح.
النصيحة رقم 8: تضمين المنتجات ذات الصلة - "تسوق العملاء أيضًا" - والتي يمكن إضافتها إلى سلة التسوق دون مغادرة الصفحة. إضافة إضافية لتصميم هذا العنصر كعنصر ثالث غير معروضة بالكامل وبالتالي تقترح حركة تمرير.
نصيحة رقم 9: الكثير من المساحات البيضاء وعدم وجود تفاصيل "حشو" غير ضرورية. قامت أمازون بتضمين ما هو ضروري للغاية فقط.
النصيحة رقم 10: رابط إلى "أعلى الصفحة" في التذييل.

هل تريد المزيد من الرؤى مثل هذا؟

احصل على نصائح واستراتيجيات التجارة الإلكترونية الأسبوعية والمعرفة الصناعية الرائدة.
سلمت مباشرة في بريدك الوارد.

في لقد قرأت سياسة الخصوصية وأوافق على شروط وأحكام الرسائل الإخبارية.

الرجاء تحديد خانة الاختيار هذه للمتابعة

رائع! لقد قمت بالتسجيل للتو. تحقق من صندوق الوارد الخاص بك لتأكيد الاشتراك.

2. افعل: المواد الغذائية الأساسية

يكمن جمال عربة Staples في بساطتها. يمكن مراجعة المنتجات في ثوان. والنتيجة هي زيادة التركيز على الخيارات التي تم تضمينها.
يكمن جمال عربة Staples في بساطتها. واحدة من أفضل عربات التجارة الإلكترونية المتنقلة.
نصيحة رقم 1: مثل Amazon ، يتم لفت الانتباه إلى حقيقة أن المنتج سيتم شحنه مجانًا ، سواء في أعلى الصفحة أو في ملخص الدفع. علاوة على ذلك ، يظهر النص باللون الأخضر ، مما يجعل الإشعار أكثر بروزًا. يتم عرض التاريخ الدقيق "للتسليم المتوقع" أيضًا.
نصيحة رقم 2: التصميم بسيط للغاية والاستخدام الممتاز مصنوع من مساحة بيضاء. يمكن للعملاء التحقق بسرعة من طلباتهم وإجراء أي تغييرات ضرورية دون مغادرة الصفحة والتحقق من الإجمالي.
نصيحة رقم 3: مربع "الكوبونات والمكافآت" غير مزعج. يتم أيضًا توفير الخيار المهم "للاستلام في المتجر" دون لفت الانتباه بعيدًا عن CTA الرئيسي.
نصيحة رقم 4: يتم تضمين كلمة "آمن" في CTA الخروج.
نصيحة رقم 5: تمت إزالة التذييل.

هل هناك خطأ ما؟ في حين أن Staples تحصل على الكثير من الصواب ، فإن إحدى المشكلات في تصميم عربة التسوق هذه هي بساطة الرأس ، والتي لا تتضمن قائمة قابلة للتوسيع أو نموذج بحث. إذا كانت الشركة تبيع منتجًا واحدًا فقط ، فقد يكون هذا حلاً قابلاً للتطبيق. ومع ذلك ، بالنسبة إلى مواقع المنتجات المتعددة ، من المفيد دائمًا منح العملاء خيار التصفح مرة أخرى إذا أرادوا ذلك.

3. هل: يحرق

تقدم Sears الكثير من الخيارات الإضافية - بما في ذلك خطط الدفع والاستلام في المتجر وخيارات الهدايا والعروض الترويجية. تعتبر عربة التسوق الخاصة بهم مثالًا جيدًا لتجار التجزئة الذين يرغبون في الجمع بين العديد من العناصر المختلفة في صفحة واحدة دون إتلاف التصميم الذي يمنع من التخلي عن عربة التسوق المتنقلة.
يحتوي تصميم عربة المحمول Sears على الكثير من العناصر ولكنه لا يزال بسيطًا.
نصيحة رقم 1: يتم تضمين CTA في الجزء العلوي من الصفحة جنبًا إلى جنب مع المجموع الفرعي. يعمل رمز القفل على بناء الثقة بشكل أكبر ويتم أيضًا تقديم خيار الدفع باستخدام Paypal.
نصيحة رقم 2: كعنصر مرتفع التكلفة ، يتم تضمين خطط الدفع لتبديد أي تردد في هذه المرحلة.
النصيحة رقم 3: يتم تضمين مدخرات البيع باللون الأحمر في قسم ملخص الطلب ، مما يشجع العملاء على النقر للمغادرة عن طريق زيادة الإلحاح وتقليل الشك.
نصيحة رقم 4: يتم توفير رابط لتسجيل الدخول إلى نظام الولاء الذي يعمل كحافز إضافي للعملاء الجدد. من المهم ملاحظة أن هذا ليس رابطًا لإنشاء حساب متجر بدون أي فوائد ، والتي من الأفضل دمجها في نموذج الخروج.
نصيحة رقم 5: يتم تضمين ختم "الخروج الآمن" في أسفل الصفحة.
هل هناك خطأ ما؟ هناك القليل جدًا ، ومن المحتمل أن يؤدي التأثير إلى تشتت الانتباه لدى بعض العملاء. ليست هناك حاجة لتقديم اشتراكات في المجلات ورابط لبرنامج الولاء في الأسفل ، على سبيل المثال.

4. لا تفعل: فيتاكوست

على الرغم من أن Vitacost يستخدم الكثير من العناصر المذكورة أعلاه ، إلا أن تنفيذها غالبًا ما يكون معيبًا. والنتيجة هي صفحة عربة التسوق سيئة التصميم والتي من المحتمل أن تشهد زيادة في تحويلات سلة التسوق مع بعض التعديلات الصغيرة.
يستخدم Vitacost الكثير من العناصر المذكورة أعلاه ولكن غالبًا ما يكون تنفيذها معيبًا.
الخطأ الأول: تضمين شريط بحث مزعج يقود الأشخاص بعيدًا عن صفحة عربة التسوق. من الجيد تضمين رمز شريط البحث (كما في مثال Amazon) للأشخاص الذين يرغبون في مواصلة التصفح. لكن لا تجعلها كبيرة جدًا.

نصيحة تحسين #Mobile #cart: لا تقم بتضمين شريط بحث اقتحامي يقود الأشخاص بعيدًا عن عربة التسوق. #ecommerce انقر للتغريد
الخطأ الثاني: التضمين التلقائي لمنتج "BOGO" غير واضح (اشترِ منتجًا واحصل على نصف السعر) والذي قد يؤدي إلى إرباك العملاء أو إزعاجهم.
MIstake # 3: شريط الرمز الترويجي المزعج . هذا يصرف الانتباه عن CTA الرئيسي ويشجع العملاء على ترك عربة التسوق للبحث عن الملل عبر الإنترنت. يجب أن تكون المربعات الترويجية مرئية ولكن ليس بشكل مفرط. يجب أن يكونوا بالتأكيد بعد CTA.
MIstake # 4: يتم تعيين تكلفة الشحن على أنها "TBD" ، مما يعزز الشك (بشكل عام ، يجب تجنب الاختصارات)
الخطأ الخامس: التذييل كبير جدًا. هل يريد Vitacost من العملاء إنهاء عملية الشراء أو تنزيل التطبيق؟
الخطأ السادس: خيارات المنتج - لإزالة العناصر أو زيادتها - صغيرة جدًا ويصعب النقر عليها.
الخطأ السابع: الشريط العائم ، الذي يمكن رؤيته أسفل لقطة الشاشة مباشرة ، يشغل مساحة كبيرة جدًا على الشاشة على الهواتف الصغيرة.

5. لا تفعل: كوكب وحيد

عندما تستخدم صفحة Staples الحد الأدنى من التصميم بشكل فعال ، تستبعد Lonely Planet عددًا كبيرًا جدًا من العناصر. لا توجد ميزات لتقليل التردد وبناء الثقة ، ولا توجد توصيات أو اقتراحات لمنتج لزيادة قيمة الشراء ، ويصعب النقر على العديد من الأزرار.
يستبعد لونلي بلانيت عددًا كبيرًا جدًا من العناصر. لقد تركوا بها مساحة كبيرة يمكن استخدامها لتحسين تدفق عربة التسوق.
الخطأ الأول: استخدام الفضاء بشكل سيء. سيكون من الأفضل أن تملأ عربة التسوق الصفحة بأكملها ، وتستخدم المساحة البيضاء ، بدلاً من النافذة المنبثقة فوق المحتوى الحالي.
الخطأ الثاني: لا يتم تضمين أي معلومات حول التسليم أو الخصومات أو خيارات الدفع. من المرجح أن تقلل هذه من الشكوك والمخاوف من العملاء غير المؤكدين.
الخطأ الثالث: لا توجد اقتراحات متعلقة بالمنتج.
الخطأ الرابع: الأزرار الخاصة بزيادة أو تقليل عدد المنتجات صغيرة جدًا بحيث لا يمكن النقر عليها تقريبًا.
خطأ # 5: لا يبدو CTA - "متابعة الخروج" - كزر.
الخطأ رقم 6: التنسيق المنبثق يجعل من الصعب النقر على CTA من اليسار. اسمح للعملاء باستخدام كل من إبهامهم!

6. لا تفعل: نايك

المشكلة الرئيسية في صفحة Nike هي الطريقة التي تم بها تضمين العناصر المختلفة بشكل عشوائي ، مع القليل من التفكير الواضح في كيفية عملها إذا تم وضعها معًا أو في نقاط مختلفة على الصفحة. هناك أيضًا ارتباك حول CTA.
تم تضمين العديد من العناصر بشكل عشوائي على صفحة Nike.
الخطأ الأول: خصومات الشحن متاحة فقط للأعضاء. هذا يضيف احتكاكًا غير ضروري ومن المرجح أن يكون بمثابة عامل مثبط لأولئك العملاء الذين لا يرغبون في الانضمام ، والذين يعتقدون أنهم يخسرون. قدم للعملاء خيار تسجيل الدخول في مرحلة الخروج ، إلى جانب خيار التسجيل لعملاء جدد. يجب أن تكون صفحة سلة التسوق مخصصة فقط لمراجعة الطلبات.

الخطأ الثاني: استخدام عبارتين للحث على اتخاذ إجراء. من الأفضل دائمًا أن يكون لديك CTA واحد على صفحات عربة التسوق لأنك تبحث عن مسار عمل محدد. السبب الوحيد لتقديم العديد من عبارات الحث على الشراء هو منح العملاء الخيار بين خيارات الدفع المختلفة. سيكون من الأفضل إظهار نموذج مناسب (إما نموذج تسجيل دخول أو نموذج عنوان) بعد أن يزودك المستخدم بعنوان بريده الإلكتروني.

الخطأ الثالث: "أنواع الدفع المقبولة" ليست مدرجة بالقرب من CTA الخروج. من الجيد تضمين هذه الشارات في صفحة عربة التسوق ، خاصة إذا لم تكن معروفًا مثل Nike ، لكن التذييل ليس هو المكان المناسب لها.

الخطأ الرابع: قد يؤدي مصطلح "ضيف" إلى الارتباك إذا لم يعرف العملاء أنفسهم بهذه الطريقة (هل يمكنك أن تصبح عضوًا إذا كنت تتسوق كضيف؟)

تغليف تصميم عربة التسوق المتنقلة

تتميز معظم صفحات عربة التسوق الأفضل أداءً بتصميم نظيف وبسيط ، ولكنها توفر أيضًا النوع والكمية المناسبة من المعلومات. أثناء قيامك بإعادة تصميم صفحتك الخاصة ، ضع في اعتبارك أن الغرض من صفحات سلة التسوق هو أن يقوم المتسوقون بمراجعة طلباتهم وتأكيدها ، وإزالة أي عناصر غير ضرورية وإضافة منتجات مماثلة. يمكن ترك أي إجراءات أخرى مطلوبة ، مثل تسجيل الدخول إلى حسابهم أو التسجيل ، لصفحة الخروج. لذا تذكر أفضل الممارسات لعربة التسوق عبر الجوال وتقنيات تحسين عربة التسوق الأخرى.

وتذكر أن اختبار الانقسام هو المفتاح! استخدم التكتيكات الموضحة هنا لتشكيل اختباراتك الخاصة والالتزام بتعديل العناصر على المدى الطويل. إذا قمت بذلك ، فمن شبه المؤكد أنك ستلاحظ زيادات ثابتة في تحويلاتك.

احصل على قائمة مراجعة تحسين التجارة الإلكترونية المكونة من 115 نقطة

بالاعتماد على ثماني سنوات من الخبرة ، قمنا بتجميع أفضل رؤيتنا في كتاب واحد: قائمة التحقق من تحسين التجارة الإلكترونية لمتجر عبر الإنترنت مكون من 7+ أرقام. إذا كنت ترغب في زيادة أداء جميع صفحاتك - من الصفحة الرئيسية إلى الخروج ، احصل على نسختك هنا.