اختبار المستوى 1 — Elementor

امتحان — أسئلة مُشدّدة

15 سؤالًا للتحقّق من بناء صفحة: حاويات Flexbox، الودجات الأساسية، التبويبات الثلاثة، النمط/التباعد والاستجابة.
أجِب عن كل شيء، ثم انقر تصحيح: كل شرح يعيد تعليم المفهوم.

1.1 · استرجاع

1. في حاوية Flexbox، ماذا يضبط «الاتجاه»؟

المحاذاة في صفّ (أفقي) أو عمود (عمودي) لون خلفية الحاوية حجم الخطّ اسم الحاوية

يُحدّد الاتجاه ما إذا كانت العناصر تصطفّ في صفّ (أفقي) أو عمود (عمودي).

1.1 · تطبيق

2. لتباعد 3 بطاقات بانتظام في صفّ، أي إعداد تستخدم؟

هامش مختلف لكلٍّ gap الحاوية CSS مخصّص إلزاميّ لا شيء، تلقائيّ وغير قابل للضبط

gap يُثبّت فراغًا منتظمًا بين العناصر، أنظف من الهوامش الفردية.

1.1 · مفاضلة

3. تريد نادية أن تتكدّس 3 بطاقات في صفّ على الجوّال. ما الذي يجب أن تُفعّله؟

H1 ثانيًا الـ CSS المخصّص فقط wrap (الانتقال إلى السطر) للحاوية حذف البطاقات على الجوّال

wrap يُتيح للعناصر الانتقال إلى السطر حين تضيق العرض: تتكدّس البطاقات على الجوّال.

1.2 · استرجاع

4. كم H1 يجب أن تحمل صفحة؟

بقدر ما نشاء لا شيء ثلاثة بالضبط واحد فقط

H1 واحد (العنوان الرئيسي)، ثم H2/H3 في تراتُب — مهمّ للـ SEO والوصولية.

1.2 · تطبيق

5. ما العادة لكل صورة مُدرَجة؟

ملء نصّ بديل (alt) وصفيّ جعلها H1 تكرارها ثلاث مرّات تركها دون وصف

alt يصف الصورة للمحرّكات وقارئات الشاشة: يُملأ على كل صورة مفيدة.

1.2 · مفاضلة

6. على الجوّال، كيف تجعل زر تواصل أكثر فعالية؟

إخفاؤه لربح مكان ربطه بـ «tel:» للاتصال بنقرة كتابة «انقر هنا» دون تحديد الفعل جعله صغيرًا جدًا

رابط «tel:» يُطلِق المكالمة بنقرة على الجوّال — مثاليّ لحرفيّ يُتواصَل معه هاتفيًا؛ والنصّ يجب أن يُعلن الفعل.

1.3 · استرجاع

7. في أي تبويب تُضبَط الهوامش والـ paddings؟

المحتوى النمط المتقدّم لا شيء: يلزم CSS

الهوامش والـ paddings في تبويب المتقدّم (مع التموضع والاستجابة).

1.3 · استرجاع

8. ماذا نجد في تبويب النمط؟

النصّ والروابط الهوامش والـ paddings اسم الودجة المظهر: ألوان، طباعة، حدود

النمط يجمع المظهر: ألوان، طباعة، خلفية، حدود، ظلال.

1.3 · تطبيق

9. تريد نادية تغيير نصّ زر. أي تبويب؟

المحتوى المتقدّم النمط الاستجابة

نصّ العنصر ورابطه في تبويب المحتوى (الـ «ماذا»).

1.4 · استرجاع

10. ما الممارسة الجيّدة لألوان موقع؟

ضبطها عنصرًا عنصرًا في كل مرّة تعريفها عامّةً (إعدادات الموقع) وإعادة استخدامها استخدام أكبر عدد ممكن من الألوان تجنّب أي لون

تعريف الألوان والخطوط عامّةً يضمن الاتّساق ويتيح تعديلها في مكان واحد.

1.4 · تطبيق

11. لماذا نتحقّق من تباين النص/الخلفية؟

لإثقال الصفحة لا أهمّية له إطلاقًا من أجل المقروئية والوصولية فقط للطباعة الورقية

تباين كافٍ يجعل النصّ يُقرأ دون جهد، حتى لضعاف البصر وتحت شمس ساطعة.

1.4 · مفاضلة

12. الزبون متردّد في لون العلامة وقد يُغيّره. كيف تستعدّ لذلك؟

تجنّب أي لون علامة ترميز اللون ثابتًا في كل زر إعادة كل الصفحات يدويًا عند اللزوم تعريف اللون عامّةً لتغييره في كل مكان مرّة واحدة

بتعريف لون العلامة عامّةً (Site Settings)، تغيير واحد ينتشر إلى كل الموقع.

1.5 · استرجاع

13. هل يؤثّر إعدادٌ مصنوع في وضع الجوّال على الحاسوب؟

لا: ينطبق على نقطة توقّف الجوّال (والأصغر) نعم، دائمًا فقط إن أُعيد تحميل الصفحة يحذف نسخة الحاسوب

إعدادات نقطة التوقّف تنطبق على الوضع المختار (والأصغر) دون كسر الباقي.

1.5 · تطبيق

14. كيف تُخفّف صفحة على الجوّال؟

إضافة مزيد من الصور إخفاء العناصر غير المفيدة (مثل صورة زخرفية كبيرة) على الجوّال جعل كل العناوين H1 تعطيل الاستجابة

يمكن إخفاء العناصر الزخرفية/الثقيلة على الجوّال عبر المتقدّم ← الاستجابة، لصفحة أخفّ وأكثر مقروئية.

1.5 · مفاضلة

15. الصفحة مثالية في معاينة Elementor. هل يمكن التسليم؟

نعم، المعاينة تكفي دائمًا نعم، إن كان الحاسوب جميلًا لا: يجب الاختبار أيضًا على هاتف حقيقي قبل التسليم لا: يجب شراء Pro أولًا

المعاينة تساعد، لكن يُختبَر دائمًا على هاتف حقيقي (أحجام، أزرار بالإبهام، سرعة حقيقية) قبل التسليم.

وماذا بعد؟

نتيجة ≥ 80%: انتقل إلى المستوى 2 (تصميم ومحتوى غنيّ).
نتيجة < 80%: راجع 1.1 إلى 1.5 وأعِد تحدّيات 48 ساعة.