الشبكات
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
يعرض عرض الشبكة عمودين أو أكثر من الصور التي تمثل عناصر المحتوى، مع نص موجز أسفل كل صورة. يُعد هذا العرض الأمثل عندما يعتمد المستخدمون بشكل أساسي على الصور في اختياراتهم.
تتميز الجداول بإمكانية التمرير الرأسي، ويمكن أن تختلف في الحجم والتباعد وعدد الأعمدة. كما يمكن تجميع المحتوى في الجدول ضمن فئات.
مكون عناصر القائمة
توفر القوائم طريقة بديلة لعرض المحتوى الذي يتطلب المزيد من النصوص التوضيحية.
تشريح
تحتوي الشبكات على نصوص وعناصر تحكم في واجهة المستخدم. ولأن المستخدمين مطالبون بالتفاعل معها، يجب ألا تُحجب أبدًا، سواء بعناصر أخرى أو بحافة الشاشة.
1. عنصر الشبكة 2. النصوص الأساسية والثانوية 3. خلفية شبكية
المواصفات
مكون عناصر القائمة
المواصفات، وإرشادات التصميم، والمزيد.
شبكة المحتوى (3 أو 4 أعمدة)
شبكة التطبيقات (4 أعمدة)
شبكة التطبيقات مع العناصر المستخدمة بكثرة في الصف العلوي
موضع أيقونة المؤشر في تخطيط الشبكة
توسيع نطاق التخطيطات
توضح هذه التصاميم المرجعية كيفية تكييف الشبكات لتناسب الشاشات ذات العرض والارتفاعات المختلفة. لاحظ أن جميع قيم البكسل هي قيم البكسل المعروضة، قبل أي عملية تقليل أو زيادة في دقة الصورة.
شاشات ذات عرض قياسي
الشاشات العريضة
يُنصح باستخدام تخطيط بثلاثة أعمدة للشاشات العريضة. في حال استخدام تخطيط بأربعة أعمدة، يجب الحفاظ على حجم البلاطة الأدنى عند 219 نقطة في البوصة.
شاشات عريضة للغاية وشاشات عريضة جدًا
التباعد الرأسي لشبكات التطبيقات على الشاشات ذات الارتفاعات المختلفة
بالنسبة للشاشات الصغيرة، يجب تقليل المسافة الرأسية بين عناصر محتوى الشبكة وبين أيقونات التطبيقات وعناوينها.
الأنماط
الطباعة
نمط الخط
نوع الخط
وزن
الحجم (dp)
الجسم 1
روبوتو
عادي
32
الجسم 2
روبوتو
عادي
28
الجسم 3
روبوتو
عادي
24
لون
عنصر
اللون (وضع النهار)
اللون (الوضع الليلي)
النوع الأساسي / الرموز
أبيض
أبيض بنسبة 88%
النوع الثانوي / الأيقونات
أبيض بنسبة 72%
أبيض بنسبة 60%
خط فاصل
أبيض بنسبة 22%
أبيض بنسبة 12%
خلفية شبكية
أسود
أسود
شاشة عرض المحتوى
غير متوفر
أسود بنسبة 22%
اقتطاع التدرج
اللون الأسود بنسبة 0-100% في 10% من مساحة النص
اللون الأسود بنسبة 0-100% في 10% من مساحة النص
المقاسات
عنصر
الحجم (dp)
أيقونة التطبيق
76
خلية تطبيق مصغرة
135
خلية محتوى الحد الأدنى
158
ارتفاع
عنصر
لون
المحور الصادي
ضبابية
بلاطة شبكية
أسود بنسبة 22%
2
2
أمثلة
شبكة التطبيقات - يوم شبكة التطبيقات - ليلاً
شبكة المحتوى - يوم شبكة المحتوى - ليلاً
يقوم المستخدم بالسحب لأعلى أو لأسفل لتمرير المحتوى
تاريخ التعديل الأخير: 2026-03-11 (حسب التوقيت العالمي المتفَّق عليه)
[[["يسهُل فهم المحتوى.","easyToUnderstand","thumb-up"],["ساعَدني المحتوى في حلّ مشكلتي.","solvedMyProblem","thumb-up"],["غير ذلك","otherUp","thumb-up"]],[["لا يحتوي على المعلومات التي أحتاج إليها.","missingTheInformationINeed","thumb-down"],["الخطوات معقدة للغاية / كثيرة جدًا.","tooComplicatedTooManySteps","thumb-down"],["المحتوى قديم.","outOfDate","thumb-down"],["ثمة مشكلة في الترجمة.","translationIssue","thumb-down"],["مشكلة في العيّنات / التعليمات البرمجية","samplesCodeIssue","thumb-down"],["غير ذلك","otherDown","thumb-down"]],["تاريخ التعديل الأخير: 2026-03-11 (حسب التوقيت العالمي المتفَّق عليه)"],[],[]]