Headlines کي ٺاهڻ لاء فانٽ، سرحدون، ۽ تصويرون استعمال ڪريو
گھڻيون ويب پيج تي عام سرون عام آھن. حقيقت ۾، تمام گهڻو لکندڙ دستاويز گهٽ ۾ گهٽ هڪ سرڪش ۾ هوندو آهي انهي ڪري توهان کي پڙهڻ جو عنوان ڄاڻو ٿا. اهي سر لنڊن HTML سرنگ عناصر استعمال ڪندي ڪوڊ ٿيل آهن - h1، h2، h3، h4، h5، and h6.
ڪجھ سائيٽن تي، توهان اهو ڳولي سگهو ٿا ته اهي سر لنڊن انهن عناصرن کي استعمال ڪرڻ کانسواء ڪوڊ لڳل آهن. ان جي بدران، سر لنڊن خاص صنف خاصيتن سان پيراگراف استعمال ڪري سگھن ٿا، يا ڪلاس عناصر سان ڊويزن. اهو ئي سبب آهي جو مون اڪثر هن غلط عمل بابت ٻڌن ٿا ته ڊزائنر "رستي جو عنوان نظر نٿو اچي." ڊفالٽ طرفان، مٿيون نموني ۾ ڏيکاريل آهن ۽ اهي سائيز ۾ تمام وڏا هوندا آهن، خاص طور تي H1 ۽ H2 عناصر آهن، جيڪو صفحي جي لکت جي ڀيٽ ۾ گهڻو وڏو فوٽ سائيز ۾ ڏيکاريندو آهي. ذهن ۾ رکو ته هي صرف انهن عنصر جو ڊفالٽ نظر آهي! سي ايس ايس سان، توهان مٿيون نظر ٺاهي سگهو ٿا پر توهان چاهيو ٿا! توهان فونٽ جي ڊيزائي کي تبديل ڪري سگهو ٿا، بٽڻ کي ختم ڪري ڇڏيو. صفحي جي سر لنڊن کي ڪوڊنگ لاء صحيح طريقا آهن. هتي ڪجهه سبب آهن.
سرنگن جي ڊاڪٽرن جو استعمال ڇو بلڪه DIVs ۽ اسٽائل کان
ٽيگ جي سرز وانگر انجڻ ڳولڻ
هي مٿيون استعمال ڪرڻ جو بهترين سبب آهي، ۽ انهن کي صحيح حڪم ۾ استعمال ڪريو (يعني h1، پوء h2، پوء h3 وغيره). سرچ انجڻ جيڪي ٽئگ سرن ۾ شامل هوندا آهن انهن ۾ سڀ کان وڌيڪ وزن ڏين ٿيون ڇاڪاڻ ته انهي متن جي هڪ قيمتي قيمت آهي. ٻين لفظن ۾، توهان جي صفحي جي عنوان H1 جي ليبل ڪندي، توهان ڳولها انجڻ اسپيڊر کي ٻڌائي ٿو ته اهو صفحي جي # توجہ آهي. H2 سرنگون # 2 زور ۽ زور تي آھن.
توهان کي ياد رکڻ گهرجي ته توهان جي سر لائنن کي وضاحت ڪرڻ لاء ڪهڙي ڪلاس توهان کي استعمال ڪيو وڃي
جڏهن توهان کي خبر آهي ته توهان جا سڀئي ويب صفحا هڪ H1 جو چرچ، 2em ۽ پيرو هوندو آهي، پوء توهان هڪ ڀيرو پنهنجي شيسٽ شيٽ ۾ وضاحت ڪري سگھو ٿا ۽ مڪمل ڪيو وڃي. 6 مهينن بعد، جڏهن توهان ٻئي صفحي کي شامل ڪيو ٿا، توهان پنهنجي صفحي جي مٿي تي H1 ٽاڪ شامل ڪريو ٿا، توهان کي ٻين صفحن ڏانهن واپس وڃڻ جي ضرورت نه آهي ته حاصل ڪرڻ لاء ڪهڙو شناخت يا ڪلاس جيڪي توهان استعمال ڪيو مٿيون ۽ ذيلي سر.
اهي هڪ مضبوط صفحو انڊائينڊ فراهم ڪن ٿا
عڪس ٺاهڻ واريون متن پڙهڻ لاء آسان. ڇو جو گهڻو ڪري آمريڪي اسڪولن شاگردن کي هڪ خطوط لکڻ کان اڳ سيکارڻ کان اڳ اهي لکڻيون لکڻيون آهن. جڏهن توهان مٿي واري ٽيگ کي هڪ فوري طور تي فارميٽ ۾ استعمال ڪندا آهيو، توهان جي متن هڪ صاف ڍڪيل آهي جيڪا تمام جلدي ظاهر ٿئي ٿي. گڏوگڏ، اهڙا اوزار موجود آهن جيڪي صفحو لائن جي نظرثاني ڪرڻ سان گڏ گڏوگڏ مهيا ڪرڻ لاء، ۽ اهي انڊسٽري جي جوڙجڪ لاء ٽيگ تي سرفراز ٿين ٿيون.
توهان جو صفحو به انداز سان بند ڪري ڇڏيندو آهي
هرڪو اهو نٿو ڪري سگهجي ته اهي شيٽنگ شيٽ ڏسي (يا اهو واپس # 1 اچي ٿو - ڳولا انجڻ توهان جي صفحي جي مواد (متن) کي ڏسو، طرز چادر نه هوندي). جيڪڏهن توهان سرنگ ٽيگ کي استعمال ڪريو ٿا، توهان پنهنجي صفحن کي وڌيڪ رسائي بنايندا آهيو ڇو ته سرٽيفڪيٽ اها معلومات فراهم ڪري ٿي جيڪا هڪ ڊي ٽيگ نه هجي ها.
اهو اسڪرين لاء پڙهندڙ ۽ ويب سائيٽ تائين رسائي لاء مددگار آهي
سرنگن جو مناسب استعمال دستاويزن کي هڪ منطقي جوڙجڪ ٺاهي ٿو. اهو اهو آهي ته ڇا اسڪرين اسڪرپٽ صارف جي نظر ۾ وڌڻ سان گڏ هڪ سائيٽ کي "پڙهڻ" جي استعمال ڪندو، معذور ماڻهن لاء توهان جي سائيٽ تائين پهچائڻ.
اسلوب جو ٽيڪسٽ ۽ توهان جي سرڪشن جو فانٽ
"ٽي، ٽائيم ۽ بدسورت" مسئلن کان پري وڃڻ جو آسان رستو جيڪو ٽئنگ جي سرزمين تي نظر انداز ڪرڻ لاء طريقو آهي. اصل ۾، جڏهن آئون هڪ نئين ويب سائيٽ تي ڪم ڪري رهيو آهيان، عام طور تي پيراگراف، h1، h2، र h3 شاليل پهريون نمبر لکندو. آئون اڪثر فٽني ڪٽنب ۽ وزن / وزن سان لٺ ڪندو آهيان. مثال طور، اهو هڪ نئين سائيٽ لاء هڪ ابتدائي طرز شيٽ (شايد اهو صرف ڪجهه مثال جو شائل استعمال ڪري سگهجي ٿو):
جسم، html {حاڪمن: 0؛ لڳائڻ: 0؛ } p {فائيل: 1em ايريل، جينيوا، هليوٿيڪا، سين سيرف؛ } h1 {فٽ: ٻٽو 2em "ٽائم نيو نئون روم"، ٽائم، سيف؛ } h2 {فٽ: بيول 1.5em "ٽائم نيو نئون روم"، ٽائم، سيف؛ } h3 {فٽ: بولي 1.2em ايريئل، جينوا، هليوٿيڪا، سين سيرف؛ }توهان پنهنجي عنوان جي فانٽ کي تبديل ڪري سگھو ٿا يا متن جي انداز تبديل يا ٽيڪسٽ رنگ تبديل ڪري سگهو ٿا. اهي سڀ پنهنجو "بدعنواني" عنوان کي وڌيڪ وڌيڪ متحرڪ ۽ پنهنجي ڊزائن سان لڳائڻ ۾ وڌندا.
h1 {فٽ: بولي اطالوي 2em / 1em "ٽائم نيو نيو رومن"، "ايم ايس سيرف"، "نيو يارڪ"، سيف؛ حاڪمن: 0؛ لڳائڻ: 0؛ رنگ: # e7ce00؛ }جزيري ذريعي مٿي ڪري سگهو ٿا
توهان جي سر لنڊن کي بهتر ڪرڻ لاء سرحدون هڪ بهترين طريقا آهن. ۽ سرحدون شامل ڪرڻ آسان بڻائي ٿي. پر سرحدن سان تجربو ڪرڻ نه وساريو - توهان جي پنهنجي سر جي هر طرف سرحد جي ضرورت ناهي. ۽ توهان صرف انهيء بورنگ جي حد کان وڌيڪ استعمال ڪري سگهو ٿا.
h1 {فٽ: بولي اطالوي 2em / 1em "ٽائم نيو نيو رومن"، "ايم ايس سيرف"، "نيو يارڪ"، سيف؛ حاڪمن: 0؛ لڳائڻ: 0؛ رنگ: # e7ce00؛ سرحدن وارو مٿو: ٽائيم # e7ce00 وچولي؛ ڏورائي ڦٽو: ٺٽو ويو چوٿون: 600px؛ }مون پنهنجي نموني سرڪشن کي ڪجهه دلچسپ بصري متعارف ڪرائڻ لاء مٿاهون ۽ تري سرحدن شامل ڪيو. توهان سرحدون شامل ڪري سگھو ٿا ڪنهن به انداز ۾ جيڪو توهان چاهيو ٿا ته ڊزائن جي طرز حاصل ڪرڻ چاهيندا.
اڃا به وڌيڪ Pizazz لاء توهان جي هيڊرن ڏانهن پس منظر شامل ڪريو
ڪيتريون ئي ويب سائيٽون هن صفحي جي مٿئين حصي ۾ هڪ سرسر سيڪشن آهي جنهن ۾ سر لنڪ - خاص طور تي سائيٽ جو عنوان ۽ گرافڪ. اڪثر ڊزائنر هن جي ٻن الڳ عناصر وانگر سوچندا آهن، پر توهان وٽ ناهي. جيڪڏهن گرافڪ اتي موجود آهي صرف سر کي سجائڻ لاء، پوء ڇو سرنگ جي طرز ۾ شامل نه ڪيو وڃي؟
h1 {فٽ: بولي اطالوي 3em / 1em "ٽائم نيو نيو رومن"، "ايم ايس سيرف"، "نيو يارڪ"، سيف؛ پس منظر: #fff url ("fancyheadline.jpg") ورجائي-x تري؛ ٻرندڙ: 0.5em 0 90px 0؛ لکت حاڪمن: 0؛ سرحد-تڪرار: ٽائيم # e7ce00 0.25em؛ رنگ: # e7ce00؛ }هن عنوان ڏانهن چال آهي ته مون کي خبر آهي ته منهنجو تصوير 90 پکسل قد آهي. تنهن ڪري مان 90px جي عنوان جي تري ۾ پئڊنگ وڌايو (پيڊنگ: 0.5 0 90px 0p؛). توهان سرن جي ٽيڪسٽ حاصل ڪرڻ لاء حد، لائن، اونچائي، ۽ ختم ڪرڻ سان راند ڪري سگھو ٿا اهو ظاهر ڪري جتي توهان چاهيو ٿا.
ياد رکڻ لاء هڪ شيء جيڪا تصوير استعمال ڪندي آهي ته جيڪڏهن توهان وٽ هڪ قبول ڪندڙ ويب سائيٽ (جيڪو توهان کي گهرجي) هڪ ترتيب سان جيڪا اسڪرين جي سائيز ۽ ڊوائيسز تي ٻڌل هوندي آهي، توهان کي هميشه هميشه ساڳيا سائيز نه هوندي. جيڪڏهن توهان کي پنهنجي ماپ کي صحيح سائيز هجڻ جي ضرورت آهي، اهو مسئلو پيدا ڪري سگهي ٿي. اهو ئي سببن مان آهي ته آئون عام طور تي پسماندگيء واري تصويرون کان هڪ ڏاڪڻ کان بچو، جيئن ته ٿڌو ڪڏهن ڪڏهن اهي نظر انداز ڪري سگهن.
Headlines ۾ تصويرن جي متبادل
ويب ڊزائينر لاء هي هڪ ٻيو مقبول ٽيڪنڪ آهي ڇاڪاڻ ته اها توهان کي گرافاتي سرڪشي ٺاهڻ جي اجازت ڏئي ٿي ۽ انهي تصوير سان سر ٽيڊ جي ٽيڪسٽ کي تبديل ڪري ٿي. اها ويب ڊزائينررن کان سچا هڪ قديم قدمن جو ڪم تمام ڪجھه فونٽ تائين رسائي هئي ۽ انهن جي ڪم ۾ وڌيڪ غير معمولي فانٽ استعمال ڪرڻ چاهيندا هئا. ويب فانٽ جو عڪس حقيقت ۾ تبديل ٿي چڪو آهي ته ڪئين ڊزائنر جي سائيٽون ڪيئن. هاڻ جون لکڻيون وڏيون قسم جون فونٽ ۾ سيٽ ڪري سگھجن ٿيون ۽ تصويرون جيڪي انهي فانٽ سان شامل ڪيا ويا آهن انهن جي ڪا ضرورت ناهي. جيئن ته، توهان رڳو صرف پراڻن سائيٽن تي سر لنڊن لاء سي ايس ڊي تصويرون متبادل ڳوليندا آهن جيڪي اڃا تائين جديد طريقن سان تازه ڪاري نه آهن.
اصل مضمون جينيفر ڪيريئن طرفان. 9/6/17 تي Jeremy Girard پاران ڏنل