U3F1ZWV6ZTMzOTMwMzA2ODk1X0FjdGl2YXRpb24zODQzODM1NjM3NzY=

[تعلم HTML] درس #5 - شرح كل عناوين النصوص Headings


نقدم لكم في دورة تعلم HTML عناوين النصوص وهي ما تعرف بـ h1 و h2 و h3 و h4 و h5 و h6 ببساطة وسهولة، وهي متعلفة جداً بما يخص الـ SEO لذا عليك فقط انت تتعلمها جيده، تابع معي الشرح بالتفصيل.

الهيدر له 6 علامات، من 1 إلى 6 ويكونوا بهذا الشكل كمثال
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

والشكل النهائي يكون مثل هذا بالضبط


لاحظ معي ان الشكل او العلامه رقم 1 كبيرة، ثم اصغر منها رقم 2 ثم اصغر منها رقم 3 إلى الآخر

كيف تقوم بتظبيط الh1 و h2 و h3 و h4 و h5 و h6 ؟
قمت بفحص موقع اليوم السابع ووجدت هذه النتيجه
فتحت الصفحه الرئيسة للموقع ووجدت هذه النتيجه بالفحص
h1 لإسم الموقع
h2 لأقسام الموقع مثل السياسة والرياضة وغيرها
h3 لأسماء المواضع
h4 إسم كاتب الموضوع
h5 إستطلاع الرأي
h6 لم اجد لها شيء في الموقع

وقمت مره أخرى بالدخول على موضوع من مواضيع الموقع، وعملت فحص وظهرت لي هذه النتيجه
h1 لإسم الموقع واسم الموضوع (لا أعرف لماذا فعلوا هذه الاعدادات بهذا الشكل)
h2 لأقسام الموقع مثل السياسة والرياضة وغيرها
h3 مواضيع أخرى على القائمة الجانبية وللكلمات الدلاليه
h4 لـموضوعات متعلقة  في نهاية الموضوع الذي فتحته
h5 و h5 لما اجد لهما شيء

الإضافه التي قمت بفحص منها اسمها web developer ويمكن تثبيتها من هنا لمتصفح "جوجل كروم" و "فاير فوكس" و "اوبرا"

بعد تثبيت الاضافه، اضغط على ايقونة الاضافه ثم اختار منها Outline و اضغط على Outline Headings ثم اضغط على Show Element Tag Names وستجد علامات ظهرت مثل h1 و h2 وغيرهما

web-developer

أو يمكن الدخول على اي موقع وتضغط بالكيبورد Ctrl+U وسيفتح معك صفحة جديده، وابحث بالكيبورد Ctrl+F واكتب مثلاً h1 وستجد ظهرت لك الـh1 بلون اصفر تقريباً ومن خلالها تعرف هي ظهرت على اي كلمه، سواء اسم الموقع او غيره، وجرب على باقي علامات الهيدر.

نكمل موضوعنا....
<p> هي للكتابه او هي اختصار لكلمة paragraph
يجب ان تكتب هكذا <p> وتكتب هنا ما تريد ثم تضع هذه مغلقه بعلامة السلاش </p>

<hr> هي تعمل خط ما بين الفقرات ولا تغلق، تبقى كما هي

لاحظ معي وشوف شكلها الطبيعي

هنا النص المكتوب

هنا النص المكتوب


كما رأيت ان يوجد فقره وهي <p> وتحتها خط وهو <hr>

الخلاصة
h1 و h2 و h3 و h4 و h5 و h6 للعناوين
<p> لكتابة فقره او مثال مثلاً
<hr> لعمل خط فاصل بين الفقرتين

المصدر w3schools

كل المواضيع لتعلم لغة HTML من هنا [تعلم لغة HTML من البداية إلى الاحتراف]

ليست هناك تعليقات
إرسال تعليق

إرسال تعليق

الاسمبريد إلكترونيرسالة