وكالة ويب & SEO

Kayzen Web

موقع الوكالة هو أول مرجع لها: ويخضع لتدقيق أشد صرامة من مواقع العملاء.

السنة
2026
مدة التصميم
تحسين مستمر
التقنيات
React · Vite · Tailwind · TypeScript · Vercel
  • الاستراتيجية
  • نظام التصميم
  • التطوير
  • SEO
  • إتاحة الوصول
  • التحرير
زيارة الموقع(علامة تبويب جديدة)ناقش معنا مشروعًا مماثلًا
https://www.kayzen-lyon.com/
الصفحة الرئيسية لموقع Kayzen Web — وكالة ويب & SEO، من إنجاز Kayzen Web
إتاحة الوصول في Lighthouse
100/100
SEO في Lighthouse
100/100
مسارًا مُصيَّرًا مسبقًا عند البناء
79
عملًا موثَّقًا، لكل منها دراسة حالة
37
نقطة الانطلاق

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

السياق

kayzen-lyon.com هو الموقع التعريفي للوكالة: 79 مسارًا مُصيَّرًا مسبقًا، منها 21 صفحة خدمة، و4 صفحات جغرافية، وجدول أسعار علني، وسجل تغييرات (changelog)، وصفحة للحزمة التقنية، ونظام تصميم مفتوح.

القيد

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

الحل

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

نتائج مقيسة لا مُعلنة

النتائج المسجّلة عند التسليم.

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

PageSpeed
87
الأداء: 87 من 100
100
إمكانية الوصول: 100 من 100
100
أفضل الممارسات: 100 من 100
100
تحسين محركات البحث: 100 من 100
التصميم والإدارة الفنية

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

  1. نظام تصميم موثَّق وعلني

    رموز الألوان (tokens)، وسلّم طباعي مرن، وأربعة مستويات من الظلال، وإيقاع عمودي موحَّد. تعرضها صفحة /design-system. والنظام المرئي نظام لا ينحرف.

  2. التباين مقيس بالكامل

    حُسب كل زوج لوني. تبلغ حدود الحقول 3:1، وحلقة التركيز مفصولة عن لون الإجراء لتبقى ظاهرة على زر ملوَّن، وأُلغيت التدرجات اللونية في النصوص لصالح ألوان مصمتة.

  3. حركات دخول فقط

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

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

  • كحلي

    #1F3B61

    العناوين، الهيكل

  • طيني محمر (تيراكوتا)

    #B7481F

    الإجراء — 5.3:1 على الأبيض

  • أبيض

    #FFFFFF

    سطح الصفحة

  • رمادي بارد

    #F8FAFC

    أقسام متناوبة

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

العناوين

Outfit 800

النص الأساسي

Plus Jakarta Sans 400

عائلتان متغيّرتان مستضافتان ذاتيًا، بإعداد font-display: optional — لا أي إزاحة في التخطيط عند التحميل.

الهندسة

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

  • React
  • Vite
  • Tailwind
  • TypeScript
  • Vercel

  1. كل المسارات مُصيَّرة مسبقًا عند البناء

    تقدّم تطبيقات الصفحة الواحدة (SPA) ملف HTML نفسه لكل عناوين URL: فتبقى البيانات الوصفية الخاصة بكل صفحة غير مرئية لأي روبوت لا ينفّذ JavaScript. يزور سكربت تصيير مسبق كل مسار ويكتب ملف HTML كاملًا — العنوان، والوصف، والرابط المرجعي (canonical)، وOpen Graph، وJSON-LD.

  2. البناء يرفض المرور عند وجود خلل

    يفشل البناء إذا افتقر مسار إلى بياناته الوصفية، أو إذا فقدت صفحة 404 وسم noindex، أو إذا تجاوزت صورة 1440 px، أو إذا كانت CSP متقادمة، أو إذا وصلت عبارة «يُستكمَل لاحقًا» إلى HTML الناتج. الضوابط الآلية خير من اليقظة.

  3. تقسيم الشيفرة حسب المسار

    كل صفحة chunk مستقل، بما فيها الصفحة الرئيسية. لا مبرر لأن تُنزّل صفحةُ الإشعار القانوني مكتبةَ الحركة الخاصة بالصفحة الرئيسية.

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

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

  1. مدخل لكل نيّة بحث

    17 صفحة خدمة و4 صفحات جغرافية، تستهدف كل منها استعلام بحث مختلفًا. لا صفحة منها نسخة معدَّلة الكلمات المفتاحية من أخرى: إنها محتويات مختلفة.

  2. بيانات منظَّمة متّسقة

    Organization وLocalBusiness وProfessionalService وWebSite وWebPage وBreadcrumbList، مترابطة كلها عبر @id. حُذفت التكرارات المتناقضة — فمساران للتنقل متنافسان على عنوان URL واحد أفضل من لا شيء، ولكن بفارق ضئيل.

  3. لا تقييم ذاتي

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

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

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

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

  1. 100/100 في Lighthouse، وتدقيق يدوي

    رابط تخطٍّ، وتركيز يُنقَل ويُعلَن عند كل تغيير مسار، وأهداف لمس بحجم 44 px، ووضع تباين معزَّز، ووضع OLED، وخط ملائم لعسر القراءة، كلها متاحة في لوحة مخصصة.

هيكل الموقع

ما تم تسليمه.

  • الرئيسية
  • 17 صفحة خدمة
  • 4 صفحات جغرافية
  • معرض الأعمال و37 دراسة حالة
  • الأسعار، والإعانات، والاختبار التفاعلي، والمواعيد
  • الحزمة التقنية، ونظام التصميم، وسجل التغييرات
  • الصفحات القانونية
المنهجية

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

  1. نظام التصميم

    الرموز، والتباين، والسلّم الطباعي، والظلال.

  2. المحتوى

    17 خدمة، و4 مناطق، وأسعار علنية.

  3. SEO التقني

    التصيير المسبق، والبيانات المنظَّمة، وخريطة الموقع (sitemap)، وضوابط البناء.

  4. التحسين المستمر

    عمليات تدقيق متتالية مسجَّلة في سجل التغييرات العلني.

أسئلة

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

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

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

أعمال أخرى

العودة إلى أعمالنا

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

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

حجز موعدعرض الأسعار
مشاركة