HTML – البنية الأساسية

لغة ترميز النصوص التشعبية (HTML) هي الأساس لإنشاء صفحات الويب. كل صفحة ويب تعتمد على مجموعة من العناصر الأساسية التي تحدد هيكل ومحتوى الصفحة. في هذا الدرس، سنتعرف على العناصر الأساسية التي يجب أن تكون موجودة في أي ملف HTML لضمان هيكلة صحيحة ومتوافقة مع المعايير.

يتكون أي ملف HTML من أربعة عناصر رئيسية، وهي:

إعلان نوع المستند (DOCTYPE)
عنصر الجذر <html>
قسم الرأس <head>
قسم الجسم <body>

إعلان عن نوع المستند (DOCTYPE)

HTML

<!DOCTYPE html>

يستخدم هذا الإعلان لتحديد نوع المستند ويشير إلى أن الملف يستخدم HTML5، وهي النسخة الأحدث والأكثر استخدامًا من HTML.

2. عنصر الجذر `<html>`

HTML

<html lang="ar">

هذا العنصر هو الجذر الذي يحتوي على جميع عناصر الصفحة الأخرى. تحدد السمة lang لغة الصفحة (في هذا المثال، اللغة العربية).

3. قسم الرأس `<head>`

HTML

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>عنوان الصفحة</title>
</head>

قسم الرأس يحتوي على معلومات حول الصفحة لا يتم عرضها مباشرة للمستخدم، ولكنها مهمة للمتصفحات ومحركات البحث. العناصر الأساسية في هذا القسم تشمل:

<meta charset=”UTF-8″>: يحدد مجموعة الأحرف المستخدمة في المستند.
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>: يجعل الصفحة متجاوبة مع مختلف أحجام الشاشات، خصوصًا الأجهزة المحمولة.
<title>عنوان الصفحة</title>: يحدد عنوان الصفحة الذي يظهر في شريط العنوان للمتصفح.

4. قسم الجسم `<body>`

HTML

<body>
    <h1>مرحبا بالعالم!</h1>
    <p>هذه هي الفقرة الأولى.</p>
</body>

يحتوي هذا القسم على المحتوى المرئي الذي يراه المستخدمون في صفحة الويب. يمكن أن يتضمن النصوص، الصور، الروابط، الجداول، القوائم، وغيرها من العناصر.

مثال شامل

HTML

<!DOCTYPE html>
<html lang="ar">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>صفحة تجريبية</title>
</head>
<body>
    <h1>مرحبا بالعالم!</h1>
    <p>هذه هي الفقرة الأولى في صفحتنا التجريبية.</p>
    <a href="https://example.com">اضغط هنا لزيارة الموقع</a>
    <img src="image.jpg" alt="صورة توضيحية">
</body>
</html>

الخلاصة

الالتزام بهذه البنية الأساسية يضمن لك صفحة HTML صحيحة ومبنية بشكل جيد. هذه العناصر الأربعة هي الأساس في أي ملف HTML وتعتبر البداية التي يجب أن يعتمد عليها كل مطور ويب.