الفصل الأول: مقدمة إلى HTML
1. ما هي HTML؟
HTML هي اختصار لـ HyperText Markup Language، وهي اللغة المستخدمة لإنشاء صفحات الويب. تقوم HTML بوصف الهيكل الأساسي للصفحات باستخدام ما يُعرف بالعناصر (Elements).
2. أهمية HTML في تطوير المواقع
- HTML هي الأساس لكل موقع ويب.
- تُستخدم لتحديد هيكل الصفحة ومحتواها.
- تُمكّن من إضافة نصوص، صور، روابط، قوائم، جداول، وغير ذلك.
- تُعتبر الخطوة الأولى لأي شخص يريد تعلم تطوير المواقع.
3. الأدوات اللازمة للبدء
- محررات النصوص: يمكنك استخدام محرر نصوص بسيط مثل Notepad أو محرر أكثر تقدماً مثل Visual Studio Code أو Sublime Text.
- المتصفحات: أي متصفح ويب (مثل Google Chrome أو Mozilla Firefox) لعرض الصفحات.
4. الهيكل الأساسي لملف HTML
كل صفحة HTML تحتوي على هيكل أساسي يتكون من العناصر التالية:
<!DOCTYPE html>
<html>
<head>
<title>عنوان الصفحة</title>
</head>
<body>
<!-- محتوى الصفحة هنا -->
</body>
</html>شرح الهيكل:
<!DOCTYPE html>: يخبر المتصفح بأن الملف يستخدم HTML5.<html>: العنصر الجذري (Root Element) الذي يحتوي على كل محتويات الصفحة.<head>: يحتوي على معلومات عن الصفحة مثل العنوان (Title) والميتا داتا (Metadata).<title>: عنوان الصفحة الذي يظهر في شريط المتصفح.<body>: يحتوي على المحتوى الرئيسي الذي يظهر للمستخدم على الصفحة.
5. إنشاء أول ملف HTML
خطوات إنشاء ملف HTML:
- افتح محرر النصوص المفضل لديك.
- انسخ الكود التالي:
<!DOCTYPE html>
<html>
<head>
<title>مرحباً بالعالم</title>
</head>
<body>
<h1>مرحباً بك في HTML!</h1>
<p>هذه هي أول صفحة HTML الخاصة بك.</p>
</body>
</html>- احفظ الملف بامتداد
.html، على سبيل المثال:index.html. - افتح الملف باستخدام متصفح الويب.
6. ملاحظات هامة:
- HTML ليست لغة برمجة، بل هي لغة ترميز.
- المتصفحات تُفسر كود HTML وتعرضه للمستخدم.
- يمكن تعديل كود HTML بسهولة وإعادة تحميل الصفحة لمشاهدة التعديلات.
تمارين تطبيقية:
- قم بإنشاء ملف HTML يحتوي على:
- عنوان الصفحة: “صفحة تجريبية”.
- عنوان رئيسي: “تعلم HTML”.
- فقرة: “HTML هي الخطوة الأولى لتعلم تطوير المواقع.”
- افتح الملف في متصفح الويب وتأكد من ظهور المحتوى كما هو متوقع.
بذلك تكون قد تعلمت الأساسيات للبدء مع HTML. استعد للفصل الثاني حيث سنتعلم عن العناصر الأساسية وكيفية استخدامها.
