الحرف & البناء

BTP EA Rénovation

ستة حقول، لا أكثر: النموذج هو المنتج.

السنة
2026
مدة التصميم
3 أسابيع
التقنيات
Next.js · React · TypeScript · Tailwind · Vercel
  • التصميم
  • التطوير
  • SEO المحلي
  • مسار التحويل
  • كتابة المحتوى
https://www.btp-ea-renovation.com/
الصفحة الرئيسية لموقع BTP EA Rénovation — الحرف & البناء، من إنجاز Kayzen Web
حقول للتأهيل
6
التزام معاودة الاتصال
48 ساعة
صفحات جغرافية
9+
CAPTCHA
0
نقطة الانطلاق

ما كان يجب حلّه.

السياق

حرفي من ليون متخصص في أعمال التشطيب — الطلاء، والجبس، وتكسية الأرضيات والجدران، وتجديد الحمّامات — يعمل في ليون ومنطقتها الحضرية.

القيد

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

الحل

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

التصميم والإدارة الفنية

كل خيار، وسببه.

  1. عرض السعر في الشاشة الأولى

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

  2. ستة حقول، اختير كل منها بعناية

    كل حقل يُحذف يرفع نسبة إكمال النموذج، وكل حقل يُضاف يرفع جودة التأهيل. ستة هو التوازن الذي اعتُمد: فبعدها يتجاوز التخلّي عن النموذج ما يُكسب من معلومات.

  3. قبل / بعد بدل صور الورش

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

  4. التزام معاودة الاتصال معروض بوضوح

    «معاودة الاتصال خلال 48 ساعة» التزام بالأرقام، مكتوب فوق النموذج. أما الوعد المبهم («سنرد عليكم سريعًا») فلا يطمئن أحدًا.

لوحة ألوان المشروع

  • أزرق الورشة

    #1D4E77

    البنية، الثقة

  • برتقالي السلامة

    #D9601A

    الإجراء، عرض السعر

  • رمادي الخرسانة

    #F2F3F5

    الخلفية

  • حبر

    #1C2126

    النص

النظام الطباعي

العناوين

Outfit 700

النص الأساسي

Inter 400

متين وبلا زخرفة. أرقام المساحة والمدة جدولية لتبقى محاذية في ملخّص عرض السعر.

الهندسة

ما يوجد تحت الغطاء.

  • Next.js
  • React
  • TypeScript
  • Tailwind
  • Vercel
  1. تحقّق من جهة العميل ومن جهة الخادم

    يتحقّق النموذج من المدخلات فوريًا لتسهيل التعبئة، ثم يُعاد التحقّق منها على الخادم قبل الحفظ. فالتحقّق من جهة العميل وحده يمكن تجاوزه في عشر ثوانٍ ويسمح بمرور أي شيء.

  2. مكافحة الرسائل المزعجة دون CAPTCHA

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

  3. إشعار فوري

    يُرسَل كل طلب بالبريد الإلكتروني وتظهر معلومات التأهيل كلها في عنوان الرسالة. فالحرفي يطالع هاتفه بين ورشتين: ويجب أن تتّسع المعاينة للمعلومة المفيدة.

تحسين محركات البحث

كيف يصبح الموقع قابلًا للعثور عليه.

  1. صفحة لكل دائرة

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

  2. استعلامات عن المهنة لا عن القطاع

    «دهّان مبانٍ ليون 3»، «تجديد حمّام فيلوربان (Villeurbanne)»: يبحث العميل عن مهنة وبلدية، ولا يبحث أبدًا عن «شركة بناء وأشغال عامة».

  3. ترميز HomeAndConstructionBusiness

    نوع مخصص، ونطاق عمل مُعلَن، وخدمات مُدرجة بصفتها Service. وعلى ذلك يتوقف الظهور في النتائج المحلية.

إمكانية الوصول

قابل للاستخدام من الجميع.

منذ يونيو 2025، يفرض القانون الأوروبي لإمكانية الوصول (European Accessibility Act) إتاحة الوصول الرقمي على شريحة واسعة من الخدمات الإلكترونية. نتعامل معها منذ مرحلة التصميم، لا كتدارك لاحق.

  1. نموذج متاح فعلًا

    تسميات مرتبطة بحقولها، وأخطاء يُعلَن عنها وتُربط بالحقل المعني، وترتيب تنقّل بلوحة المفاتيح مُتحقَّق منه. النموذج هو المكوّن الأكثر افتقارًا إلى إتاحة الوصول في أي موقع — وهو هنا المكوّن الوحيد الذي يهمّ.

هيكل الموقع

ما تم تسليمه.

  • الرئيسية — عرض سعر سريع
  • الخدمات (الطلاء، الجبس، الأرضيات، الحمّامات)
  • الإنجازات قبل / بعد
  • مناطق العمل — 9 دوائر + المنطقة الحضرية
  • التواصل
المنهجية

مراحل سير المشروع.

  1. التأهيل

    تحديد الحقول الستة مع الحرفي، انطلاقًا من مكالماته الضائعة.

  2. التصميم

    عرض السعر في الشاشة الأولى، ومعرض قبل/بعد، والتزام بالأرقام.

  3. التطوير

    تحقّق مزدوج، ومكافحة الرسائل المزعجة دون CAPTCHA، وإشعار.

  4. SEO المحلي

    صفحات لكل دائرة، وترميز خاص بالمهنة.

أسئلة

ما يُطرح علينا كثيرًا.

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

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

مستوى الإتقان نفسه، لموقعك.

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

مشاركة