Learn HTML In Arabic 2021 - #20 - Layout With Div And Classes

About this video

**ملخص النص باللغة العربية:** - الهدف من الشرح هو تصميم هيكل (بنية) موقع ويب باستخدام HTML فقط بدون استخدام CSS أو أي تنسيقات. - يتم التركيز على فهم البنية الأساسية للمواقع مثل أمازون، والتي تتكون عادةً من: 1. **الهيدر (Header):** يحتوي على الشعار (Logo) وعلى الروابط الرئيسية التي تكون غالبًا ضمن قائمة غير مرتبة (Unordered List). 2. **نافيجيشن بار (Navigation Bar):** شريط التنقل الذي يحتوي على روابط داخلية للموقع. 3. **المحتوى الرئيسي (Content):** يوجد عادةً على اليسار ويحتوي على النصوص والصور. 4. **السايدبار (Sidebar):** يوجد على اليمين ويتضمن الأقسام، الصور، وأحدث المنشورات أو المستخدمين. 5. **الفوتر (Footer):** الجزء السفلي من الموقع الذي يحتوي على معلومات إضافية. - تم استخدام تقنيات مثل `` و `` لتحديد أجزاء مختلفة من الموقع ليتم تعديلها لاحقًا باستخدام CSS. - أمثلة على العناصر التي يمكن إضافتها: - في الهيدر: Logo وروابط رئيسية (Home, About, Services, Contact Us). - في نافيجيشن بار: مجموعة من الروابط الداخلية. - في المحتوى: نصوص وصور. - في السايدبار: أقسام، صور، وأحدث الأعضاء. - في الفوتر: معلومات اتصال أو حقوق الملكية. - تم التأكيد على أن التركيز حاليًا هو على الهيكل وليس الشكل، وسيتم تحسين التصميم باستخدام CSS لاحقًا. - سيتم شرح كيفية استخدام العناصر الدلالية (Semantic Elements) في درس لاحق لتسهيل فهم المحتوى وتوضيح الفرق بين الطريقتين. - الدرس يهدف إلى تبسيط فكرة تصميم المواقع وتقديم أساس قوي لفهم كيفية بناء مواقع الويب بشكل منظم. **ختامًا:** تم بنجاح إنشاء الهيكل الأساسي للموقع باستخدام تقنيات HTML البسيطة، وسيتم تحسينه باستخدام CSS في المستقبل إن شاء الله.


Course: Learn HTML In Arabic 2021

**وصف الدورة: تعلم HTML باللغة العربية 2021** تهدف دورة "تعلم HTML باللغة العربية 2021" إلى تقديم أساسيات وأساسيات لغة البرمجة HTML بطريقة سهلة وميسرة للمبتدئين. تعتمد الدورة على شرح مفاهيم HTML الأساسية من خلال أمثلة عملية واقعية تسهم في فهم أعمق لآلية عمل المواقع الإلكترونية. يتم التركيز بشكل خاص على كيفية استخدام التعليقات (Comments) داخل الكود، وهي أداة مهمة جداً لشرح الأجزاء المختلفة من البرنامج سواء لنفسك أو لزملائك في الفريق. ستتعلم كيفية كتابة تعليقات بسيطة أو متعددة الأسطر، وكيفية التعامل مع العناصر التي تريد إخفاءها مؤقتاً باستخدام خاصية التعليقات. تشمل الدورة كذلك شرحًا تفصيليًا حول العناوين (Headings) في HTML، والتي تعد جزءًا أساسيًا من أي صفحة ويب. سيتم التطرق إلى المستويات الستة للعناوين (من H1 إلى H6) وكيفية استخدامها بشكل صحيح لضمان تنظيم الصفحة بطريقة منطقية وجذابة. كما سيتم شرح أهمية هذه العناوين بالنسبة لتحسين محركات البحث (SEO)، حيث أن عنوان H1 يمثل عنوان الصفحة الرئيسي ويجب أن يكون فريدًا ولا يتكرر. سيتعرف الطلاب أيضًا على كيفية ترتيب العناوين بطريقة هرمية صحيحة لتجنب أي مشاكل تصميم أو أخطاء تقنية قد تؤثر على أداء الموقع. بالإضافة إلى ذلك، ستتناول الدورة موضوعات أخرى مثل التنسيقات الافتراضية التي توفرها المتصفحات (User Agent Stylesheet) وكيفية التعامل معها قبل الغوص في تعلم CSS لاحقًا. ستكتسب المهارات اللازمة لفهم كيفية عمل العناصر المختلفة داخل صفحة الويب وكيفية إنشاء بنية صحيحة ومنظمة للصفحات باستخدام HTML. بنهاية هذه الدورة، سيكون الطلاب قادرين على كتابة كود HTML احترافي ومبسط، مما يضعهم على الطريق الصحيح نحو احتراف تطوير الويب.

View Full Course