Google Play badge

لغة ترميز النصوص التشعبية


لغة ترميز النص التشعبي (HTML)

HTML تعني لغة توصيف النص التشعبي. إنها لغة الترميز القياسية للمستندات المصممة للعرض في متصفح الويب. يمكن دعم HTML بتقنيات مثل Cascading Style Sheets (CSS) ولغات البرمجة النصية مثل JavaScript.

تأسيس الويب

الإنترنت في جوهره عبارة عن شبكة واسعة من أجهزة الكمبيوتر المتصلة عالميًا. الطريقة الأساسية التي نتفاعل بها مع هذه الشبكة هي من خلال شبكة الويب العالمية (WWW)، وهي نظام من مستندات النص التشعبي المترابطة التي يمكن الوصول إليها عبر الإنترنت. توجد في قلب شبكة الويب العالمية صفحات الويب، وهي عبارة عن مستندات مكتوبة بلغة HTML. يوفر HTML البنية الأساسية للمواقع، والتي يتم بعد ذلك تحسينها وتعديلها بواسطة تقنيات أخرى مثل CSS وJavaScript.

هيكل وثائق HTML

يتم تنظيم مستند HTML وفقًا لمجموعة من العلامات المتداخلة، وهي عناصر محاطة بأقواس زاوية. تخبر هذه العلامات متصفح الويب بكيفية عرض المحتوى. مثال على بنية مستند HTML بسيط هو:

 <!DOCTYPE html>
<أتش تي أم أل>
    <الرأس>
        <title>عنوان الصفحة</title>
    </الرأس>
    <الجسم>
        <h1>هذا عنوان</h1>
        <p>هذه فقرة.</p>
    </الجسم>
</html>

يحدد هذا الرمز صفحة ويب أساسية تحتوي على عنوان وعنوان وفقرة من النص.

عناصر وعلامات HTML

تتكون مستندات HTML من عناصر HTML. يتم تمثيل كل عنصر بعلامة بداية، وبعض المحتوى، وعلامة نهاية. علامتي البداية والنهاية للعنصر متطابقتان، باستثناء أن علامة النهاية تتضمن شرطة مائلة للأمام قبل اسم العنصر.

على سبيل المثال، تحتوي العلامة <code><p></code> على فقرة من النص، ويتم تنظيمها على النحو التالي:

 <p>هذه فقرة نموذجية.</p>

العناصر المختلفة تخدم أغراضًا مختلفة. على سبيل المثال:

صفات

يمكن أن تحتوي عناصر HTML على سمات توفر معلومات إضافية حول العناصر. يتم وضع السمات ضمن علامة البداية للعنصر وغالبًا ما يتم تقديمها في أزواج الاسم/القيمة مثل <code>name="value"</code>.

على سبيل المثال، لتضمين صورة، نستخدم العلامة <code><img></code> مع السمة <code>src</code> (المصدر) لتحديد عنوان URL للصورة:

 <img src="url to image.jpg" alt="وصف الصورة">

توفر السمة <code>alt</code> نصًا بديلاً للصورة إذا تعذر عرضها.

الروابط والملاحة

يؤدي استخدام العلامة <code><a></code> إلى إنشاء ارتباطات تشعبية، والتي تعتبر أساسية لترابط الويب. يمكن للارتباط التشعبي الارتباط بصفحة ويب أخرى، أو قسم مختلف في نفس الصفحة، أو حتى ملف قابل للتنزيل. على سبيل المثال:

 <a href="https://example.com">تفضل بزيارة example.com</a>

يؤدي هذا إلى إنشاء رابط إلى <code>https://example.com</code>.

القوائم

يوفر HTML عناصر لإنشاء القوائم. هناك نوعان أساسيان من القوائم:

يتم تضمين كل عنصر في القائمة ضمن علامة <code><li></code> (عنصر القائمة).

HTML5

يعد HTML5 أحدث تطور للمعيار، حيث يقدم العديد من الميزات الجديدة التي تعكس الاحتياجات الحديثة للوسائط المتعددة والمستندات التفاعلية. وتشمل هذه العناصر الهيكلية الجديدة (<code><header></code>، <code><footer></code>، <code><article></code>، <code><section></code>) والعناصر الرسومية (<code><canvas></code> للرسم، <code><svg></code> للرسومات المتجهة القابلة للتطوير)، وعناصر الوسائط (<code><audio></code> و<code> <فيديو></كود>).

HTML الدلالي

يشير HTML الدلالي إلى استخدام ترميز HTML لتعزيز دلالات أو معنى المعلومات الموجودة في صفحات الويب. بدلاً من مجرد تحديد كيفية ظهور العناصر أو سلوكها (هذه مهمة CSS وJavaScript)، يصف HTML الدلالي بنية المحتوى ونوعه بدقة. على سبيل المثال، تشير العلامة <code><article></code> إلى أن المحتوى الموجود بداخلها عبارة عن مقالة، بينما تشير العلامة <code><nav></code> إلى قائمة التنقل.

يؤدي استخدام لغة HTML الدلالية إلى تحسين إمكانية الوصول إلى محتوى الويب وإمكانية البحث فيه، مما يجعله أكثر قابلية للاستخدام والاكتشاف.

خاتمة

HTML هي التقنية الأساسية لشبكة الويب العالمية، حيث توفر البنية الأساسية لصفحات الويب. من خلال استخدام العلامات والسمات والعناصر، يسمح HTML بإنشاء مستندات منظمة. من خلال فهم لغة HTML واستخدامها، يمكن للمرء إنشاء نطاق واسع من المحتوى الذي يمكن الوصول إليه على الويب، بدءًا من المستندات النصية البسيطة وحتى تجارب الوسائط المتعددة التفاعلية المعقدة. كأساس لتطوير الويب، يعد إتقان لغة HTML أمرًا ضروريًا لأي شخص يتطلع إلى التصميم أو التطوير للويب.

Download Primer to continue