إيه هو HTML؟
HTML هو اختصار لـ “HyperText Markup Language”، ودي لغة البرمجة اللي بنستخدمها علشان ننظم وننسق المحتوى على صفحات الإنترنت. ببساطة، HTML هو اللي بيدينا القدرة على إضافة النصوص، الصور، الروابط، القوائم، والجداول على الويب.
إزاي HTML بيشتغل؟
HTML بيشتغل عن طريق العلامات (tags) اللي بنكتبها داخل الصفحة. كل علامة في HTML بتدل على نوع معين من المحتوى، زي النصوص، الصور، الروابط، أو أي حاجة تانية هتظهر في الصفحة.
الهيكل الأساسي للصفحة:
الصفحة اللي بتكتبها بلغة HTML بتتكون من جزئين رئيسيين:
- الـ
<head>: ده الجزء اللي فيه المعلومات الخاصة بالصفحة زي العنوان (title) والروابط الخاصة بالـ CSS أو JavaScript. - الـ
<body>: ده الجزء اللي بنكتب فيه المحتوى اللي هيظهر للمستخدم، زي النصوص والصور.
أهم العلامات في HTML:
<!DOCTYPE html>:
دي العلامة اللي بنستخدمها علشان نحدد نوع المستند ونقول للمتصفح إننا بنستخدم HTML5.<html>:
دي علامة البداية لكل صفحة HTML. بتحدد بداية هيكل الصفحة.<head>:
داخل الـ<head>, بنضيف البيانات الوصفية للصفحة (meta tags) و الـ title والروابط للـ CSS والـ JavaScript.<body>:
هنا بنكتب المحتوى اللي هيظهر في الصفحة للمستخدم، زي النصوص، الصور، الروابط، والجداول.
الهيكل الأساسي لصفحة HTML بسيطة:
<!DOCTYPE html>
<html>
<head>
<title>أول صفحة HTML</title>
</head>
<body>
<h1>أهلاً وسهلاً!</h1>
<p>دي أول صفحة HTML بتاعتي.</p>
</body>
</html>
إزاي نكتب أول صفحة HTML؟
- أول حاجة نكتب
<!DOCTYPE html>علشان نحدد نوع المستند. - بعد كده نفتح الـ
<html>، واللي هتكون بداية الصفحة. - داخل الـ
<head>, بنكتب العنوان باستخدام<title>، وده اللي هيظهر فوق التبويب في المتصفح. - داخل الـ
<body>, بنضيف المحتوى اللي هيظهر للزوار زي العناوين<h1>والفقرات<p>.
مثال بسيط:
ده مثال لصفحة HTML بتحتوي على عنوان وفقرة بسيطة:
<!DOCTYPE html>
<html>
<head>
<title>أهلاً بك في HTML</title>
</head>
<body>
<h1>مرحبا! ده عنوان كبير</h1>
<p>دي فقرة عادية بتظهر هنا في الصفحة.</p>
</body>
</html>
في الختام:
الجزء ده كان بداية بسيطة مع HTML، فهمنا فيه الهيكل الأساسي لصفحة HTML والعلامات الأساسية اللي هتتعامل معاها في كل صفحة تكتبها. دلوقتي تقدر تبدأ تكتب أول صفحة HTML ليك!
لو عندك أي أسئلة أو محتاج شرح أكتر في أي جزء، قولي وأنا هنا للمساعدة. لما تكون جاهز ننتقل للمقالة الجاية قول لي!
اترك تعليقاً