أنشئ موقعًا فاخرًا ثنائي اللغة لفندق بوتيك أو مشروع عقاري، بصور كبيرة وتأثير بارالاكس هادئ وhreflang

استخدم اتصالي بـ Opus Growth لهذا الغرض. إذا لم تجد الأداة التي تحتاجها، فابحث بين أدوات Opus Growth (باستخدام search_tools إن كانت في قائمتك)؛ وإذا تعذّر عليك الوصول إلى الأدوات تمامًا، فلا تخمّن وأخبرني. أنشئ موقعًا بالتركية والإنجليزية لـ[فندقي / مشروعي السكني] على خادم الاستضافة الخاص بي [اسم الخادم]. التفاصيل: 1. الاسم: [اسم النشاط أو المشروع]، الموقع: [الموقع]، النوع: [فندق بوتيك / مشروع سكني] 2. للفندق: أنواع الغرف (المساحة، السرير، عدد النزلاء، الإطلالة، المرافق)، أوقات تسجيل الوصول والمغادرة، الموسم وقواعد الإقامة: [تفاصيل الغرف] 3. للمشروع: أنواع الوحدات (الغرف، المساحة بالمتر المربع، الطابق، موعد التسليم) وبيانات مكتب المبيعات: [تفاصيل الوحدات] 4. الهاتف: [الهاتف]، WhatsApp: [WhatsApp]، البريد الإلكتروني: [البريد الإلكتروني]، العنوان: [العنوان] 5. النطاق: [النطاق]، الصور الحقيقية: [مكان الصور، أو "use stock"] 6. من سيراجع النص الإنجليزي: [الشخص، أو "لا أحد"] أكّد الخادم أولًا باستخدام list_servers ونفّذ scaffold_site مع style="universal"، أولًا مع confirm=false ثم مع confirm=true بعد موافقتي. اقرأ site_design_guide و site_seo_guide. اكتب قرار تصميم فاخرًا ودافئًا في _kaynak/ART.md وأرِني إياه: خط عناوين serif أنيق من Fontshare (مثل Boska 300) مع خط نص بسيط (مثل Synonym)، ودرجات القهوة الداكنة والكتان، ولون نحاسي واحد للتمييز، وتسميات صغيرة بتباعد واسع بين الأحرف وتصوير بملء الشاشة. العنصر المميز هو الصورة الأولى بملء الشاشة في الصفحة الرئيسية مع حركة parallax هادئة. لا تضع ترويسة شفافة فوق الصورة؛ ففي الصفحات الفاتحة يختفي نص القائمة الفاتح (في النسخة التجريبية أدى ذلك إلى انخفاض إمكانية الوصول إلى 95 في صفحتي الغرف والتواصل). اجعل خلفية الشريط داكنة. بنية اللغات: 1. تقع الصفحات التركية في الجذر ونظيراتها الإنجليزية تحت /en/. لكل صفحة تركية نظيرة إنجليزية وتشير كل منهما إلى الأخرى. احتفظ بأزواج الصفحات في قائمة واحدة داخل assets/site.config.js وابنِ منها القائمة والتذييل ومبدّل اللغة؛ ينتقل المبدّل دائمًا إلى نظيرة تلك الصفحة، وليس إلى الصفحة الرئيسية أبدًا. 2. يحمل <head> في كل صفحة hreflang="tr" و hreflang="en" و hreflang="x-default" تشير إلى الصفحة التركية، وكلها بعناوين URL مطلقة؛ اكتب الأزواج نفسها في sitemap.xml كعناصر xhtml:link. 3. تستخدم الصفحات الإنجليزية <html lang="en"> وعنوانًا ووصفًا ومسار تنقل (breadcrumb) بالإنجليزية، و WebPage inLanguage "en". يضع seo-stamp.mjs القيمة og:locale tr_TR على كل صفحة؛ وفي build.mjs، بعد الختم، غيّرها إلى en_GB في الصفحات الإنجليزية وأضف og:locale:alternate باللغتين. 4. اكتب الإنجليزية كما يكتبها كاتب أصلي، لا كترجمة، وأبقِ أسماء الأماكن بإملائها التركي. الصفحات والمخطط (schema) (كل منها باللغتين): 1. الرئيسية: صورة أولى بملء الشاشة، وفقرة واحدة تشرح ما هو المكان، وحقائق مختصرة (عدد الغرف، تسجيل الوصول، المغادرة، الموسم)، وبطاقات الغرف ورابط إلى الدليل المحلي. المخطط: WebPage، وعلى عقدة النشاط النوع Hotel مع checkinTime و checkoutTime و numberOfRooms و amenityFeature والغرف ضمن containsPlace. للمشروع السكني استخدم Residence أو ApartmentComplex بدلًا من ذلك. 2. صفحة للغرف وصفحة لكل نوع غرفة: المساحة، السرير، عدد النزلاء، المرافق، لمن تناسب، ورابط إلى نوع الغرفة الآخر. المخطط: HotelRoom (bed, occupancy, floorSize, amenityFeature, containedInPlace #business). للمشروع السكني، RealEstateListing لكل نوع وحدة مع Apartment بداخله (numberOfRooms, floorSize). إذا لم أعطك أسعارًا فلا تكتب offers، وقل في النص "أرسل لنا تواريخك وسنخبرك بالسعر لها". 3. الدليل المحلي: معرفة محلية مع تاريخ آخر تحديث. المخطط: WebPage. 4. التواصل والحجز: الهاتف، نموذج WhatsApp، البريد الإلكتروني، العنوان، "احصل على الاتجاهات"، ملاحظات السفر وشروط الحجز. المخطط: ContactPage. 5. صفحة 404 (قصيرة، باللغتين). لا تذكر تصنيف نجوم أو جوائز أو تقييمات نزلاء أو عبارة "الأفضل"؛ ولا تضف starRating أو aggregateRating. لفتح الصور الكبيرة بسرعة: قدّم الصورة الأولى باستخدام <picture>؛ في الشاشات حتى 767 بكسل استخدم قصًّا طوليًا بعرض 600 و900 بكسل (يُقصّ عند عنوان المصدر ويُجلب باستخدام site_fetch)، وفي الشاشات الأعرض النسخة الأفقية بعرض 1200 و1600 و2000 بكسل. بدون القص الطولي تُكبَّر الصورة الأفقية لتملأ شاشة الهاتف فتبدو غير حادة أو تُنزّل ملفًا كبيرًا دون داعٍ. لا اختلاق: لا تكتب مراجعات أو تقييمات أو جوائز أو شهادات أو أعداد عملاء أو ادعاءات مثل "الأفضل" غير حقيقية. لا تضف إلى المخطط أو النص ساعات عمل أو إحداثيات أو أسعارًا أو بريدًا إلكترونيًا لم أعطك إياه؛ اترك الحقل خارجًا واذكره كمعلومة ناقصة في التقرير. لا تستخدم شرطات طويلة ولا شعارات جاهزة، واجعل الفقرة الأولى في كل صفحة تجيب مباشرة عن سؤال تلك الصفحة. أعمال 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. أضف preload لكل وزن مستخدم في الجزء المرئي أولًا باستخدام <link rel="preload" as="font" type="font/woff2" crossorigin>، بحد أقصى ثلاثة ملفات. إذا تخطيت هذا فإن تبديل الخط يزحزح التخطيط؛ في النسخة التجريبية كان CLS على سطح المكتب 0.078 لهذا السبب وانخفض إلى 0 مع preload. 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. Parallax بدون JavaScript. أعطِ الصورة الأولى data-parallax وحرّكها ببطء باستخدام حركة CSS مرتبطة بالتمرير (animation-timeline: scroll(root)) باستخدام transform فقط؛ وأعطِ الأقسام ظهورًا data-reveal يستخدم transform فقط أيضًا، وليس opacity أبدًا. ضع القواعد داخل @media (prefers-reduced-motion: no-preference) و @supports (animation-timeline: scroll())؛ ومع تقليل الحركة، أو في متصفح لا يدعمها، تبقى الصورة ثابتة. لا تحمّل 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. تفاصيل صغيرة تكلّف نقاطًا: أضف أيقونة موقع 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 أخطاء. إذا اخترت أسلوبًا بلا حركة، فأبلغ عن تحذير "no motion" كقرار مقصود مع ذكر السبب. 3. _kaynak/node_modules/.bin/html-validate على كل ملف HTML: 0 أخطاء. ضع سطر _kaynak/ في ملف .htmlvalidateignore في جذر الموقع حتى لا تُفحص الاعتماديات. 4. فحص اللغات: أظهر في جدول أن نظيرة hreflang لكل صفحة موجودة وتعيد 200 وتشير إلى الصفحة الأصلية؛ ويجب ألا يعطي seo-check أي تحذير hreflang. 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)، ونتيجة كل بوابة، والإصلاحات التي أجريتها، والمعلومات التي ما زلت تحتاجها مني. إذا لم يتحقق أحد الأهداف فقل ذلك بوضوح بدلًا من اعتبار العمل منتهيًا.