UIDex

إيه الفرق؟

مؤشّر التقدّم أم هيكل التحميل

الفارق هو ما الذي يخبرك به الانتظار. مؤشّر التقدّم يتحدّث عن العملية: كم أُنجز وكم بقي. الهيكل التحميلي يتحدّث عن النتيجة: هذا هو شكل المحتوى الذي سيصل، وهذه أماكنه. الأول يقيس زمناً، والثاني يحجز مساحة.

اسأل نفسك سؤالاً واحداً

هل أنت عارف شكل اللي جاي، ولا عارف بس إنه شغّال؟

جارٍ رفع «العرض-النهائي.pdf»٥٪
aria-valuenow="5"يتحرّك كل ٥٪ لا مع كل إطار
٥٪
جارٍ الاتصال بالخادم
RTLالتعبئة تبدأ من اليمين، والدوّار لا ينعكس معها

مؤشّر التقدّم

Progress Bar vs Spinner vs Ring
role="progressbar"

استخدمه لما

رفع ملف، أو تصدير تقرير، أو أي عملية لها نسبة قابلة للقياس ولا يعرف المستخدم شكل نتيجتها.

المدخل الكامل
حدّ أدنى 600msجارٍ التحميل…
RTLاللمعة تمشي مع اتجاه القراءة، جرّب تبديل اللغة من الأعلى

هيكل التحميل

Skeleton
aria-busy="true"

استخدمه لما

تحميل قائمة أو بطاقات أو صفحة ملفّ شخصي: محتوى تعرف تخطيطه سلفاً، والهيكل يمنع قفزة الصفحة عند وصوله.

المدخل الكامل

الخطأ الكلاسيكي

هيكل تحميلي لا يطابق مقاسات المحتوى الحقيقي. الصفحة تقفز عند وصول البيانات، فيكون الهيكل قد زاد الإزعاج بدل أن يمنعه.

مقارنات أخرى