HTML | Abdelrahman Gamal

كورس html كامل بالعربي html tutorial for beginners

كورس html عبدالرحمن جمال دورة html بالعربي المقدمة من قناة عبدالرحمن جمال بشكل مجاني للمجتمع العربي هذه دورة ضمن دورة front end الموجودة على نفس القناة ماذا تعني لغة الترميز HTML؟ ما هي أنواع الوسوم - Tags أو عناصر HTML؟ وما هي المكونات الأساسية لعناصر HTML؟ وشرح باللغة العربية خطوة بخطوة لـ تعلم لغه html، كيفية إنشاء صفحة ويب بإستخدام أكواد HTML ماهي لغة الترميز HTML؟ الحروف هي إختصار HyperText Markup Language، وهي ليست لغة برمجية بالمعنى المتعارف عليه للغات البرمجة، ولكنها لغة أو طريقة لوصف محتويات صفحة الويب لبرامج التصفح، حيث أن أي برنامج متصفح انترنت يحتاج لمعرفة محتويات الصفحة من عناوين ونصوص وصور وروابط و غير ذلك من مكونات صفحة الويب، حتى تتمكن من عرضها بالشكل الصحيح، ولغة الترميز HTML، هي اللغة الرئيسية التي يتكون منها أي موقع أو صفحة على شبكة الإنترنت. وتتكون صفحة الويب من مجموعة من العناصر (Tags) أو تعرف كــ الوسوم، يكتب كل وسم بين (angle brackets) أو كما تسمى علامة أصغر من وعلامة أكبر ولا يقوم المتصفح بعرض هذه الوسوم، ولكن يقوم بعرض محتوياتها، وهناك نوعين من الوسوم. ما هي أنواع الوسوم Tags؟ النوع الأول: وهو عبارة عن وسم يتم عرض محتواه مباشرة في صفحة الويب، مثال img و input النوع الثاgي: وهو عبارة عن وسم يصف ما بداخله من نصوص ، وقد يحتوي هذا الوسم بداخله على وسم آخر كعنصر وسوف تلاحظ في هذا النوع أن كل وسم يتكون من جزئين (وسم البداية) و (وسم النهاية) وبينهما المحتوى الذي يتم عرضه في المتصفح. كيفية إنشاء صفحة ويب نبدأ أولا بفتح برنامج notepad ثم من خلال القائمة File نقوم بحفظ الملف عن طريق إختيار الأمر Save As، وبعد ذلك سوف تظهر نافذة نكتب في خانة (إسم الملف - File Name) أي إسم من إختيارك فليكن مثلا test.html ويجب كتابة إسم الملف مع إمتداد الملف ولكتابة أكواد HTML يجب أن يكون إمتداد الملف إما (.html أو .htm) و في النافذة من الخانة Save as type سوف نختار All Files وفي خانة (Encoding) سوف نختار UTF-8 وذلك لكي يدعم الملف كتابة اللغة العربية ثم نضغط Save، والشكل التالي يوضح الخطوات بالتفصيل. بعد إنشاء الملف ومعرفة المكونات الأساسية لعنصر من عناصر لغة الـ HTML سوف نبدأ بكتابة الأكواد الأساسية لإنشاء صفحة ويب (أو يمكنك نسخ محتويات المربع التالي في الملف) وبعدها سوف أشرح كل عنصر بالتفصيل. ووظيفته أن يصف للمتصفح أن الكود المستخدم هو بلغة HTML، أما الوصف lang فوظيفته أن يصف للمتصفح أن محتويات صفحة الويب سوف تكون باللغة العربية، وذلك لأننا إخترنا القيمة ar أما إذا كان المحتوى باللغة الإنجليزية فيمكن أن تكون قيمة الوصف en. وقمنا بوضع وسم البداية (Opening Tag) في أول الأكواد وفي نهاية الكود كتبنا وسم النهاية (Closing Tag)، وبعد ذلك سوف نقسم الصفحة إلى قسمين رئيسيين أولهما ومحتوى هذا الوسم لا يظهر في المتصفح، ولكنه يحتوي على معلومات عن الصفحة وعن كيفية عرض محتويات الصفحة وذلك بإستخدام العناصر وثاني قسم في صفحة الويب وكل ما يكتب بداخل هذا الوسم هو ما يتم عرضه وتنسيقه من خلال المتصفح ما هي لغة ترميز النص الفائق؟ لغة ترميز النص الفائق هي ليست لغة برمجيّة بل لغة وصفيّة (markup language) تعمل على وصف هيكلة محتويات صفحات الويب. تتألف لغة ترميز النص الفائق من مجموعة من العناصر (elements) تُستخدَم لاحتواء الأجزاء المختلفة من المحتوى لتجعله يظهر بطريقة معينة. فيمكن استخدام الوسوم المغلقة (enclosing tage)، مثلاً، لإضافة رابط تشعبي لكلمة أو لصورة يشير لموقع آخر، كما يمكن استخدامها لجعل الكلام مائل أو لتصغير الخط وتكبيره. لنأخذ النص التالي كمثال: ماذا ستتعلم في كورس تصميم مواقع الويب و كورس html مقدمة عن تصميم المواقع الالكترونية وأنواع المواقع وطرق تصميم المواقع التعريف ببرامج تصميم المواقع المختلفة و مميزات كل منها التعريف بلغة HTML المستخدمة في تصميم المواقع شرحة بنية ومحتويات ملف HTML شرح tags and containers شرح انواع content models in HTML5 أساسيات HTML شرح المسافات الفارغة والتعليفات في الكود النصوص والفقرات تنسيق الملف اضافة صور الى موقعك اضافة فيديوهات الى موقعك اضافة صوتيات الى موقعك استخدام block and inline tags Displaying characters with references Metadata and the Document Head اضافة الاسكربتات للملف استخدام الميتا تاج Meta Tag طريقة تهيئة الصفحة لمحركات البحث النصوص HTML5 استخدام الجداول Tables شرح وأستخدام أجزاء الجداول Grouping columns القوائم في لغة html اضافة نوافذ مواقع اخرى الى موقعك اضافة فيديوهات يوتيوب الى موقعك التعامل مع ال input بمختلف اشكالها