الاستعداد للتغييرات التي ستطرأ على سلوك تغيير حجم إطار العرض في Chrome على نظام التشغيل Android

Bramus

في تشرين الثاني (نوفمبر)، مع طرح الإصدار 108 من Chrome، سيُجري Chrome بعض التغييرات على طريقة تصرف "مساحة عرض التنسيق" عند عرض لوحة المفاتيح على الشاشة. مع هذا التغيير، لن يغير Chrome على Android بعد الآن حجم إطار عرض التنسيق، وبدلاً من ذلك يغير حجم إطار العرض المرئي فقط. سيؤدي ذلك إلى جعل سلوك Chrome على Android مماثلاً لسلوك Chrome على iOS وSafari على iOS.

في ما يلي بعض المعلومات الأساسية حول ما يحدث وسبب إجراء Chrome لهذا التغيير والخطوات التي يمكنك اتّخاذها للاستعداد.

إطار عرض التنسيق وإطار العرض المرئي

عند زيارة أحد المواقع الإلكترونية، لا يظهر لك محتوى الصفحة بالكامل بعد تحميلها. بدلاً من ذلك، يعرض لك المتصفح إطار عرض يمكنك من خلاله رؤية جزء من الصفحة. يُعرَف إطار العرض هذا أيضًا باسم إطار عرض التنسيق. عندما يكبر محتوى الصفحة بشكل كبير جدًا، يوفر المتصفح آلية التمرير.

عند تحديد موضع العناصر باستخدام position: fixed، سيتم وضعها وفقًا لإطار عرض التنسيق هذا. بما أنّ إطار عرض التنسيق يبقى في مكانه أثناء الانتقال إلى أسفل الصفحة، سيبقى كذلك العناصر التي تستخدم position: fixed.

بالإضافة إلى "إطار عرض التنسيق" هذا، يقدّم المتصفّح أيضًا إطار عرض مرئيًا. ويمثّل الجزء المرئي حاليًا من مساحة العرض. في مستوى التكبير 1، يكون إطار العرض المرئي هذا بحجم إطار عرض التنسيق.

عند التكبير أو التصغير بإصبعين، يتم تصغير حجم "إطار العرض البصري" مقارنةً بـ "إطار عرض التنسيق".

سلوك تغيير حجم إطار العرض

عند التركيز على حقل إدخال أو أي منطقة أخرى قابلة للتعديل، يمكن للأجهزة، وأغلبها الأجهزة التي تعمل باللمس، عرض لوحة مفاتيح على الشاشة. تُعرف لوحة المفاتيح هذه غالبًا باسم "لوحة المفاتيح الافتراضية"، وهي تتيح للمستخدمين إدخال محتوى في المنطقة القابلة للتعديل.

عند إجراء ذلك، تستجيب المتصفّحات بإحدى الطرق التالية في ما يتعلّق بملفات العرض المختلفة:

• غيِّر حجم "إطار العرض المرئي" فقط وأستبدل إطار عرض التنسيق.
• غيِّر حجم كلّ من "إطار العرض المرئي" و"إطار عرض التصميم".
• لا تُغيّر حجم أي من "إطار عرض التصميم" أو "إطار العرض المرئي"، ما يؤدي إلى تركيب لوحة المفاتيح الافتراضية فوق كليهما.

يتم عرض هذه السلوكيات الثلاثة على النحو التالي:

استنادًا إلى مجموعة المتصفح ونظام التشغيل التي يستخدمها الزائر، يتم استخدام أحد السلوكيات، ولا يمكنك التحكّم في ذلك.

ربط سلوكيات تغيير الحجم المختلفة

في جهود التحقيق في إطار الإطار المرئي، التي تشكّل جزءًا من Interop 2022، تم التحقيق في جوانب مختلفة متعلقة بالإطار المرئي لكل مجموعة رئيسية من المتصفحات وأنظمة التشغيل.

أحد الجوانب التي تم اختبارها هو سلوك تغيير الحجم عند عرض لوحة المفاتيح على الشاشة. وقد أدّى ذلك إلى التصنيف التالي:

المجموعة الأولى

المتصفّحات التي تغيّر حجم "إطار العرض المرئي"، بدون تغيير "إطار عرض التصميم"

• Safari على أجهزة iOS
• المتصفح Safari على نظام التشغيل iPadOS
• Chrome على نظام التشغيل ChromeOS
• ‏متصفح Chrome على الأجهزة التي تعمل بنظام iOS‬
• متصفّح Chrome على نظام التشغيل iPadOS
• ‫Edge على أجهزة iOS
• ‫Edge على iPadOS

المجموعة الثانية

المتصفّحات التي تغيّر حجم كلّ من "إطار العرض المرئي" و"إطار عرض التصميم"

• Chrome على Android
• Firefox على Android
• ‫Edge على Android
• Firefox على أجهزة iOS

المجموعة الثالثة

المتصفّحات التي لا تغيّر حجم أيّ من إطارات العرض:

• عدم ضبط أي خيار تلقائيًا – في Chrome على نظام التشغيل Android، يمكنك تفعيل هذا السلوك عن طريق واجهة برمجة تطبيقات Virtualلوحة المفاتيح

الآثار الجانبية لكل سلوك

يؤدي هذا الاختلاف في كيفية تغيير حجم مساحات العرض المختلفة عند عرض لوحة المفاتيح على الشاشة إلى سلوك تنسيق وحجم غير متوافقَين للمواقع الإلكترونية.

في المتصفِّحات من المجموعة 1 التي تظهر فيها OSK:

• تظل القيم المحسوبة للوحدات النسبية لمساحة العرض كما هي.
• تحافظ العناصر المصمّمة لتشغل المساحة المرئية بالكامل على حجمها.
• تظل العناصر التي تستخدم position: fixed في مكانها ويمكن أن تحجبها لوحة المفاتيح على الشاشة.

في المتصفّحات من المجموعة 2، مع عرض لوحة المفاتيح على الشاشة:

• تقلّ القيم المحسوبة للوحدات النسبية لمساحة العرض.
• يتم تصغير العناصر التي تم تصميمها لتشغل المساحة المرئية بالكامل.
• يمكن أن تظهر العناصر التي تستخدم position: fixed في مكان آخر في التنسيق.

ولن يكون بإمكانك معرفة السلوك الذي يتم استخدامه إلا إذا كنت تلجأ إلى استقصاء وكيل المستخدم أو الاعتماد على نصوص برمجية مكثفة. ولا يمكنك أيضًا تغيير السلوك، لأنّه يتم تحديده من خلال تركيبة المتصفّح ونظام التشغيل اللذين يستخدمهما المستخدم للوصول إلى موقعك الإلكتروني.

تغيير السلوك التلقائي في الإصدار 108 من Chrome

اعتبارًا من الإصدار 108 من Chrome، سيعدّل Chrome على Android سلوك تغيير حجم إطار العرض بحيث لا يتم تغيير حجم إطار عرض التصميم عند عرض لوحة المفاتيح على الشاشة.

سيؤدي ذلك إلى مواءمة سلوك Chrome على Android مع سلوك Chrome على iOS وiPadOS وWindows وCrOS، وSafari على iOS وiPadOS، وEdge على iOS وiPadOS وWindows.

وبفضل هذا التغيير، يمكن للمؤلفين معرفة السلوك الذي سيتم استخدامه بغض النظر عن نظام التشغيل الذي يعمل عليه Chrome. بالإضافة إلى ذلك، تتيح هذه الطريقة استخدام وحدات ثابتة بالنسبة إلى مساحة العرض: لا يؤثّر عرض لوحة المفاتيح على الشاشة أو إخفاؤها في هذه الوحدات.

الموافقة على سلوك مختلف

إذا كنت تريد أن يستخدم موقعك الإلكتروني سلوك تغيير الحجم قبل الإصدار 108، لا داعي للقلق. سيتم أيضًا طرح إضافة إلى العلامة الوصفية لإطار العرض في الإصدار 108 من Chrome.

من خلال مفتاح interactive-widget، يمكنك إخبار Chrome بالسلوك الذي تريده لتغيير الحجم.

القيم المقبولة لـ "interactive-widget" هي:

• resizes-visual: يمكنك تغيير حجم "إطار العرض المرئي" فقط وليس "إطار عرض التنسيق".
• resizes-content: تغيير حجم إطار العرض المرئي وإطار عرض التنسيق
• overlays-content: لا تغيِّر حجم أي إطار عرض.

لإعادة تفعيل السلوك "القديم" لمتصفّح Chrome على Android، اضبط العلامة الوصفية لإطار العرض على النحو التالي:

<meta name="viewport" content="width=device-width, initial-scale=1.0, interactive-widget=resizes-content">

إذا لم تُدرِج interactive-widget في العلامة الوصفية لإطار العرض، سيستخدم Chrome السلوك التلقائي، وهو resizes-visual.

من الناحية المرئية، تؤثر الإعدادات على مساحات العرض المختلفة على النحو التالي:

يمكنك تجربة تأثير كل قيمة في متصفّحك على هذا الموقع الإلكتروني التجريبي.

الاختبار والملاحظات

نتوقع حدوث بعض الاختلافات البسيطة في المواقع الإلكترونية الحالية، ولكن نتوقع ألا يؤدي ذلك إلى حظر المواقع الإلكترونية لأنّ الإصدار 108 من Chrome على Android سيعمل الآن بالطريقة نفسها التي يعمل بها Safari على iOS. وبالتالي، من المفترض أن تعمل المواقع الإلكترونية التي تعمل بشكل جيد على Safari على نظام التشغيل iOS بشكل جيد أيضًا على الإصدار 108 من Chrome على Android.

في المقابل، ننصح مؤلفي المواقع الإلكترونية باختبار مواقعهم الإلكترونية بشكل نشط في الإصدار Chrome 108 الذي يتوفر في إصدار تجريبي اعتبارًا من 27 تشرين الأول (أكتوبر) 2022. ابحث تحديدًا عن العناصر التي تستخدم position: fixed و/أو تعتمد على الوحدات النسبية لإطار العرض.

يمكن الإبلاغ عن الملاحظات على crbug.com، لذلك يُرجى التأكّد من تضمين "لوحة مفاتيح على الشاشة" في عنوان التقرير.

مراجع إضافية

• إدخال حالة Chrome
• الشرح
• الإصدار التجريبي