تخطي إلى المحتوى

Maison Mélitsa: متجر خفيف وسريع للكاس البلدي المنفوخ بالفم

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

الكاس البلدي الذي نجده في كل دار مغربية، بفقاعاته الصغيرة ولونه الأخضر الخفيف، أصبح اليوم يُباع على موائد فرنسية. متجر Maison Mélitsa أسسته جولييت، ويعرض كؤوساً وأباريق من الزجاج المعاد تدويره منفوخة بالفم، وسلالاً من الدوم والقش، وأواني فخارية، وقطعاً من الخشب الخام. كل القطع من صنع حرفيين مغاربة، من بينهم حسن في وادي أوريكا. التوصيل داخل فرنسا القارية فقط.

لماذا بدأنا بالسرعة؟

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

قسم الكؤوس في متجر Maison Mélitsa: كؤوس بلدية بالأزرق الكوبالتي والأخضر والعنبري والشفاف
قسم «Verres»: صور كبيرة لكؤوس بالأزرق الكوبالتي والأخضر والعنبري والشفاف، ومع ذلك تبقى الصفحة خفيفة.

صفحات جاهزة قبل وصول الزائر

المتجر مبني بإطار Next.js في وضع التصدير الثابت. معنى ذلك أن صفحات المنتجات والأقسام تُولَّد مسبقاً وتُحفظ على الخادم كملفات HTML جاهزة، فلا يحتاج الخادم إلى سؤال قاعدة البيانات في كل زيارة.

بقي مشكل واحد: المؤسِّسة تعدّل العناوين والأقسام من لوحة التحكم، وكانت هذه التعديلات تظهر في المتصفح فقط، بينما يقرأ Google النسخة القديمة. الحل كان دمج التعديلات في الصفحات نفسها عند كل بناء، ثم تحميل آخر تغيير مباشرة في المتصفح. هكذا يرى محرك البحث نفس العنوان ونفس مسار التنقل اللي كتشوفهم الزبونة.

أرقام قسناها بأنفسنا

يوم 8 أكتوبر 2026 قسنا الصفحة الرئيسية من جهازنا بأداة curl، وهي طريقة بسيطة يستطيع أي أحد تكرارها:

  • حجم ملف HTML المنقول: حوالي 28 كيلوبايت، مضغوط بصيغة Brotli.
  • زمن وصول أول بايت: حوالي 0.19 ثانية، في ثلاث محاولات متتالية.
  • 39 صورة بصيغة WebP في الصفحة الرئيسية، منها 25 لا تُحمَّل إلا عندما يقترب منها الزائر أثناء التمرير.

هذه أرقام قياس وليست نقطة في اختبار مخبري. لا ندّعي أكثر مما قسناه.

الصور: هنا يضيع الوقت عادة

أداة قص الصور التي تستعملها المؤسِّسة كانت تُحمَّل من خادم خارجي. عندما شددنا سياسة أمان المحتوى (CSP) توقفت الأداة عن العمل. بدل أن نفتح الباب لخادم خارجي، وضعنا المكتبة على نفس النطاق. ونفس المنطق طبقناه على العلامة المائية: تُعاد دائماً انطلاقاً من الصورة الأصلية، فلا تتراكم علامتان على صورة واحدة عند تغيير مكانها.

صفحة منتج إبريق بلدي على شاشة هاتف عرضها 390 بكسل مع شريط تنقل سفلي
صفحة منتج على الهاتف (عرض 390 بكسل): معرض صور قابل للتمرير وشريط تنقل في الأسفل.

أمان لا يُبطئ الموقع

سياسة CSP في المتجر لا تسمح إلا بسكريبت خارجي واحد، هو سكريبت Stripe. الدفع يتم في صفحة Stripe المستضافة مع التحقق 3D Secure، فرقم البطاقة لا يمر أبداً من خادم المتجر. وتُلزم ترويسة HSTS المتصفح باستعمال HTTPS دائماً. كل هذا لا يضيف أي وزن للصفحة: مجرد أسطر في ترويسات الاستجابة.

باش Google يفهم المتجر

كل صفحة منتج تحمل بيانات منظمة من نوع Product: السعر، ومصاريف الشحن، وسياسة الإرجاع خلال 14 يوماً. خريطة الموقع مُرسلة إلى Google Search Console وإلى Bing Webmaster Tools، والصفحات الجديدة يُبلَّغ عنها عبر IndexNow. وهناك أيضاً ملف منتجات لـ Google Shopping كان يضم 51 منتجاً يوم القياس. يمكنك أن ترى النتيجة في صفحة كؤوس البلدي المنفوخة بالفم.

وماذا عن مشروعك في المغرب؟

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

بطاقة المشروع

العميل
Maison Mélitsa، فن المائدة والديكور المغربي
الإطلاق
غشت 2026
التقنيات
Next.js بتصدير ثابت، PHP، Stripe
الأدوات
Google Search Console، Merchant Center، Bing Webmaster Tools، IndexNow
الاستضافة
O2Switch في فرنسا

تحدث معنا عن متجرك كل الإنجازات

الرئيسية الخدمات واتساب الأعمال اتصل