Tumia Fonti, mipaka, na Picha za kupamba vichwa vya habari
Vichwa vya habari ni kawaida kwenye kurasa nyingi za wavuti. Kwa hakika, hati kubwa ya maandiko huelekea kuwa na kichwa cha habari moja ili uweze kujua jina la unachosoma. Vichwa vya habari hivi vinatajwa kwa kutumia vipengele vya kichwa vya HTML - h1, h2, h3, h4, h5, na h6.
Katika maeneo fulani, unaweza kupata vichwa vya habari vilivyoandikwa bila kutumia vipengele hivi. Badala yake, vichwa vya habari vinaweza kutumia vifungu na sifa maalum za darasa zilizoongezwa kwao, au mgawanyiko na mambo ya darasa. Sababu niliyosikia mara nyingi juu ya mazoea haya yasiyo sahihi ni kwamba mtengenezaji "haipendi vichwa vya kutazama". Kwa chaguo-msingi, vichwa vinaonyeshwa kwa ujasiri na vina ukubwa mkubwa, hasa vipengele vya h1 na h2 vinavyoonyesha ukubwa wa font zaidi kubwa zaidi kuliko maandiko yote ya ukurasa. Kumbuka kwamba hii ni kuangalia tu ya msingi ya mambo haya! Kwa CSS, unaweza kufanya kichwa kuangalia hata hivyo unataka! Unaweza kubadilisha ukubwa wa font, ondoa ujasiri, na mengi zaidi. Vichwa vya habari ni njia sahihi ya kuandika vichwa vya habari vya ukurasa. Hapa kuna baadhi ya sababu.
Kwa nini Kutumia Tags ya kichwa badala ya VVU na Styling
Injini za Tafuta kama kichwa cha kichwa
Hii ndiyo sababu nzuri ya kutumia vichwa, na kuitumia kwa amri sahihi (yaani h1, basi h2, basi h3, nk). Injini za utafutaji hutoa uzito mkubwa zaidi kwa maandishi ni pamoja na ndani ya vitambulisho vya kichwa kwa sababu kuna thamani ya semantic kwa maandishi hayo. Kwa maneno mengine, kwa kuandika kichwa chako cha ukurasa H1, unauambia buibui ya injini ya utafutaji kwamba hii ni ukurasa wa # 1 wa ukurasa. H2 vichwa vina msisitizo # 2, na kadhalika.
Wewe Don & # 39; t Je, Ukumbuke Nakala Zpi Ulizoweza Kufafanua Vichwa Vyenu vya Habari
Unapojua kwamba kurasa zako zote za wavuti zitakuwa na H1 ambayo ni ya ujasiri, 2, na ya njano, basi unaweza kufafanua kwamba mara moja katika stylesheet yako na kufanywa. Miezi 6 baadaye, unapoongeza ukurasa mwingine, unaongeza tu H1 kwenye kichwa cha ukurasa wako, huna kurudi kwenye kurasa zingine ili uone ni kitambulisho cha mtindo au darasani ulilotumia kufafanua kuu kichwa cha habari na vichwa vya chini.
Wao hutoa Kutoka kwa Ukurasa wa Nguvu
Inatafsiri kufanya maandishi rahisi kusoma. Ndiyo sababu shule nyingi za Marekani zilifundisha wanafunzi kuandika muhtasari kabla ya kuandika karatasi. Unapotumia vitambulisho vya kichwa katika muundo wa muhtasari, maandiko yako ina muundo wazi unaoonekana kwa haraka sana. Zaidi, kuna zana ambazo zinaweza kupitia muhtasari wa ukurasa ili kutoa maelezo, na haya hutegemea lebo ya kichwa kwa muundo wa muhtasari.
Ukurasa Wako Utafanya Kufanya Hata Kwa Mipangilio Iliyogeuka
Sio kila mtu anayeweza kutazama au kutumia karatasi za mtindo (na hii inarudi kwenye vituo vya # 1 - injini za utafutaji zinaona maudhui (maandiko) ya ukurasa wako, si karatasi za mtindo). Ikiwa unatumia vitambulisho vya kichwa, unafanya kurasa zako ziweze kupatikana kwa sababu vichwa vya habari hutoa taarifa ambayo tag ya DIV haikuweza.
Inafaa Kwa Wasomaji wa Kisasa Na Ufikiaji wa Tovuti
Matumizi sahihi ya vichwa huunda muundo wa mantiki kwa hati. Hii ni nini wasomaji wa screen watatumia "kusoma" tovuti kwa mtumiaji mwenye uharibifu wa maono, na kufanya tovuti yako ipatikane kwa watu wenye ulemavu.
Weka Nakala na Font ya Vichwa vya Nyaraka
Njia rahisi ya kuondoka kutoka kwenye "tatizo kubwa, la ujasiri, na lenye ugumu" la kuweka vitambulisho ni mtindo wa maandishi njia unayoyatafuta. Kwa kweli, wakati ninapofanya kazi kwenye tovuti mpya, mimi mara nyingi kuandika aya, h1, h2, na h3 mitindo ya kwanza. Mara nyingi mimi hujiunga na familia tu na ukubwa / uzito. Kwa mfano, hii inaweza kuwa karatasi ya awali ya mtindo kwa tovuti mpya (haya ni mitindo tu ya mfano ambayo inaweza kutumika):
mwili, html {margin: 0; padding: 0; } {font: 1 ya Arial, Geneva, Helvetica, sans-serif; } h1 {font: bold 2em "Times New Roman", Times, serif; } h2 {font: ujasiri 1.5em "Times New Roman", Times, Serif; } h3 {font: ujasiri 1.2m Arial, Geneva, Helvetica, sans-serif; }Unaweza kubadilisha fonts za kichwa chako au kubadilisha mtindo wa maandishi au hata rangi ya maandishi . Zote hizi zitageuza kichwa chako cha "uovu" kuwa kitu kikubwa zaidi na katika kutunza na kubuni yako.
h1 {font: bold italic 2em / 1em "Times New Roman", "MS Serif", "New York", serif; margin: 0; padding: 0; rangi: # e7ce00; }Mipaka inaweza kuvaa vichwa vya habari
Mipaka ni njia nzuri ya kuboresha vichwa vya habari yako. Na mipaka ni rahisi kuongeza. Lakini usisahau kujaribu mipaka - hauhitaji mipaka upande wa kichwa chako. Na unaweza kutumia zaidi ya mipaka tu ya boring.
h1 {font: bold italic 2em / 1em "Times New Roman", "MS Serif", "New York", serif; margin: 0; padding: 0; rangi: # e7ce00; mpaka-mpaka: kati imara # e7ce00; mpaka-mpaka: ulio na # e7ce00 nyembamba; upana: 600px; }Niliongeza mpaka wa juu na wa chini kwenye kichwa changu cha sampuli ili kuanzisha mitindo ya kuonekana ya kuvutia. Unaweza kuongeza mipaka kwa njia yoyote ambayo unataka kufikia mtindo wa kubuni unayotaka.
Ongeza picha za asili kwenye vichwa vya habari zako Kwa Pizazz zaidi
Tovuti nyingi za Mtandao zina sehemu ya kichwa juu ya ukurasa unaojumuisha kichwa cha habari - kwa kawaida cheo cha tovuti na kielelezo. Waumbaji wengi wanafikiria hili kama mambo mawili tofauti, lakini huna. Ikiwa picha ni pale tu kupamba kichwa cha habari, basi kwa nini usiiongeze kwenye mitindo ya kichwa?
h1 {font: bold italic 3em / 1em "Times New Roman", "MS Serif", "New York", serif; background: #fff url ("fancyheadline.jpg") kurudia-x chini; padding: 0.5m 0 90px 0; kuandika maandishi: kituo; margin: 0; mpaka-mpaka: imara # e7ce00 0.25m; rangi: # e7ce00; }Hila kwa kichwa hiki ni kwamba ninajua picha yangu ni urefu wa pixels 90. Kwa hiyo niliongeza padding chini ya kichwa cha 90px (padding: 0.5 0 90px 0p;). Unaweza kucheza na vijiji, urefu wa mstari, na padding ili kupata maandishi ya kichwa cha habari ili kuonyesha hasa mahali unayotaka.
Kitu kimoja cha kukumbuka wakati wa kutumia picha ni kwamba ikiwa una tovuti ya msikivu (ambayo unapaswa) na mpangilio unaobadilika kulingana na ukubwa wa screen na vifaa, kichwa chako hakitakuwa kawaida sawa. Ikiwa unahitaji kichwa chako cha kichwa kuwa ukubwa halisi, hii inaweza kusababisha matatizo. Ni moja ya sababu kwa nini mimi kuepuka picha za asili katika kichwa cha habari, kama baridi kama wanaweza wakati mwingine kuangalia.
Uingizaji wa picha kwenye vichwa vya habari
Hii ni mbinu nyingine maarufu kwa wabunifu wa wavuti kwa sababu inakuwezesha kuunda kichwa cha kichwa na kubadilisha nafasi ya lebo ya kichwa na picha hiyo. Hiyo ni kweli mazoezi ya zamani kutoka kwa wabunifu wa mtandao walipata upatikanaji wa fonts chache sana na walitaka kutumia fonts zaidi ya kigeni katika kazi zao. Kuongezeka kwa fonts za wavuti imesababisha jinsi wabunifu wanavyotumia maeneo. Vichwa vya habari sasa vinaweza kuweka katika fonts mbalimbali na picha na fonts hizo zimefungwa hazihitaji tena. Kwa hivyo, utapata tu picha za CSS badala ya vichwa vya habari kwenye tovuti za zamani ambazo bado hazijasasishwa kwa mazoea zaidi ya kisasa.
Makala ya awali na Jennifer Krynin. Iliyotengenezwa na Jeremy Girard mnamo 9/6/17