الكورس

Advertisements

HTML Headings | In Arabic


سوف نتعلم فى هذا الفصل “HTML Headings” كل المعلومات والتفاصيل حول العناوين فى HTML وكيفية إستخدامها بطريقة صحيحة والفرق بين كلًا من <h1<h2> و <h3> و <h4> و <h5> و <h6>.


 

العناوين فى لغة HTML

 

يتم تعريف العناوين فى HTML عن طريق الوسوم من <h1> إلى <h6>. لكن ما الفرق بينهم؟

يحدد <h1> العنوان الأكثر أهمية فى صفحة ويب مثل عنوان هذا الدرس (HTML Headings | In Arabic). ثم يليه العناوين الأقل أهمية من <h2> إلى <h6>.

تضيف المستعرضات تلقائيًا بعض المسافات البيضاء (Padding) قبل العنوان وبعده.

 

مثال للتوضيح:

<h1> This is Heading 1 </h1> <!-- More Important -->
<h2> This is Heading 2 </h2>
<h3> This is Heading 3 </h3>
<h4> This is Heading 4 </h4>
<h5> This is Heading 5 </h5>
<h6> This is Heading 6 </h6> <!-- Less Important -->

This is Heading 1

This is Heading 2

This is Heading 3

This is Heading 4

This is Heading 5
This is Heading 6

لا تحاول ان تستخدم عناصر العنوان لتغيير حجم النص. بدلاً من ذلك ، استخدم خاصية font-size في CSS.

تجنب تخطي مستويات العناوين: ابدأ دائمًا من<h1> ، متبوعًا بـ <h2> وهكذا.


Advertisements

 

ملاحظات – HTML Headings

 

  1. تستخدم محركات البحث العناوين لفهرسة محتوى صفحات الويب الخاصة بك ومحتواها، من المهم استخدام العناوين لإظهار بنية المستند.
  2. كل عنوان HTML له حجم افتراضي، ومع ذلك ، يمكنك تحديد حجم أي عنوان باستخدام خاصية font-size.
  3. يجب استخدام <h1> للعناوين الرئيسية ، متبوعة بالعناوين الأقل أهمية.
  4. قٌم بإستخدام <h1> واحدًا فقط لكل صفحة. يجب أن يصف بإيجاز الغرض العام من المحتوى.
  5. يسمح استخدام أكثر من <h1> بواسطة مواصفات HTML ، ولكن لا يُعد من أفضل الممارسات. يعد استخدام <h1> واحدًا مفيدًا لمستخدمي قارئ الشاشة.

 


 

قَيم نفسك – Mini quiz


قُم بإجراء هذا الإختبار القصير على درس “HTML Headings” لمعرفة مدى فهمك وإستيعابك للمعلومات السابقة، ولتثبيت المعلومات.




الإبلاغ عن خطأ

×

إذا وجد خطأ وتريد الإبلاغ عن هذا الخطأ، أو إذا كنت تريد تقديم اقتراح على شىء معين، فلا تتردد في إرسال بريد إلكتروني إلينا:

[email protected]

شكرًا لك على مساعدتك لنا!

Advertisements