البرامج التعليمية
Claude Opus 5.5: إصلاح جدول مقارنة المنتجات على الهاتف
اطلب من Claude Opus 5.5 الحفاظ على مهمة المقارنة عند إصلاح جدول الهاتف، لا مجرد تصغيره ليلائم الشاشة.
اطلب من Claude Opus 5.5 الحفاظ على مهمة المقارنة عند إصلاح جدول الهاتف، لا مجرد تصغيره ليلائم الشاشة. يحتاج المشتري إلى ربط كل قيمة بالمنتج والخاصية. التخطيط المضغوط الذي يخفي اسم الطراز أو يحوّل كل معلومة مفقودة إلى «لا» يغيّر معنى المقارنة.
هذا سير مراجعة تصميم مقترح بمثال منتجات افتراضية. قدّم البيانات الفعلية وHTML/CSS الحاليين وعرض الشاشة المستهدف وسؤال المشتري. وهو مختلف عن استخراج المواصفات: اعتمد الحقائق أولًا، ثم قرر كيف يقارنها القارئ على شاشة صغيرة.
اختر النمط بحسب مهمة القارئ
يعرض نقاش عن الجداول على الهاتف المفاضلة بين التمرير الأفقي وتقليل الأعمدة والبطاقات المنفصلة. هذه خيارات تصميم، وليست إثباتًا لزيادة المبيعات. حدّد المنتجين اللذين يريد المشتري مقارنتهما والخصائص التي تحسم قراره.
| مهمة القارئ | التخطيط المرشح | الفحص قبل الاعتماد |
|---|---|---|
| مقارنة الخاصية نفسها بين المنتجات | جدول دلالي قابل للتمرير | وضوح هوية الصف والمنتج |
| مقارنة منتجين مختارين | أداة اختيار منتجين | حفظ معنى الصف عند تبديل الاختيار |
| معرفة منتج واحد كل مرة | بطاقات خصائص ذات تسميات | بقاء تسمية الخاصية مع كل قيمة |
| العثور على اختلاف معين | مرشح اختياري للاختلافات | عدم اعتبار القيم المجهولة متساوية |
ابدأ بأبسط نمط يدعم المهمة. يضيف الاختيار إدارة حالة وعملًا للوحة المفاتيح، وقد تبطئ البطاقات المقارنة بين المنتجات. تجنّب إدارة حقائق مستقلة لسطح المكتب والهاتف لأنهما سيتباعدان مع الوقت.
استخدم بيانات اختبار صغيرة تكشف الأخطاء
لنفترض مصباحين افتراضيين A وB بوزني 410 غ و560 غ. يدعم A الشحن عبر USB-C، بينما لا يذكر مصدر B طريقة الشحن. كلاهما يملك ثلاثة مستويات سطوع. تُظهر المقارنة فرق الوزن وتسمّي شحن B «غير مذكور». لا يجوز استنتاج أنه لا يدعم USB-C.
عند إظهار الاختلافات فقط قد يختفي صف السطوع المتساوي، لكن يبقى صف الشحن غير المحسوم. أضف منتجًا ثالثًا باسم مترجم طويل وحاشية إلى بيانات الاختبار. يكشف ذلك تجاوز العرض وأخطاء الربط التي لا تظهر مع اسمين إنجليزيين قصيرين. المثال يصف السلوك المطلوب، وليس نتيجة مقاسة من Opus.
للجداول البسيطة ذات الصفوف والأعمدة، تستخدم إرشادات W3C خلايا العناوين و`scope` لتحديد العلاقات، مع caption لتعريف الجدول. حافظ على هذه العلاقات عند تغيير المظهر. لا تُظهر لقطة جميلة ما ينطقه قارئ الشاشة.
تعليمة بمعايير قبول واضحة
استعن بدليل Opus الرسمي لتحديد التعديل والفحوص. أعطِ النموذج مصدر البيانات وأبقِ تغيير الحقائق خارج مهمة التخطيط.
أصلح مقارنة المنتجات هذه عند عرض شاشة 390 بكسل CSS.
مهمة المشتري: مقارنة الوزن والشحن لمصباحين مختارين.
استخدم مصدر بيانات معتمدًا واحدًا لسطح المكتب والهاتف، ولا تختلق القيم المفقودة.
بيانات الاختبار: A يزن 410 غ ويدعم USB-C؛ B يزن 560 غ والشحن غير مذكور. كلاهما يملك ثلاثة مستويات سطوع.
اقترح أبسط تخطيط مناسب ثم أقل تعديل مطلوب في HTML/CSS.
اربط كل قيمة باسم المنتج وتسمية الصف، وحافظ على caption والعلاقات الدلالية للعناوين.
إن استخدمت التمرير الأفقي فاحصره بمنطقة الجدول وقدّم إشارة مرئية ووصولًا قابلًا للاستخدام بلوحة المفاتيح.
إن استخدمت أداة اختيار فضع لها تسمية وحافظ على التركيز عند تغيير الاختيار.
اختبر الأسماء المترجمة الطويلة وتكبير النص والتنقل بلوحة المفاتيح والقيم المجهولة في مرشح الاختلافات.
افصل الفحوص المنفذة عن التي تعذر تنفيذها. لا تدّعِ إتاحة الاستخدام بناءً على لقطة شاشة وحدها.تحقّق مما يتجاوز الشاشة الأولى
عند العرض المستهدف تنقّل بين كل الأعمدة أو خيارات الاختيار. تأكد من أن التسمية الثابتة لا تغطي البيانات وأن الوحدات الطويلة والحواشي مرتبطة بالخاصية الصحيحة. كبّر النص وافحص الصفحة بحثًا عن تجاوز أفقي غير مقصود. قد يكون تمرير منطقة الجدول مقصودًا، أما تحرك الصفحة كلها جانبيًا فغالبًا ليس كذلك.
استخدم لوحة المفاتيح وقارئ الشاشة المستهدف لتأكيد وضوح العناوين وعناصر التحكم. افحص البديل دون JavaScript إن كان التصميم يعتمد على أداة اختيار. سجّل ما نُفّذ بالفعل، واحذف التفاعل إذا تجاوزت كلفة صيانته حاجة الجدول الصغير.
وحّد صور المقارنة
أنشئ صورًا متسقة للمنتجين في Panelly Studio بزوايا كاميرا ومقياس قابلين للمقارنة. أبقِ الحقائق نصًا حقيقيًا في الصفحة بدل حبسها داخل صورة. لا ندّعي أن Panelly ينشئ تنفيذ الجدول أو يصادق عليه. استخدم سير مواصفات PDF للتحقق من المدخلات ومراجعة صفحات الهبوط للبنية الأوسع.
هل يمكن حذف جميع الصفوف المتطابقة؟
اجعل ذلك خيارًا واضحًا للقارئ ويمكن التراجع عنه عند ملاءمته. قد تبقى الخصائص المتطابقة مهمة للشراء، والمعلومة المفقودة ليست دليلًا على التساوي. أظهر طريقة استعادة المقارنة الكاملة.
