ربما لا تصدق، لكن شبكة الويب لا تتكون فقط من سحر. خلف الكواليس تعمل لغة أبجدية HTML كبناء أساسي لكل صفحة تقريبا. تخبر أبجدية HTML محركات المستعرض عن المحتوى الذي يجب أن يظهر على الصفحة. في الوقت الحالي للمواقع. إن كنت تريد إنشاء موقع للأنترنت أو تعمل على مواقع بأي شكل من الأشكال، يجب عليك إتقان أبجدية HTML. تعلم أبجدية HTML ولغة CSS التوأم (CSS) فتح لي أفاقا جديدة لخلق وتصميم ومساعدة في إدارة مواقع ومنحنيا المهام التي أعمل بها حتى اليوم. يجب أن تكون هذه هي هدفك.
ما هو استخدام أبجدية HTML؟
تستخدم أبجدية HTML لإنشاء صفحات ويب. عندما تعرض صفحة ويب في محرك تصفح كما Google Chrome أو Safari، قام محرك التصفح بتحليل محرك أبجدية HTML وعرض عناصر المرئية كالنصوص، أيقونات، الصور والأزرار. بإستخدام أبجدية HTML لإنشاء عناصر صفحات نصية، قائمة، صور، فيديو، أزرار، نماذج وغيرها. إضافة لروابط تاريخية لمواقع أخرى بالموقع بأكمله.
مثلا، إذا كنت تريد تطوير بعض هذه العناصر والميزات، فإتقان كتابة أبجدية HTML ضروري.
مقارنة بلغات الأبجدية الأخرى للبرمجة، أبجدية HTML سهلة ومفهومة لأنها أساسا نصية باللغة الإنجليزية ببعض الأشارات الأساسية.
العنصر الأساسي في ملف HTML
المكون الأساسي في ملف أبجدية HTML هو العنصر. العنصر في أبجدية HTML هو المكون الذي يحدد محتوى الصفحة الويب أو جزء منها. يمكن أن يحدد العنصر كتابة نصية أو مكون تفاعلي كزر أو قائمة من الصفحة الويب.
تعرفنا على عناصر أبجدية HTML التالية:
وسم البداية
العناصر أو الوسام في أبجدية HTML هو وسم بداية وإنهاء (أو بداية وإنهاء). عادة الوسم المفتوح للعنصر المحدد مع اسم العنصر مثل (الفقرة). يحتوي على المحتوى بين أقواس مائلة (<>
). يمكن أن تحتوي الوسم على سمات إضافية.
كما اسم العناصر ليست حساسة للحالة. على سبيل المثال، وسم الفقرة
يمكن أن تكون الفقرة
. مع ذلك، أوصي بكتابتها كلا بأحرف كبيرة بدون شكل زائد.
المحتوى
يتم وضع محتوى العنصر بين وسمين البداية والنهاية. يمكن للمحتوى أن يكون نص، رابط، صورة أو وسائط أخرى، قائمة، أو جدول. كما يمكن أن يحتوي على عناصر أخرى.
وسم النهاية
يحدد وسم النهاية نهاية عنصر HTML. وسم النهاية يحتوي على اسم العنصر بشرط توقف الشريط (/).
سمات العنصر HTML
يمكن أن يحتوي العنصر المفتوح على سمة واحدة أو أكثر. هذه السمة هي معلومات تحدد شكل العنصر أو كيفية تصرفه. يمكن أن تكون بعض السمات إلزامية، وبعض العناصر يمكن أن تأخذ سمات إضافية. تكون السمة دائما في العنصر المفتوح في علامة أبجدية HTML. بعض السمات لديها بنية للأسماء (name="value"
) لكن بعض السمات لا تحتوي على قيمة.
لنتعرف على عنصر آخر، العنصر (<a>
) (وسام التأشير). هذا العنصر ينشئ رابط تاريخي. يحتوي على سمة اسمها href يحدد العنوان رابط التاريخي المكان. يمكن أن يأخذ وسم النظام الآلي أيضا السمات الاخرى. على سبيل المثال، إضافة السمة target="_blank"
يفتح الرابط في نافذة أو صفحة أخرى.
إنشاء ملف HTML
كيف نطبق أبجدية HTML في صفحات الويب؟ كما قلت، صفحة ويب هي مجرد ملف HTML يقوم بتحليل محرك المستعرض. لذلك، دعونا ننشئ ملف HTML.
لإنشاء ملف HTML، ستحتاج إلى محرر HTML لإنشاء أبجدية HTML.
تحميل محرر HTML وانشئ ملف جديد.
HTML:
<!DOCTYPE html> <html lang="en"> <head> <title>صفحة HTML</title> </head> <body> <h1>العنوان الأول</h1> <p>الفقرة الأولى</p> </body> </html>
العناصر الشائعة في أبجدية HTML
الإصدار الأكثر حداثة لأبجدية HTML هو HTML5. يتضمن 100 عنصر HTML. لا تقلق، فهذا العنصر يستخدم بشكل دائم في العديد من المواقع.
الفقرة هي العنصر الأكثر استخداما في أبجدية HTML. تعمل عناصر <p></p>
لتجعل النص يبدأ من سطر جديد.
العناصر هي العناصر المستخدمة في النص في أبجدية HTML. تحتوي على ستة عناصر للعنوان يمكن أن تمثل مستويات العناصر المختلفة. العنصر <h1>
هو الأكبر مستوى للعنصر والأكثر انتشارا بينما العنصر <h6>
هو الأدنى والأقل بروزا.
العنصر الصورة (<img>
) يتضمن العنصر في أبجدية HTML الصور. يتطلب العنصر سمة أو مكان الصورة.
العنصر للإشارة (<a>
) ينشئ رابط تاريخي.
العنصر للتأشيرة على النقاط (<em>
) يمثل إشارة على النقاط.
العنصر القائمة الترتيبية (<ul>
) تنشئ قائمة بالنص. بشكل افتراضي يستخدم رمز •.
العنصر القائمة الغير ترتيبية (<ol>
) تنشئ قائمة بالنص.
العنصر جدول (<table>
) تنشئ جدول.
العنصر زر (<button>
) تنشئ زر.
العنصر القائمة المنسدلة (<select>
) تنشئ قائمة منسدلة.
العنصر خط أفقي (<hr>
) يعرف خط أفقي عبر صفحة ويب.
العنصر القسم (<div>
) عنصر حاوي للمحتوى العام.
العنصر نص مضمن (<span>
) عنصر حاوي على الخط.
العنصر الفاصل البياني (<br>
) ينشئ فاصل بياني.
السمات الشائعة في أبجدية HTML
السمات تعمل على تعديل العناصر في أبجدية HTML. يمكن للسمة تغيير المظهر أو سمة العنصر، تطبيق معارف ليتم تحديدها من قبل CSS، أو توفير معلومات الإمكانيات.
تعرف على السمات الشائعة التالية في أبجدية HTML.
سمة العنصر الأساسي
سمة العنصر الأساسي يمكن استخدامها لتطبيق أبجدية CSS على العنصر. لن تطبق CSS إلا على العنصر المفتوح الذي يحتوي على سمة الأساسي.
سمة المعرف يستخدم لتعريف عنصر واحد في ملف HTML. بإستخدام السمة، يمكن تحديد العنصر بواسطة CSS. لا يمكن أن تتكرر القيمة للسمة داخل ملف HTML.
سمة الفئة
سمة الفئة يستخدم لتجميع العناصر المتعددة تحت نفس الاسم وتطبيق أنماط على كل مجموعة.
سمة الرابط
سمة الرابط يحتوي على العنوان المستهدف للرابط التاريخي. يتم إلزام سمة الرابط في عنصر وسم النظام الآلي.
سمة المصدر
كما تحتوي على عنوان وسم النظام الآلي، تحتوي عنوان الصورة على عنوان للصورة (src
) السمة.
سمة البرنامج
سمة البرنامج يوفر نص البديل، ويمثل معلومات وصفية لعنصر الصورة. يمكن أن يعرف البرنامج سمات الصورة عند عرض النص إذا لم تتمكن من النص عرض الصورة.
سمة اللغة
سمة اللغة تحدد اللغة للمحتوى بالعنصر. هذه السمة تستخدم عادة في العناصر النصية للوسم HTML
.
سمة العنوان
سمة العنوان توفر معلومات إضافية عن عنصر يمكن للمستخدم اعرافها عن شيء ما. عادة تظهر القيمة في أداة التحديد.
العنصر النموذجي
إذا كنت ترغب في تطبيق تعليم أبجدية HTML، يمكنك التعلم أبجدية HTML من البداية. لذلك تعرف على بعض المواقع التالية:
دليل المبتدئين لأبجدية HTML وCSS للمسوقين
LinkedIn Learning
Codecademy
W3C
Learn HTML
دليل أبجدية HTML للمبتدئين بواسطة HTML Dog
هل تعلم أن أبجدية HTML هي لغة برمجية؟
قد تكون قد سمعت عن لغات البرمجة كما JavaScript، وPython. على الرغم من ذلك، لا تتم الإشارة إلى أبجدية HTML كلغة برمجية، ولكن لغة برمجة. هذا لأنه على الرغم من أن جميع لغات البرمجة لها وظيفة، سواء كانت تقويم التعابير، إعلان المتغيرات، أو تحوير البيانات، أبجدية JavaScript هي الأكثر استخداما على شبكة الإنترنت ولتجنب أن يعمل المستخدم مع أبجدية HTML وCSS لجعل صفحات الويب ديناميكية وتفاعلية.
على الرغم من أنها لغة برمجية، أبجدية HTML لا تفعل أي شيء فعليا في الوظيفة. إنها فقط تعطي المتصفح بالمعلومات المطلوبة للعرض. لا يعني أبجدية HTML كيفية عرض المحتوى، طالما تم توفير عنوان المحتوى. بمعنى آخر، أبجدية HTML لها غرض هيكلي، ليس غرض وظيفي.
أنت على استعداد للتكويد بالأبجدية.
أبجدية HTML هي لغة الحاسب الآلي التي نعرف عنها أنها لتحليل الملفات النصية وتعديلها للعرض. أبجدية HTML هي أكثر لغات الويب شيوعا. تجعل العناصر نص، صور، أزرار، فيديو، وغيرها. بإتقان العناصر الأساسية لها يمكن تغيير المواقع دون اعتماد على وقت أو نفقات أكبر لتطوير الموقع.ملاحظة المحرر: تم نشر هذه المقالة بالأصل في فبراير 2022 وتم تحديثها للشمولية.