انقر هنا للعودة إلى العمود التعليمي HTML HTML.
أعلاه: قائمة الفصل 1
المصدر الأصلي
حلول التصميم الموحدة - كتيبالتمييز
والأناقة الجزء 1: انخفض مع بدء الترميز بالارتياح عنوان الفصل 2 ملخص:لا تحتاج جميع صفحات الويب إلى الحصول على عناوين ، ولكن يمكنها إضافة الكثير من الألوان لتصميم الويب وسهولة الاستخدام إذا تم وضع علامة عليها بشكل صحيح.
من حيث المظهر ، يكون عنوان صفحة الويب عادةً حجمًا أكبر للخط ، وقد يستخدم لونًا أو خطًا مختلفًا من النص الرئيسي. تتمثل وظيفة العنوان في وصف الموضوع الذي تمت مناقشته بإيجاز في الفصول اللاحقة. يصفها W3C مثل هذا - يعرض ملخص كل فقرة في صفحة الويب.
كيفية إنشاء عنوان صفحة لجعل المعلومات التي نريد تقديم الاستخدام الأكثر فعالية؟ في هذا الفصل ، سندرس العديد من الطرق الشائعة الاستخدام للتعامل مع العناوين ، ونحاول معرفة واحدة من أكثر الطرق فائدة لنا ، وبعد ذلك سنستخدم بعض نصائح وحيل CSS لتزيين أفضل طريقة.
ما هي أفضل طريقة لإنشاء عنوان مستند؟قبل الإجابة على هذا السؤال ، لنفترض أن العنوان يتم وضعه الآن في الجزء العلوي من المستند ، ودعونا نلقي نظرة على ثلاث طرق لتحقيق تأثيرات مماثلة.
الطريقة أ: هل من المنطقي؟<span class = heading> Super Cool Page Title </span>
على الرغم من أن العلامة <span> هي علامة مريحة في بعض الحالات ، إلا أنها لا معنى لها لعناوين الصفحة. الفائدة الوحيدة لاستخدام هذه الطريقة هي أنه يمكننا تحديد نمط CSS لفئة العنوان بحيث يبدو النص مثل العنوان.
.
حجم الخط: 24 بكسل ؛
خط الرصيف: جريئة ؛
اللون: الأزرق.
}
الآن ، ستصبح جميع الرؤوس ذات العناوين أكبر وأكثر سمكًا وأزرقًا ، وهو أمر رائع؟ ولكن ماذا لو استخدم شخص ما متصفحًا لا يدعم CSS للوصول إلى هذه الصفحة؟
على سبيل المثال ، ماذا يحدث إذا وضعنا أنماط CSS في ملف ورقة أنماط خارجي غير مدعوم من المتصفح القديم - أو عندما تقرأ الشاشة الصفحة للمستخدم المعاق؟ المستخدمون الذين يصلون إلى هذه الصفحة من خلال هذه القنوات لن يروا (لا صوت) الفرق بين العنوان والنص.
تصف طريقة التعليقات التعليمية مثل class = adding قليلاً معنى محتوى العلامة ، ولكن <span> مجرد حاوية للأغراض العامة ، والتي تسمح فقط لمعظم المتصفحات بتغيير نمط العرض الافتراضي.
عندما يزحف محركات البحث في هذه الصفحة ، فإنهم سيتخطون علامة <span> كما لو لم تكن موجودة ، ولن تزيد من وزن الكلمات الرئيسية التي قد يتم تضمينها. في وقت لاحق ، سيتم ذكر المزيد من العلاقات بين محركات البحث وعناوين الصفحات في هذا الفصل.
أخيرًا ، نظرًا لأن علامة <span> عنصر مضمّن ، نحتاج في الغالب إلى وضع محتوى الطريقة A في حاوية أخرى على مستوى الكتلة ، مثل <p> أو <viv> ، بحيث يمكن أن تشغل سطرًا واحدًا. هذا سيولد الكثير من الكود غير الضروري. حتى إذا قمت بإضافة الحاوية المطلوبة ، فإن المتصفحات التي لا تدعم CSS ستظل تعرض النص بطريقتها الأصلية ، بحيث لا يمكن للمستخدمين رؤية أي فرق بين العنوان والجسم.
الصفحة السابقة 1 2 3 4 5 الصفحة التالية اقرأ النص الكامل