الدرس 4
فهم Head وتداخل العناصر ودعم اللغة العربية
معنى أسماء العناصر والخصائص
ال head معناها رأس المستند وال title معناها عنوان وال meta اسم مرتبط ب Metadata يعني بيانات بتوصف الصفحة
ال lang اختصار ل Language يعني اللغة وال dir اختصار ل Direction يعني الاتجاه ودول خصائص بنضيفها للعناصر مش عناصر مستقلة
هنكمل على مشروع المكتبة ونخلي محتواه عربي مع وصف واضح للصفحة
جهز معلومات الصفحة
<!doctype html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="description" content="مكتبة لكتب البرمجة وتطوير الويب">
<title>مكتبة البرمجة</title>
</head>
<body>
<h1>مكتبة البرمجة</h1>
<p>ابدأ رحلتك مع <strong>كتب الويب</strong></p>
</body>
</html>ال lang بتعرف لغة المستند أما dir فبتحدد اتجاهه الأساسي
تحديد اللغة العربية لوحده مش بديل عن تحديد الاتجاه من اليمين للشمال
ال UTF-8 بيسمح بتمثيل حروف لغات مختلفة واحفظ الملف نفسه بنفس الترميز من المحرر
ال description بتوصف الصفحة ومش بتظهر كفقرة داخل body
يعني إيه عناصر متداخلة
في المثال عنصر strong موجود داخل الفقرة علشان يحدد جزء له أهمية قوية من الكلام
فتحنا الفقرة ثم strong وقفلنا strong قبل ما نقفل الفقرة
<p>Learn <strong>HTML</strong> Today</p>تخيل العناصر كصناديق جوه بعضها وكل صندوق داخلي لازم ينتهي قبل الصندوق اللي بيحتويه
مش كل عنصر له وسم إغلاق
ال meta من العناصر الفارغة اللي مفيهاش محتوى داخلي ومش بنكتب لها وسم إغلاق
ده مختلف عن p اللي ليها بداية ومحتوى ونهاية
وصف الصفحة قد تستخدمه محركات البحث في نتائجها لكنه مش ضمان للنص اللي هيظهر ولا وسيلة مضمونة لرفع ترتيب الصفحة
جرب بنفسك
اكتب وصف مناسب لمكتبتك وغير النص الموجود داخل strong
راجع إن الفقرة عربية من اليمين للشمال وإن عنوان ال Tab هو الاسم اللي اخترته
شكل الصفحة بعد كتابة ال Code بشكل سليم
