ما هو
تغطي هذه الفحوصات نفس وسم viewport الوصفي المشروح بشكل أكثر تقنية في دليل viewport الآخر لدينا، لكن من زاوية ما يختبره زائر الجوال فعليًا: بدونه، تفترض متصفح الهاتف أن الصفحة مبنية لشاشة سطح مكتب أوسع بكثير، وتُصغّر النتيجة بأكملها لتلائم ذلك، وهذا هو سبب ظهور صفحة غير مُعدّة بشكل صغير ومُبعّد على الهاتف حتى يقوم أحدهم بالتكبير بحركة القرص.
بالنسبة لمعظم المواقع اليوم، خاصة تلك التي تمتلك بالفعل تصميمًا متجاوبًا حقًا مدمجًا، هذه مشكلة تكوين مفقود بحتة وليست مشكلة تصميم — التخطيط المتجاوب موجود، لكنه لم يُمنح الفرصة للتفعيل فقط.
لماذا يهم
في معظم المواقع اليوم، يشكّل زوار الجوال أكثر من نصف إجمالي حركة المرور، لذا فإن مشكلة عرض جوال أساسية كهذه ليست حالة استثنائية بسيطة — إنها غالبًا ما تؤثر على غالبية كل من يزور الموقع على الإطلاق. الزائر الذي يصل إلى صفحة تبدو معطلة وضيقة وصعبة التنقل على هاتفه أكثر ميلاً بشكل ملحوظ للمغادرة فورًا بدلاً من الكفاح بالتكبير والتصغير لقراءة نص بحجم عادي.
ولأن هذه المشكلة المحددة واضحة بصريًا جدًا في لحظة فحصها (فقط افتح الموقع على هاتف)، فهي أيضًا من أسرع الأشياء للتأكد من إصلاحها بمجرد تصحيح الإعداد الأساسي.
كيفية الإصلاح
- افتح موقعك على هاتف حقيقي، أو استخدم وضع معاينة الجوال/شريط أدوات الجهاز المدمج في متصفحك (متوفر عادة في أدوات المطوّر).
- إذا بدت الصفحة كتخطيط سطح مكتب مُصغّر بدلاً من تخطيط جوال مُحجَّم بشكل صحيح، فمن المرجح جدًا أن هذا الإعداد هو السبب.
- راجع دليل viewport التقني لدينا للحصول على إصلاح الكود الدقيق — وسم
<meta name="viewport">واحد يحل هذا في كل حالة تقريبًا. - إذا كنت تستخدم أداة بناء مواقع (Squarespace أو Wix أو Webflow أو WordPress)، يُضبط هذا تلقائيًا بواسطة المنصة في كل الحالات تقريبًا — وسم مفقود هنا يشير دائمًا تقريبًا إلى تضمين كود مخصص يتجاوزه، لذا تحقق من أي كود مخصص أضفته.
- أعد التحقق من الصفحة على هاتف بعد الإصلاح للتأكد من أن النص والتخطيط مُحجَّمان الآن بشكل صحيح دون الحاجة للتكبير.