4 – تركيب ملف HTML (HTML Document Structure) – مقدمة في HTML – المستوى الأول: الأساسيات
📌 تركيب ملف HTML (HTML Document Structure)
أي ملف HTML له بنية ثابتة لازم تبدأ بيها علشان المتصفح يفهم الكود ويعرض الصفحة بشكل صحيح.
خلينا نشرح المكونات الأساسية واحد واحد:
🔹 1. سطر التعريف (Document Type Declaration)
-
هذا السطر لا يُعتبر وسم (Tag).
-
وظيفته: يخبر المتصفح إن الملف مكتوب بلغة HTML5 (أحدث إصدار).
-
لازم يكون في أول سطر في الملف.
🔹 2. وسم <html>

-
هو الجذر (Root Element) لكل عناصر الصفحة.
-
بداخله كل المحتويات تنقسم لقسمين: <head> و <body>.
-
خاصية lang=”ar” بتحدد لغة الصفحة (عربي هنا).
🔹 3. القسم <head>

-
يحتوي على معلومات عن الصفحة (Metadata) مش بتظهر للمستخدم مباشرة.
أهم العناصر داخل <head>:
1- ترميز الأحرف
-
يخلي الصفحة تدعم جميع اللغات (العربية، الإنجليزية… إلخ).
عنوان الصفحة

-
يظهر في شريط المتصفح أو التبويب (Tab).
وسوم إضافية شائعة:
-
وسم الـ viewport للهواتف:
وصف الصفحة لمحركات البحث (SEO):
ربط ملف CSS خارجي:
ربط ملف JavaScript:
🔹 4. القسم <body>

-
هنا بنكتب المحتوى الفعلي اللي يقدر المستخدم يشوفه.
-
أمثلة على العناصر داخل <body>:
-
النصوص <h1> – <h6>, <p>
-
الصور <img>
-
الروابط <a>
-
الجداول <table>
-
النماذج <form>
-
الفيديو والصوت <video>, <audio>
-
5. مثال كامل لملف HTML أساسي
🔹 6. ملخص الهيكل العام
🎯 النتيجة:
-
أي صفحة HTML صحيحة لازم تحتوي على 3 أجزاء رئيسية:
-
<!DOCTYPE html>
-
<head>
-
<body>
-