أفضل الاستخدامات لرؤوس الصفحات المثبتة (sticky headers)

رؤوس الصفحات المثبتة (sticky headers) نمط تصميم شائع جدا الأن. ويمكن استخدامها لتقليل حاجة المستخدم للتمرير خلال التنقل في موقعك. كما أنها وسيلة فعالة جدا بصريا للاشارة لنظام التصفح في للموقع. ومع ذلك يمكنها أن تأخذ حيز كبير من الشاشة ويمكن أن تكون محبطة اذا كانت الصفحة للقراءة – مثل المقالات الإخبارية أو التدوينات. ويوجد سلبيات وايجابيات في استخدامها، لذا قرر بنفسك.

يمكن استخدام رؤوس الصفحات المثبتة لتقليل حاجة المستخدم للتمرير من أجل التنقل في الموقع.

رؤوس الصفحات المثبتة (sticky headers) هي نمط تصميم شائع، حيث يوجد الكثير من التحسينات والتعديلات في استخدامه. علي سبيل المثال، اختفاء وتلاشي رؤوس الصفحات المثبتة عند التمرير لأسفل الصفحة وظهورها مرة أخري عند بدأ التمرير لأعلي الصفحة.

وتطبيق آخر رائع هو تقليل ارتفاع حجم رأس الصفحة الثابت عند التمرير لأسفل الصفحة لتوفير مساحة أكبر في الشاشة. ونمط رؤوس الصفحات المثبتة (sticky headers) هو نمط جيد ويحتاج للسياق عند تنفيذه (context) . تأكد من أن له هدف وليس مجرد شكل جمالي.

واليكم 3 أمثلة مميزين في تنفيذ رؤوس الصفحات المثبتة (sticky headers) 

01. Visage

visage

موقع Visage لديه رأس صفحة مثبت والذي يصبح ارتفاعه أصغر أثناء التمرير لأسفل بعد اول صورة، ويوجد قائمة جانبية والتي تظهر خيارات تنقل وتصفح أعمق وأكثر.

02. Kin

HR-Kin

موقع kinhr يستخدم صورة كبيرة، وعند التمرير لأسفل ينزلق رأس الصفحة المثبت وتتغير لون خلفيته ولون الزر.

3. Hammerhead

hammerhead

موقع hammerhead لديه رأس صفحة مثبت يتلاشي ويختفي أثناء التمرير لأسغل ويظهر عند التوقف عن التمرير أو عند التمرير لأعلي.

مقالات ذات صلة