21 من أفضل الأمثلة على التجارة الإلكترونية من Squarespace في عام 2023

هل تبحث عن أفضل أمثلة التجارة الإلكترونية في Squarespace لترى ما هو ممكن؟

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

من إنشاء صفحة رئيسية جذابة وصفحات منتج ثاقبة إلى عمليات الخروج السريع والتنقل الممتاز في الموقع ، كل هذا ممكن.

ولكن يمكنك اكتساب جميع أنواع الأفكار الإبداعية والوظيفية الجديدة من خلال عرض تصميمات الويب الرائعة هذه.

ملاحظة : قد تكون مهتمًا أيضًا بمراجعة قائمتنا العامة لأمثلة مواقع الويب الرائدة في Squarespace.

أمثلة على التجارة الإلكترونية في Squarespace

1. شركة الشاي المشروب

بنيت مع: Squarespace

بينما تميل شركة Brew Tea Co أكثر نحو البساطة ، فإن علامتها التجارية تجعلها حية وجذابة للانتباه (شكرًا ، أصفر!).

يحتوي موقع التجارة الإلكترونية هذا على الكثير من الميزات العملية لإنشاء تجربة تسوق ممتعة عبر الإنترنت.

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

ملاحظة: قم بتضمين علامتك التجارية بشكل استراتيجي في تصميم الويب للحصول على جو أكثر متعة ولا يُنسى.

لا تنس التحقق من مجموعتنا التي تضم أفضل ألوان مواقع الويب إذا كنت بحاجة إلى الإلهام باختيار اللوحة المناسبة.

2. Ocelot Chocolate

بنيت مع: Squarespace

تتميز Ocelot Chocolate بتصميم شبكي رائع ، وترتبط بمتجر مختلف وصفحات داخلية. رأس الصفحة وتذييلها بسيطان ، ويستخدمان نفس لون الخلفية كالقاعدة.

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

ملاحظة: أنشئ تواجدًا أكثر إتقانًا عبر الإنترنت بنفس لون الخلفية في جميع أنحاء موقع الويب بالكامل ، بما في ذلك الرأس والتذييل.

3. خارق للطبيعة

بنيت مع: Squarespace

لدى Supernatural صورة بطل كبيرة مع تأثير اختلاف المنظر ، مما يخلق انطباعًا أولًا جريئًا. الرأس شفاف بنسبة 100٪ ، وبالتالي تنبثق الصورة أكثر.

علاوة على ذلك ، ستجد موجز Instagram متكامل ، والذي يفتح منشورات الصور في علامة تبويب جديدة ومشاركات الفيديو في نافذة جديدة.

يستخدمون أيضًا رسالة إخبارية منبثقة للترويج لخصم مقابل رسالة بريد إلكتروني.

ملاحظة: أضف المزيد من المحتوى وأظهر مدى كونك اجتماعيًا مع موجز IG.

4. جونز بار- BQ

بنيت مع: Squarespace

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

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

ملاحظة: قم بإنشاء رأس يختفي / يظهر مجددًا لجعل التمرير خاليًا من الإلهاء بينما لا يزال التطبيق العملي لقائمة عائمة موجودًا.

5. مينا

بنيت مع: Squarespace

مثل Supernatural ، تستخدم Minna أيضًا صورة اختلاف المنظر الضخمة فوق الطية التي تثير الاهتمام بلا شك.

ثم يستخدمون أقسامًا متعددة الألوان لتقديم منتجاتهم ، مع أزرار CTA للطلب عبر الإنترنت. الرأس سهل للغاية ، بينما يعرض التذييل أربعة روابط سريعة ورموز اجتماعية ونموذج اشتراك.

ملاحظة: قسم البطل الخاص بك لا يجب أن يكون مبيعات - دع الصورة (مع تأثير المنظر) تقوم بالحديث.

6. Soilboy

بنيت مع : Squarespace

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

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

ملاحظة: استخدم المساحة البيضاء لتقليل الضغط على العين وجعل موقع الويب أكثر قابلية للقراءة.

7. بيتر ماكينون

بنيت مع : Squarespace

يعد Peter McKinnon مثالًا رائعًا على موقع ويب للتصوير به متجر عبر الإنترنت. تحتوي الصفحة الرئيسية على أقسام صور متعددة مع تأثير اختلاف المنظر الذي يتيح لك الانغماس في المحتوى دون أن تدري.

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

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

8. ليزا مالتبي

بنيت مع : Squarespace

Lisa Maltby هو موقع ويب بسيط للفنان به محفظة ومتجر عبر الإنترنت.

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

ملاحظة: تعد المشاهدة السريعة ميزة ممتازة يمكنها تحسين تجربة المستخدم الإجمالية لموقع التجارة الإلكترونية الخاص بك.

9. كوزميك

بنيت مع: Squarespace

يمزج Cosmik بين الألوان الزاهية وتأثير المنظر وأزرار CTA السوداء لضمان أن عناصرها في مركز الاهتمام. دائماً.

يلتصق الرأس والتذييل بتصميم Cosmik السلس ، مع بقاء الأخير عائمًا لذلك لا تحتاج إلى التمرير مرة أخرى إلى الأعلى للوصول إلى روابط القائمة.

ملاحظة: يعد العنوان / القائمة اللاصقة حلاً رائعًا آخر للمساهمة في تجربة مستخدم أفضل.

10. AAKS

بنيت مع: Squarespace

AAKS هو مثال حديث وأنيق للتجارة الإلكترونية من Squarespace يقوم بتحميل المحتوى على التمرير ، مع الكثير من المساحات البيضاء لإمكانية عرض وقراءة أفضل.

إنه تمثيل آخر لرأس يختفي / يظهر مجددًا (فقط أن AAKS يحتوي أيضًا على شريط علوي ، والذي يمكنك إغلاقه بالضغط على "x").

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

ملاحظة: لا تخف من استخدام المقاطع السوداء ، حتى لو كانت الدرجات الفاتحة هي السائدة.

11. ملولا

بنيت مع: Squarespace

Melula هي لعبة جميلة وجذابة ، مع تصميم ويب سريع الاستجابة غير لطيف يبقي عينيك ملتصقتين بالشاشة.

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

علاوة على ذلك ، يحتوي إشعار الشريط العلوي على لون متباين لضمان عدم تفويته (ولكن يمكنك أيضًا إغلاقه إذا كان يصرف انتباهك).

ملاحظة: استخدم الشريط العلوي للإشعارات ، مثل الشحن المجاني ، وإسقاط المنتجات الجديدة ، والصفقات الخاصة ، وما إلى ذلك.

12. Shhhowercap

بنيت مع: Squarespace

يستخدم Shhhowercap منزلق ملء الشاشة يجمع صورة وشريحة فيديو لجعلها أكثر جاذبية.

علاوة على ذلك ، في حين أن بعض أمثلة التجارة الإلكترونية في Squarespace تحتوي على 0 عناصر مثبتة ، فإن Shhhowercap بها 4: رأس ، وزر من أعلى إلى أعلى ، وأداة دردشة وزر اشتراك.

أضافوا أيضًا شريط تمرير شهادات العملاء للإثبات الاجتماعي ودمجوا موجز IG مع زر "متابعة".

ملاحظة: قم ببناء الثقة والتحقق من الصحة من خلال دمج الشهادات والمراجعات في متجرك عبر الإنترنت.

13. متجر الأصدقاء الخيالي

بنيت مع: Squarespace

الصفحة الرئيسية لـ Fancy Friend Shop هي صفحة متجر بها روابط فئة أسفل العنوان إذا كنت تبحث عن شيء أكثر تحديدًا.

ومع ذلك ، يمكنك أيضًا النقر فوق أيقونة قائمة الهامبرغر ، والتي تقوم بتحريك أزرار التنقل والوسائط الاجتماعية من اليسار.

هناك ميزة أخرى تستحق المحاولة (إذا تلقيت الكثير من الرسائل غير المرغوب فيها) وهي إضافة reCAPTCHA إلى نموذج الاشتراك الخاص بك.

ملاحظة: اجعل رأسك أكثر نظافة باستخدام أيقونة قائمة الهامبرغر التي تكشف عن التنقل عند النقر.

14. بروجيكت جليتر

بنيت مع: Squarespace

يتميز Projekt Glitter بتصميم نابض بالحياة يتناسب مع الاسم والمنتجات. نتحدث عن العلامات التجارية الرائعة!

بينما تستخدم بعض مواقع التجارة الإلكترونية من Squarespace شهادات العملاء ، تستخدم Projekt Glitter قسم "كما هو موضح في" مع شعارات العديد من السلطات البارزة.

ويستخدمون أداة دردشة (مباشرة) (مع إجابات فورية) في الزاوية اليمنى السفلية من الشاشة لضمان خدمة العملاء النهائية.

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

15. حصاد الجياع

بنيت مع: Squarespace

موقع Hungry Harvest الإلكتروني يحتوي على رسومات وأيقونات مخصصة تنعشها لتجربة تصفح وتسوق ممتعة.

تحتوي الصفحة على مخطط ألوان ترابي ممتع للغاية يجعل استكشافها أكثر إثارة.

علاوة على ذلك ، نظرًا لأن Hungry Harvest تقدم طعامًا طازجًا ، فإنهم يطلبون منك أولاً إدخال عنوانك لمعرفة ما إذا كانوا يقومون بالتوصيل إلى منطقتك (ولكن فقط عندما تزور صفحة متجرهم). هذا يوفر وقت الطرفين.

ملاحظة: استخدم رسومات وأيقونات مخصصة خاصة بعلامتك التجارية لإضفاء لمسة شخصية.

16. معركة الفأس

بنيت مع: Squarespace

نظرًا لأننا ركزنا على هذه القائمة لأفضل أمثلة التجارة الإلكترونية من Squarespace على المنتجات المادية ، فإن Battle Axe تقدم كلاً من العناصر الرقمية والمادية.

التصميم مرتب ولكن بخلفيات داكنة وخفيفة والعديد من الرسوم المتحركة والعناصر المتحركة التي تجعله أكثر جاذبية.

واحدة من أكثر الميزات فائدة هي نافذة الخروج المنبثقة التي تظهر بعد النقر فوق الزر "اشتر الآن". الخروج السريع ، إذا صح التعبير.

ملاحظة: قم بإنشاء عملية دفع بسيطة قدر الإمكان حتى لا تثبط عزيمة المشتري المحتمل.

17. طرفة

بنيت مع: Squarespace

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

إلى جانب روابط التنقل ، توجد أيضًا رموز اجتماعية وزر CTA للانتقال مباشرة إلى المتاجر (يفتح متجر Amazon في علامة تبويب جديدة).

ملاحظة: أضف زر الحث على اتخاذ إجراء إلى العنوان إذا كنت تريد المزيد من النقرات إلى متجرك عبر الإنترنت.

18. ملابس واعية

بنيت مع: Squarespace

يبدأ موقع Conscious Clothing الأنيق بشريط إشعار شحن مجاني ، متبوعًا برأس شفاف وصورة بطل كبيرة مع نص و CTA حساس للمؤشرات.

تستخدم الملابس الواعية صورًا أكبر ونصًا سهل القراءة وتذييلًا مبسطًا مع الكثير من الروابط السريعة والرموز الاجتماعية ونموذج الاشتراك.

تحتوي جميع صفحات المنتج على معرض رائع ومراجعات وتقييمات مع وصف تفصيلي يبسط اتخاذ القرار النهائي.

ملاحظة: قم بإنشاء تذييل عملي يحتوي على روابط ووسائط اجتماعية ونماذج وما إلى ذلك.

19. الصدأ ومايو

بنيت مع: Squarespace

تجعل خلفية Rust & May البيضاء بالكامل ، بما في ذلك الرأس والتذييل ، جميع المنتجات أكثر إشراقًا.

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

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

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

20. أعمق اليابان

بنيت مع: Squarespace

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

كل صورة مصغرة لصورة منتج لها تأثير تحوم ، حيث تعرض صورة ثانوية وزر "عرض سريع".

ولكن ما يميز هذا المتجر هو صفحات المنتج ، وذلك بفضل العرض التقديمي المخصص ، بما في ذلك الفنان الذي يقف وراء العمل.

ملاحظة: قم بإنشاء عروض تقديمية شفافة ومتعمقة للمنتج تتمتع بشخصية مضافة لتحسين المبيعات.

21. سكوير ستوديو

بنيت مع: Squarespace

SquareStudio هو متجر حصري عبر الإنترنت يبيع مكونات Squarespace الإضافية. يتميز بتصميم داكن جميل ، يبدأ بالنص والإحصائيات لإثارة الاهتمام.

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

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

ولإضفاء الإثارة على الأشياء ، يستخدم SquareStudio مؤشرًا مخصصًا.

ملاحظة: هل تريد أن يبدو موقعك أكثر تميزًا؟ استخدم تصميمًا غامقًا. هل تريد إضافة عنصر رائع سيلاحظه الجميع؟ قم بإنشاء مؤشر مخصص.