تعلم أساسيات HTML للمبتدئين: شرح عملي لأبسط عناصر الصفحة
ازيكم يا أصحابي عاملين ايه؟ معاكم م صموئيل غالي، وفي موضوع اليوم هنتعرف على أبسط وأهم الأساسيات في لغة HTML من كورس البرمجة العملي للمبتدئين.
مقدمة
لو انت لسه بتبدأ في مجال تصميم وبرمجة المواقع، فالموضوع ده هيكون نقطة الانطلاقة ليك. النهارده هنتكلم عن الهيكل الأساسي لأي صفحة HTML، وهنعرف كل جزء فيها مع أمثلة عملية، وهتقدر بعد الموضوع ده تكتب صفحتك الأولى بإيدك.
مثال على صفحة HTML بسيطة
<!DOCTYPE html> <html> <head> <title>عنوان الصفحة</title> </head> <body> <h1>مرحبًا بيكم في أول صفحة HTML</h1> <p>دي أول فقرة بكتبها باستخدام HTML.</p> </body> </html>
شرح عناصر الكود:
- <!DOCTYPE html>: بيحدد إننا بنستخدم HTML5.
- <html>: الجذر الرئيسي لكل محتوى الصفحة.
- <head>: بيحتوي على بيانات وصفية زي العنوان والروابط.
- <title>: عنوان الصفحة اللي بيظهر في شريط المتصفح.
- <body>: هنا بيكون المحتوى اللي المستخدم بيشوفه في المتصفح.
- <h1>: عنوان كبير ظاهر للمستخدم.
- <p>: عنصر بيحتوي على فقرة نصية.
تجربة الكود عمليًا
تقدر تجرب الكود ده على موبايلك باستخدام تطبيق SPCK Editor أو على جهازك الكمبيوتر باستخدام برنامج VS Code. فقط احفظ الملف بامتداد .html وافتحه بأي متصفح.
نصائح للمبتدئين:
- احفظ الملفات بامتداد
.html. - اهتم بترتيب الكود والمسافات علشان يكون مقروء وسهل.
- جرب كل حاجة بنفسك علشان تثبت المعلومة في دماغك.
الخاتمة
وبكده نكون خلصنا أول درس عملي في HTML واتعلمنا إزاي نكتب أبسط صفحة ويب. لو شايف إنك استفدت، متبخلش علينا بلايك للفيديو واشتراك في القناة، وفعل الجرس علشان توصلك باقي الدروس أول بأول.
لو عندك أي سؤال أو حابب نعمل فيديو عن جزء معين في HTML، سيبهولي في التعليقات.
كان معاكم م صموئيل غالي، أشوفكم في الدرس الجاي بإذن الله ✌️