أنشئ موقعًا يركز على الاتصال وWhatsApp لنشاط خدمات محلي، مع صفحات مناطق حقيقية وبيانات NAP مطابقة لـ Business Profile الخاص بك

استخدم اتصالي بـ Opus Growth لهذا الغرض. إذا لم تجد الأداة التي تحتاجها، فابحث بين أدوات Opus Growth (باستخدام search_tools إن كانت في قائمتك)؛ وإذا تعذّر عليك الوصول إلى الأدوات تمامًا، فلا تخمّن وأخبرني. أنشئ موقعًا جديدًا لنشاطي من الصفر على خادم الاستضافة الخاص بي [اسم الخادم]. التفاصيل: 1. اسم النشاط: [اسم النشاط]، المجال: [سبّاك / حدّاد أقفال / خدمة تكييف / غير ذلك] 2. اسم Business Profile أو النطاق: [اسم Business Profile] 3. الخدمات (لكل خدمة صفحتها الخاصة): [الخدمات] 4. الأحياء التي أخدمها ومكان ورشتي: [الأحياء]، [موقع الورشة] 5. الهاتف: [الهاتف]، WhatsApp: [WhatsApp]، العنوان: [العنوان، أو "أخفي عنواني"]، ساعات العمل: [الساعات] 6. النطاق: [النطاق]، تفضيل اللون: [تفضيل اللون]، صور حقيقية: [مكان الصور، أو "لا توجد"] 7. الأعمال التي لا أقوم بها: [الخدمات غير المقدمة] اقرأ أولًا قائمة [اسم Business Profile] باستخدام gbp_location_details. قارن في جدول واحد الاسم والهاتف والعنوان والموقع الإلكتروني وساعات العمل والفئة الرئيسية والخدمات ورابط الخريطة بما قدمته لك. إذا وُجد اختلاف، اسألني أيهما الصحيح، ولا تغيّر أي شيء في Business Profile. استخدم في الموقع الاسم والعنوان والهاتف تمامًا كما هي مكتوبة في Business Profile. إذا كانت القائمة تخفي العنوان، فلا تعرض عنوان شارع في الموقع واكتفِ بذكر مناطق الخدمة. خذ الإحداثيات من دبوس الخريطة في القائمة فقط، ولا تخمّنها أبدًا. اختر النوع الفرعي لـ LocalBusiness في schema بحسب الفئة الرئيسية (Plumber وLocksmith وHVACBusiness وElectrician وهكذا). ثم تأكد من الخادم باستخدام list_servers، واستدعِ scaffold_site مع style="service" وconfirm=false أولًا لعرض ما سيتم استبداله، ونفّذه مع confirm=true بعد موافقتي. اقرأ site_design_guide وsite_seo_guide. قبل كتابة الكود، اكتب قرار التصميم في _kaynak/ART.md واعرضه علي: تخطيط سويسري بسيط، وخط عناوين grotesk سميك من Fontshare (مثل Cabinet Grotesk 800) مع خط نصوص بسيط (مثل General Sans 400 و600)، وخلفية بيضاء مائلة للرمادي، ونص كحلي داكن، ولون إشارة واحد بتباين لا يقل عن 4.5:1 مع النص الأبيض، ولون أخضر منفصل لـ WhatsApp. العنصر المميز هو زوج من الأزرار الكبيرة المثبتة أسفل الشاشة على الجوال: "اتصل الآن" و"راسلنا عبر WhatsApp". الصفحات وschema: 1. الرئيسية: تقول الشاشة الأولى في جملة واحدة ما تقدمه وما الأحياء التي تغطيها، مع زرّي الاتصال وWhatsApp وساعات العمل. ثم بطاقات الخدمات وبطاقات الأحياء وخطوات الزيارة وأسئلة شائعة من 4 أسئلة. Schema: WebPage وFAQPage. 2. صفحة للخدمات وصفحة لكل خدمة: تجيب الفقرة الأولى مباشرة عن "ماذا تفعلون وكيف"؛ ثم الأعراض وخطوات العمل في الموقع ومتى تكون الحالة طارئة وكيف يُحدد السعر (دون اختلاق أرقام) و3 أسئلة شائعة خاصة بالصفحة والكاتب والتاريخ. Schema: Service (provider هو #business وareaServed هي الأحياء) وFAQPage. 3. صفحة منطقة لكل حي. يجب ألا تكون نسخًا مع تبديل اسم المدينة فقط. تتضمن كل صفحة أسماء أحياء تلك المنطقة، وأكثر الأعطال التي تصادفها هناك بحسب طبيعة المباني المحلية (جدول تختلف صفوفه من حي إلى آخر)، وملاحظة عن التنقل ومواقف السيارات، والمسافة من الورشة، وسؤالين شائعين خاصين بذلك الحي وروابط إلى المناطق الأخرى. اكتب 300 كلمة على الأقل من نص أصلي؛ وإذا وجد فحص التكرار في seo-check تداخلًا يزيد على 50 بالمئة بين صفحتي منطقة، فأعد كتابتهما. لا تنشئ صفحة لحي لا أخدمه فعلًا. Schema: AdministrativeArea (containedInPlace المحافظة وcontainsPlace الأحياء) وService وFAQPage. 4. من نحن: من أنت وكيف تعمل وبأي معدات وما الأعمال التي لا تقبلها. Schema: AboutPage وPerson إذا أعطيتك اسمًا حقيقيًا. 5. اتصل بنا: NAP وساعات العمل ورابط "احصل على الاتجاهات" ونموذج WhatsApp. Schema: ContactPage مع mainEntity هو #business. 6. صفحة إشعار الخصوصية وصفحة 404. بلا اختلاق: لا تكتب مراجعات أو تقييمات أو جوائز أو شهادات أو أعداد عملاء أو ادعاءات مثل "الأفضل" غير حقيقية. لا تضف إلى schema أو النص ساعات عمل أو إحداثيات أو أسعارًا أو بريدًا إلكترونيًا لم أعطك إياها؛ اترك الحقل وأدرجه كمعلومة ناقصة في التقرير. لا تستخدم شرطات طويلة ولا شعارات جاهزة، واجعل الفقرة الأولى في كل صفحة تجيب مباشرة عن سؤال تلك الصفحة. عمل SEO المشترك: تحصل كل صفحة على title فريد من 48 إلى 60 حرفًا، وdescription من 145 إلى 158 حرفًا، وH1 واحد، وcanonical ينتهي بشرطة مائلة. أضف عقدة WebPage خاصة بكل صفحة وBreadcrumbList، مرتبطتين بالرسم الأساسي عبر @id. في robots.txt اكتب Allow: / لكل من Googlebot وBingbot وOAI-SearchBot وChatGPT-User وGPTBot وClaude-SearchBot وClaude-User وClaudeBot وPerplexityBot وPerplexity-User وGoogle-Extended وApplebot-Extended وCCBot، واشرح القرار في تعليق ووضّح ما يجب تغييره إذا أردت حظر زواحف التدريب. يحتوي sitemap.xml على تواريخ lastmod حقيقية. يصف llms.txt النشاط بدقة في جملتين ويسرد NAP والصفحات المهمة مع روابطها. الإعداد التقني (لا يُستخدم المسار الافتراضي للأداة في هذا الموقع للأسباب التالية): 1. صرّف Tailwind واستغنِ عن CDN. تحمّل الأداة Tailwind عبر Play CDN الذي يترجم في المتصفح ويطبع تحذيرًا في وحدة التحكم ويخفض الأداء على الجوال. اكتب _kaynak/package.json باستخدام site_write_file، وثبّت بـ site_run_command("cd _kaynak && npm i -D tailwindcss@3 html-validate", background=true) وانتظر باستخدام site_command_status. في _kaynak/tailwind.config.js اضبط content على "./*.html" و"./**/*.html" و"!./_kaynak/**" و"./_kaynak/chrome.mjs". انقل قواعد @font-face وأسطر @tailwind وحلقة التركيز ورابط التخطي وحارس overflow من app.css الخاص بالأداة إلى _kaynak/site.css. اجعل المخرجات في assets/app.css، لأن design-check.mjs يبحث عن الخطوط في هذا الملف، وأضف ?v=<hash المحتوى> إلى الرابط في كل صفحة حتى لا تقدّم ذاكرة التخزين المؤقت الطرفية الملف القديم أبدًا. 2. استضف الخطوط بنفسك. اقرأ رابط CSS لعائلات Fontshare التي اخترتها (api.fontshare.com/v2/css?f[]=...) باستخدام site_read_url، ونزّل ملفات woff2 الخاصة بها بـ site_fetch إلى assets/fonts/، وصرّح بها بـ @font-face وfont-display: swap. حمّل مسبقًا كل وزن مستخدم في الجزء العلوي من الصفحة بـ <link rel="preload" as="font" type="font/woff2" crossorigin>، بحد أقصى ثلاثة ملفات. إذا تجاوزت هذه الخطوة فإن تبديل الخط يزيح التخطيط؛ في العرض التجريبي كان CLS على سطح المكتب 0.078 لهذا السبب وانخفض إلى 0 مع التحميل المسبق. 3. اجعل القائمة والتذييل HTML ثابتًا. مكوّنا <site-nav> و<site-footer> في الأداة يعملان بـ JavaScript، ومعظم زواحف الذكاء الاصطناعي لا ترى القائمة ولا العنوان ولا رقم الهاتف أبدًا. أزل سكربتي chrome.js وmotion.js من كل الصفحات. في _kaynak/chrome.mjs اكتب دالتين تبنيان HTML الترويسة والتذييل من assets/site.config.js؛ وابنِ قائمة الجوال بدون JavaScript باستخدام <details> و<summary>، وعلّم الصفحة الحالية بـ aria-current="page". اكتب build.mjs في جذر الموقع بحيث ينفذ بالترتيب node seo-stamp.mjs، ويعيد ختم كل ما بين <!-- chrome:header:start --> و<!-- chrome:header:end --> (والأمر نفسه للتذييل) في كل صفحة، ويصرّف Tailwind ويحدّث الـ hash في رابط CSS. بعد كل تغيير، نفّذ فقط site_run_command("node build.mjs"). 4. بلا حركة. لا تحمّل GSAP ولا Lenis ولا Swiper ولا أي سكربت حركة في هذا الموقع؛ فالزوار يأتون عبر هواتفهم للاتصال أو المراسلة بسرعة. 5. صغّر الصور. نزّل كل صورة بـ site_fetch في ملفات منفصلة باستخدام resize="480x" و"800x" و"1200x" و"1600x" وimage_format="webp" وجودة بين 60 و68. أعطِ كل <img> قيم srcset وsizes وwidth وheight مطابقة للنسبة الحقيقية؛ وإذا قصصت الصورة فأضف فئة نسبة مثل aspect-[4/3] مع object-cover، وإلا يتحرك التخطيط عند تحميل الصورة. تحصل صورة الشاشة الأولى على fetchpriority="high" ولا تكون lazy؛ وتحصل كل الصور الأخرى على loading="lazy". نزّل صورة المشاركة بصيغة JPG بمقاس 1200x630 باستخدام site_fetch. 6. تفاصيل صغيرة تكلّف نقاطًا: أضف أيقونة favicon بصيغة SVG مع <link rel="icon"> (وإلا يطلب المتصفح /favicon.ico ويظهر الخطأ 404 في وحدة التحكم وتنخفض درجة أفضل الممارسات). اكتب DOCTYPE بأحرف كبيرة، ولا تستخدم سمات style ولا تترك مسافات زائدة في نهاية الأسطر. استخدم &nbsp; بدل المسافات في النص المرئي لروابط الهاتف (قاعدة tel-non-breaking في html-validate). يجب ألا يقل ارتفاع وعرض الروابط في القائمة والتذييل ومسار التنقل والعناوين عن 44 بكسل. لا تضمّن iframe من Google Maps؛ يجب ألا يجري الموقع أي طلبات خارجية، لذا اعرض العنوان ورابط "احصل على الاتجاهات". 7. يجب ألا يغادر أي طلب الموقع: الخطوط والسكربتات والأنماط والصور كلها على خادمك. لا يوجد معالج نماذج، لذا نموذج الاتصال هو نموذج method="get" يشير إلى https://wa.me/[رقم WhatsApp] مع textarea معبأة مسبقًا باسم "text"؛ ولا حاجة إلى JavaScript. بوابات القبول (بهذا الترتيب؛ لا تعتبر العمل منتهيًا حتى تنجح كلها): 1. نفّذ node build.mjs باستخدام site_run_command ثم node seo-check.mjs: 0 أخطاء، 0 تحذيرات. تحذير المحتوى المكرر يعني أن صفحتين ليستا مختلفتين بما يكفي؛ أعد كتابتهما. 2. node design-check.mjs: 0 أخطاء. إذا اخترت أسلوبًا بلا حركة، فأبلغ عن تحذير "بلا حركة" كقرار متعمد مع ذكر السبب. 3. _kaynak/node_modules/.bin/html-validate على كل ملفات HTML: 0 أخطاء. ضع سطر _kaynak/ في ملف .htmlvalidateignore في جذر الموقع حتى لا تُفحص التبعيات. 4. فحص NAP: اعرض في جدول أن الاسم والعنوان والهاتف في الموقع تطابق مخرجات gbp_location_details حرفًا بحرف. 5. افحص كل صفحة بـ site_preview عند view="mobile" وview="desktop" وكذلك عند عرض 360 و768. أصلح التمرير الأفقي والعناوين الفائضة والأزرار المزدحمة والنص غير المقروء ثم افحص مرة أخرى. 6. قِس كل صفحة بـ core_web_vitals عند strategy="mobile" وstrategy="desktop"، واحصل على درجات إمكانية الوصول وأفضل الممارسات وSEO عبر seo_audit. الهدف على الجوال 100 في إمكانية الوصول وأفضل الممارسات وSEO و95 على الأقل في الأداء؛ وعلى سطح المكتب 95 على الأقل في الأربعة. في الصفحة التي لا تحقق الهدف، نفّذ core_web_vitals مع resources=true، وابحث عن عنصر LCP وأي صورة كبيرة جدًا، وأصلحها وكرر seo_audit مع runs=2، لأن تشغيلًا مخبريًا واحدًا قد يتذبذب. 7. يجب ألا تحتوي طلبات الشبكة على أي عنوان خارج نطاق الموقع نفسه. بعد النشر: أرسل sitemap.xml باستخدام gsc_submit_sitemap وافحص الصفحة الرئيسية وأهم ثلاث صفحات باستخدام gsc_inspect_urls. لا توجد أداة تستطيع الضغط على "طلب الفهرسة"؛ اذكر ما يجب أن أطلبه يدويًا في Search Console. اختم بهذا التقرير: قائمة الصفحات مع درجات الجوال وسطح المكتب لكل صفحة في جدول (الأداء، إمكانية الوصول، أفضل الممارسات، SEO، LCP، CLS)، ونتيجة كل بوابة، والإصلاحات التي أجريتها، والمعلومات التي ما زلت بحاجة إليها مني. وإذا لم يتحقق هدف ما فقل ذلك بوضوح بدل اعتبار العمل منتهيًا.