ما هو ملف HTML؟
HTML (Hyper Text Markup Language) هو امتداد لصفحات الويب التي تم إنشاؤها للعرض في المتصفحات. تُعرف لغة HTML بلغة الويب ، وقد تطورت مع متطلبات متطلبات المعلومات الجديدة ليتم عرضها كجزء من صفحات الويب. يُعرف المتغير الأخير باسم HTML 5 الذي يوفر قدرًا كبيرًا من المرونة للعمل مع اللغة. يتم استلام صفحات HTML إما من الخادم ، حيث يتم استضافتها ، أو يمكن تحميلها من النظام المحلي أيضًا. تتكون كل صفحة HTML من عناصر HTML مثل النماذج والنصوص والصور والرسوم المتحركة والروابط وما إلى ذلك. يتم تمثيل هذه العناصر بالعلامات والعديد من العناصر الأخرى حيث تبدأ كل علامة ونهايتها. يمكنه أيضًا تضمين التطبيقات المكتوبة بلغات البرمجة النصية مثل JavaScript و Style Sheets (CSS) لتمثيل التخطيط العام.
نبذة تاريخية
منذ إنشائها ودورها الأول ، تم الحفاظ على مواصفات HTML من قبل اتحاد شبكة الويب العالمية (W3C) منذ عام 1996. في عام 2000 ، أصبحت أيضًا معيارًا دوليًا (ISO / IEC 15445: 2000). في عام 1999 ، تم نشر HTML 4.01. في عام 2004 ، بدأت مجموعة عمل Web Hypertext Application Technology (WHATWG) العمل على إصدار HTML5 الذي أصبح تسليماً مشتركًا مع W3C في عام 2008. وتم الانتهاء منه وتوحيده في 28 أكتوبر 2014.
بنية تنسيق ملف HTML
يتكون مستند HTML 4 من ثلاثة أجزاء:
- سطر يحتوي على معلومات إصدار HTML
- قسم رأس تصريحي
- جسم يحتوي على المحتوى الفعلي للمستند. يمكن تنفيذ الجسم بواسطة عنصر BODY أو عنصر FRAMESET لاحتواء الجسم في إطارات
يمكن أن يكون كل قسم في المقدمة أو متبوعًا بمسافات بيضاء وأسطر جديدة وعلامات تبويب وتعليقات. مثال على مستند HTML بسيط كما هو موضح أدناه:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Understanding HTML File Format</TITLE>
</HEAD>
<BODY>
<P>Hello World!
</BODY>
</HTML>
معلومات الإصدار
السطر الأول من التعليمات البرمجية ، <!DOCTYPE html> ، يسمى إعلان نوع المستند ويخبر المتصفح بإصدار HTML الذي تمت كتابة الصفحة به. اعتمادًا على إصدار HTML ، هناك عدد من تصريحات نوع المستند المختلفة التي تسمي تعريف نوع المستند (DTD) المستخدم للمستند. يختلف كل DTD عن الآخر في العناصر التي يدعمها ويختلف على النحو التالي:
- HTML 4.01 صارم - يشمل جميع العناصر والسمات التي لم يتم إهمالها أو لا تظهر في مستندات مجموعة الإطارات
- HTML 4.01 Transitional - يتضمن كل شيء في DTD الصارم بالإضافة إلى العناصر والسمات المهملة (معظمها يتعلق بالعرض المرئي
- مجموعة إطارات HTML 4.01 - تتضمن كل شيء في DTD الانتقالي بالإضافة إلى الإطارات
بالنسبة إلى ** HTML5 ** ، تكون معلومات الإصدار كما هو مذكور أدناه.
<!DOCTYPE html>
معلومات رأس HTML
يمكن أن يتضمن رأس مستند HTML عددًا من عناصر HTML التي لا يتم تقديمها بواسطة المستعرض. هذه العناصر هي إما بيانات وصفية تصف معلومات حول الصفحة أو تتضمن أقسامًا تُستخدم لجلب المعلومات من مصادر خارجية مثل أوراق أنماط CSS أو ملفات JavaScript. يتم تمثيل رأس الصفحة بعلامة الرأس.
لتعيين عنوان الصفحة ، فإن عنصر ** title ** هو العنصر الوحيد المطلوب داخل ملف العلامات. يتم استخدام نفس الشيء بواسطة محركات البحث لتحديد عنوان الصفحة.
معلومات HTML Body
هذا هو القسم الرئيسي في الملف الذي يحتوي على جميع محتويات الملف التي تعرضها المتصفحات. يمكن أن يحتوي نص Html على علامات يمكن أن تشير إلى العديد من الكتل الإنشائية في شكل علامات. يمكن أن تحتوي على عدة أنواع مختلفة من المعلومات مثل النصوص والصور والألوان والرسومات وما إلى ذلك. بالإضافة إلى ذلك ، يمكن أيضًا تضمين عناصر الصوت والفيديو في نص html لعرضها بواسطة المتصفحات. في ظل وجود تطبيق أوراق الأنماط الحديثة للتمثيل المرئي ، تم إهمال سمات عرض BODY مثل لون الخلفية ولون الرابط ولون النص وما إلى ذلك. وبالتالي ، يمكن تحقيق نفس التأثيرات باستخدام أوراق الأنماط كما هو موضح أدناه:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Inline Style Sheets referencing</TITLE>
<STYLE type#"text/css">
BODY { background: white; color: black}
A:link { color: red }
A:visited { color: maroon }
A:active { color: fuchsia }
</STYLE>
</HEAD>
<BODY>
... document body...
</BODY>
</HTML>
من السهل تضمين أوراق الأنماط المضمنة وللتطبيقات السريعة للتأثيرات المرئية ، فإن أوراق الأنماط الخارجية تجعلها أكثر ملاءمة للنشر مرة واحدة والوصول إليها في العديد من الأماكن.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Linking to External style sheets</TITLE>
<LINK rel#"stylesheet" type#"text/css" href#"smartstyle.css">
</HEAD>
<BODY>
... document body...
</BODY>
</HTML>
عناصر HTML
كما ذكرنا سابقًا ، يتم تمثيل المحتويات داخل HTML Body بعلامات ، تُعرف أيضًا باسم عناصر Html. يمكن أن تحتوي كل علامة على معلومات إضافية في شكل سمات مكتوبة بتنسيق<tag attribute1#“value1” attribute2#“value2”> ، على الرغم من أنه ليس من الضروري وجود سمات مع كل علامة. إذا لم يتم ذكر السمات ، يتم استخدام القيم الافتراضية في كل حالة. فيما يلي بعض أمثلة العنصر:
العنوان
<head>
<title>The Title</title>
</head>
العناوين
<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>
الفقرات
<p>Paragraph 1</p> <p>Paragraph 2</p>