# LaserYou: من WordPress إلى Next.js: كل صفحة علاج تُدقَّق بنتيجة 100/100/100/100.

> إعادة بناء من WordPress إلى Next.js تشمل بنية صفحات العلاجات وSEO/AEO التقني ورسماً كيانياً JSON-LD مبنياً يدوياً والحركة المهندَسة والأداء والتتبّع وتجارة قسائم الهدايا لعيادة تجميل بريطانية.

Source: https://www.truenorthmarketing.ae/ar/case-studies/laseryou-nextjs-aeo
Client: LaserYou
Published: 2026-07-15
Disciplines: تطوير الويب (Next.js), SEO وAEO التقني, البيانات المنظمة وJSON-LD, الحركة والتفاعل, هندسة الأداء, التجارة وقسائم الهدايا
Publisher: True North Marketing (truenorthmarketing.ae)

## Challenge

كان موقع عيادة LaserYou يعمل على بناء WordPress بطيء بنتائج PageSpeed برتقالية، وSEO تقني ضعيف، وفحوص جاهزية ذكاء اصطناعي فاشلة، ومن دون منظومة مترابطة لمحتوى العلاجات أو سهولة الوصول أو الحركة أو الأداء أو التتبّع.

## Approach

أعادت ترو نورث بناء الموقع بـNext.js على Vercel بمسارات ثابتة ومعروضة من الخادم، وإعادة توليد تدريجية يومية، ومحتوى علاجات مهيكل، ورسم كياني JSON-LD من عشرة مكوّنات، وملف llms.txt رئيسي مع نسخ Markdown، وطبقة حركة مهندَسة، وتحليلات مؤجلة، وقسائم هدايا PayPal من الخادم.

## Outcome

بتدقيق مباشر في 21 يوليو 2026، تعيد كل صفحة علاج ومحتوى تمريرة Lighthouse مثالية (100 في سهولة الوصول وأفضل الممارسات وSEO والتصفّح الوكيلي) مع 234 مللي ثانية LCP وإزاحة تخطيط صفرية، حتى على الصفحات الغنية بالوسائط. وتضيف الصفحة الرئيسية 100 في الأداء على PageSpeed Insights لسطح المكتب. وأبقى العميل ترو نورث على عقد صيانة بعد الإطلاق.

## What We Did

ترحيل إلى Next.js على Vercel بعرض ثابت ومن الخادم وإعادة توليد يومية، بنية صفحات العلاجات، رسم كياني JSON-LD وllms.txt، طبقة حركة وتمرير سلس مهندَسة، عمل سهولة الوصول والأداء، التتبّع، وتجارة قسائم الهدايا من الخادم.

## Full article

![موقع عيادة LaserYou بعد إعادة البناء بـNext.js](../images/case-laseryou-cover.webp)

**العميل:** LaserYou، عيادة تجميل في بيرنهام بسلاو، تخدم السوق البريطاني بإزالة الشعر بالليزر وتجديد البشرة وإزالة الوشم بـPicoSure وعلاجات SofWave منذ 2017. **النطاق:** إعادة بناء كاملة للموقع، من بناء WordPress بطيء إلى منظومة Next.js، تلاها عقد صيانة مستمر.

لم تكن LaserYou عملية تغيير مظهر. إنه موقع عيادة أُعيد بناؤه كمنظومة نشر وتحويل مهيكلة، تجمع صفحات العلاجات وSEO التقني والمحتوى المقروء للذكاء الاصطناعي وسهولة الوصول والحركة والأداء وقسائم الهدايا في بنية Next.js واحدة. أعدنا تدقيق موقع الإنتاج الحي في 21 يوليو 2026، فكل رقم هنا قِسناه بأنفسنا لا ادّعيناه.

> **دليل مقاس:** تعيد كل صفحة علاج ومحتوى على الموقع الحي تمريرة Lighthouse مثالية، 100 في سهولة الوصول و100 في أفضل الممارسات و100 في SEO و100 في التصفّح الوكيلي، مع 234 مللي ثانية لأكبر عنصر محتوى مرئي وإزاحة تخطيط صفرية، حتى على الصفحات الغنية بالوسائط. وتضيف الصفحة الرئيسية نتيجة 100 في الأداء على PageSpeed Insights لسطح المكتب.

  
  
  
  
  
  

## من بناء WordPress بطيء إلى منظومة مقاسة

كانت نقطة البداية موقع WordPress بمدوّنة قديمة كبيرة ونتائج برتقالية في كل مكان. ويصفه العميل ببساطة.

في LaserYou، احتجنا شريكاً ينقلنا من موقع WordPress بطيء إلى تجربة سريعة ومتتبَّعة ومركّزة على التحويل. أعادت ترو نورث بناء موقعنا على Next.js بواجهة وتجربة استخدام جديدة، ونظّفت التتبّع لدينا، ومنحتنا أساساً يوازي أخيراً مستوى العناية التي نقدّمها في العيادة.

تُقرأ إعادة البناء كأفضل ما تُقرأ بمقارنة قبل وبعد على المسطرة نفسها. هذه نتائج فئات PageSpeed Insights لسطح المكتب للصفحة الرئيسية القديمة والجديدة.

| PageSpeed Insights سطح المكتب | قبل | بعد |
| --- | --- | --- |
| الأداء | 77 | 100 |
| سهولة الوصول | 88 | 100 |
| أفضل الممارسات | 92 | 100 |
| SEO | 61 | 100 |
| التصفّح الوكيلي | 1 / 2 | 3 / 3 |

انتقلت كل فئة إلى المنطقة الخضراء، ويُدقَّق الموقع كله الآن بنتيجة 100 مسطّحة في فئات Lighthouse الأربع، الصفحة الرئيسية وصفحات العلاجات على حد سواء. والفئتان اللتان تهتم بهما الآلات أكثر، SEO التقني والجاهزية الوكيلية، تحرّكتا الأبعد، لأنهما الفئتان اللتان تعامل معهما بناء WordPress القديم أسوأ تعامل.

## الهندسة خلف الأرقام

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

الذكاء في كيفية ترابط القطع. محتوى العلاجات يعيش في بيانات مهيكلة لا في ترميز صفحات متناثر، فلا يمكن لاسم علاج وبياناته الوصفية وكيان مخططه ونسخة Markdown أن تنحرف عن بعضها. تأتي بيانات الصفحة من مساعدات مركزية، وتقرأ خريطة الموقع وقواعد robots من نموذج المسار نفسه، ولهذا يتماسك SEO التقني بدل ترقيعه صفحةً صفحة. تُشحن الصور بصيغتي AVIF وWebP، ويُدمَج CSS الحرج، وتُؤجَّل التحليلات الطرفية، وتحمل الأصول المُجزّأة تخزيناً ثابتاً لعام. البناء مُحصَّن بقدر ما هو سريع: HSTS مع حمايات ضد استنشاق نوع المحتوى وسرقة النقر وتسريب المُحيل وسياسة الأذونات. الخبرة في اختيار وضع العرض الصحيح لكل مسار وربط المنظومة كلها كي تعزّز السرعة والدلالات والأمان والحداثة بعضها. قالب WordPress جاهز مع حقيبة إضافات لا يستطيع فعل هذا؛ يستطيع فقط محاكاته، ببطء.

## الحركة والتفاعل، مهندَسة لا مُلصقة

حركة الموقع منظومة حقيقية، لا زينة تُضاف في النهاية. التمرير مُنعَّم بـLenis، ونص العناوين مقسَّم ومتحرك بـSplitType، والمعارض تعمل بـSwiper، وحركة المكوّنات مبنية بـFramer Motion عبر عشرة وحدات. كل طبقة من هذه تحترم `prefers-reduced-motion`، وكود الحركة مُشذَّب عبر `optimizePackageImports` كي لا تُثقل الحركة الحزمة التي تركبها.

الانضباط أن الحركة طبقة تجربة، لا شرطاً مسبقاً للقراءة. البطل والنص معروضان من الخادم ومقروءان قبل أن يعمل أي رسم متحرك، ولهذا بالضبط يسجّل التتبّع الحي LCP دون ربع ثانية مع منظومة الحركة قائمة بالكامل. الفريق الأبطأ يشحن حركة تحارب الأداء؛ هنا صُمِّم الاثنان معاً. وهذا هو العنوان الذي يفوت معظم الفرق: تمرير مُنعَّم، ونص مقسَّم، ومعارض، وعشر وحدات Framer Motion، والموقع مع ذلك يسجّل 100 كاملة عبر كل فئات Lighthouse. تتوقّف الحركة الغنية والدرجة الكاملة عن كونهما مقايضة لحظة أن تُهندَس الحركة لتبقى خارج مسار العرض الحرج.

## البيانات المنظمة وجاهزية الذكاء الاصطناعي

هنا تترك إعادة البناء نظام CMS المعتمد على الإضافات خلفها. بدل إضافة SEO عامة تدبّس الوسوم على الصفحات، يشحن الموقع رسماً كيانياً JSON-LD مبنياً يدوياً ومهيكلاً: عشرة مكوّنات مخطط تصف العيادة ككيان واحد مترابط. `MedicalClinic` بعنوان وإحداثيات جغرافية وساعات عمل ونقطة اتصال؛ وعُقَد `MedicalProcedure` و`Offer` لكل علاج وقسيمة؛ وسجلات `Person` للممارسين؛ و`JobPosting` للوظائف؛ و`FAQPage` و`BreadcrumbList` و`WebPage` و`WebSite` و`Organization` تربطها معاً. ولأن المخطط مُولَّد من المحتوى المهيكل نفسه للصفحة المرئية، لا يمكن للرسم الكياني وHTML أن يتناقضا أبداً.

والمساعدات المركزية نفسها التي تُصدر الوصفات التعريفية تُصدر أيضاً طبقة المشاركة: يشحن كل مسار بطاقات Open Graph وTwitter من نوع `summary_large_image` بصورة 1200×630، فيظهر رابط أي علاج أو قسيمة هدية كمعاينة سليمة على واتساب أو LinkedIn أو X بدل رابط عارٍ. سطح صغير يقرّر ما إذا كان الرابط المُشارَك سيكسب نقرة، ولأنه مُولَّد من المحتوى المهيكل نفسه، لا ينحرف أبداً عن الصفحة التي يشير إليها.

وفوق ذلك تجلس طبقة جاهزية للذكاء الاصطناعي لا تملكها معظم المواقع أصلاً: ملف `llms.txt` رئيسي ونسخ Markdown نظيفة لكل صفحة، فتتلقى نماذج اللغة الكبيرة نصاً قانونياً مهيكلاً دون تنفيذ سطر JavaScript واحد. لهذا تجتاز كل صفحة مدقّقة التصفّح الوكيلي 3 من 3، حيث فشل بناء WordPress القديم في تلك الفحوص صراحةً. الموقع ليس محسَّناً لجوجل فحسب؛ بل مقروء لأنظمة الذكاء الاصطناعي التي تجلس متزايداً بين العيادة ومريضها التالي، وهو بالضبط حيث يتجه البحث.

## أداء دون إزالة التجربة

يُظهر التتبّع الحي مصدر السرعة. زمن أول بايت كان منخفضاً حتى 9 مللي ثانية من حافة Vercel بـHTML مُسبق العرض، ومحتوى البطل معروض من الخادم، والتحليلات مؤجَّلة، والأدوات الثقيلة محمَّلة كسولاً، والصور تُشحن بصيغتي AVIF وWebP، والأصول المُجزّأة تحمل تخزيناً ثابتاً.

ويصمد تحت الحِمل. تُدقَّق صفحات العلاجات الغنية بالوسائط بالتمريرة النظيفة نفسها 100 كالصفحة الرئيسية، مع 234 مللي ثانية LCP وإزاحة تخطيط صفرية. هذه ليست حيلة صفحة رئيسية ولا مسار محظوظ واحد: المنظومة كلها سريعة، صفحةً بعد صفحة، وهو بالضبط ما لم يستطع بناء WordPress قديم ضمانه حين تتراكم الإضافات وباني الصفحات.

## عمل تشغيلي يتجاوز الصفحات التسويقية

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

ولم تنتهِ العلاقة عند الإطلاق. كان العميل راضياً بما يكفي لإبقاء ترو نورث على عقد صيانة مستمر، فيبقى النظام سريعاً وحديثاً ومراقَباً، بدل أن يتحلل كما يفعل تثبيت WordPress غير المُصان.

الدرس بسيط. المنظومة الحديثة المهندَسة تتفوّق على CMS قديم في كل محور يهمّ، السرعة والدلالات وجاهزية الذكاء الاصطناعي والأمان والتحكم. كان WordPress سقف الموقع القديم؛ وNext.js هو سبب تحرّك كل رقم، وسبب بقائه متحركاً.

نظام CMS قديم يحدّ سرعتك أو بياناتك المنظّمة أو ظهورك للذكاء الاصطناعي؟ [خدماتنا](/ar/services) أو [اطلب تدقيقاً](/ar/contact).