Фонт, Батс, Зургийн зургуудыг Decorate Headlines-ыг ашиглана уу
Ихэнх веб хуудсанд гарчигууд нийтлэг байдаг. Үнэн хэрэгтээ, ямар ч текст баримт бичиг уншиж байгаа зүйлийнхээ нэрийг мэдэж байхын тулд дор хаяж нэг сэдэвтэй байх хандлагатай байдаг. Эдгээр гарчиг нь h1, h2, h3, h4, h5, болон h6 гэсэн HTML толгой элементүүдийг ашиглан кодчилдог.
Зарим сайт дээр та эдгээр элементүүдийг ашиглахгүйгээр гарчигтай кодыг олох болно. Үүний оронд, гарчигууд нь тэдэнд нэмж ангилалын тодорхой шинж чанаруудтай эсвэл анги элементүүдтэй хуваагдаж болно. Энэ буруу практикт байнга сонсдог болсон шалтгаан нь дизайнер "толгойн харагдах замыг таалахгүй" гэсэн үг юм. Анхдагч байдлаар, гарчиг тод харагдах ба том хэмжээтэй, ялангуяа h1, h2 элементүүд нь хуудасны бусад үлдсэн хэсгээс илүү том үсгийн хэмжээг харуулдаг. Эдгээр элементийн зөвхөн үндсэн харагдах байдлыг л анхаарна уу! CSS-ийн тусламжтайгаар та хүссэн чигээрээ харагдах боломжтой! Та үсгийн хэмжээг өөрчилж, зоримогоор арилгаж, илүү ихийг хийж болно. Гарчиг нь хуудасны гарчигыг кодлох зөв зам юм. Энд зарим шалтгаан бий.
Яагаад DIVs болон Styling гэхээсээ толгойн үсэг ашигла
Хайлтын системүүд шиг толгой хайлтууд
Энэ нь толгойг ашиглах хамгийн зөв шалтгаан бөгөөд тэдгээрийг зөв дарааллаар (өөрөөр хэлбэл h1, h2, дараа нь h3 гэх мэт) ашиглаарай. Хайлтын системүүд нь гарчигт багтсан текстийн хамгийн их жинлэлтийг өгдөг. Өөрөөр хэлбэл, хуудасныхаа H1 хуудсыг шошгон дээрээ байрлуулахдаа аалзны # 1 фокус гэсэн үг. H2 гарчиг нь 2-р онцолсон, гэх мэт.
Та өөрийн гарчгийг тодорхойлохын тулд ямар ангиудыг ашигладаг талаараа бүү санаарай
Таны бүх вэбсайтууд bold, 2em, шар өнгөтэй H1-тэй байх болно гэдгийг мэдээд дараа нь таны загварын хуудсанд нэг удаа тодорхойлж болно. 6 сарын дараа, та өөр хуудсыг нэмж байгаа бол, та зөвхөн хуудасныхаа дээд талд H1 тагийг нэмсэн бол та бусад төрлийн хуудсууд руу буцах хэрэггүй бөгөөд та ямар төрлийн ID эсвэл ангиудыг гол тодорхойлох гарчиг болон дэд толгой.
Тэд хүчтэй хуудас тойм өгдөг
Гарчигууд текстийг уншихад хялбар болгож байна. Ийм учраас АНУ-ын ихэнх сургуулиуд оюутнууд бичсэн хуудас бичихээсээ өмнө тойм бичихийг заасан байдаг. Таныг гарчгийн форматад гарчгийн тагийг ашиглавал таны текст маш тодорхой бүтэцтэй бөгөөд маш хурдан тодорхой болно. Түүнчлэн, хуудасны тоймыг ерөнхийд нь танилцуулах боломжтой хэрэгслүүд байдаг бөгөөд эдгээр нь тойм хэлбэрийн гарчигт гарчигт тулгуурладаг.
Таны хуудас ч гэсэн хэв маягаар ч гэсэн мэдрэмжээ алддаг
Хүмүүс хэвлэлийн хуудсыг харах эсвэл ашиглах боломжтой (энэ нь буцаж # 1 - хайлтын системүүд хуудсын агуулга (текст) харах биш загварын хуудсыг харна уу). Хэрвээ та гарчигт гарчиг хэрэглэвэл танай хуудсыг илүү хялбар болгох боломжтой.
Энэ нь Дэлгэц Уншигчид болон Вэбсайтыг ашиглахад тустай
Гарчиг нь зөв хэрэглэх нь баримт бичигт логик бүтцийг үүсгэдэг. Энэ нь дэлгэцийн уншигчдад сайтаа "уншиж" харааны сул тал бүхий хэрэглэгчдэд хүргэж, таны сайтыг хөгжлийн бэрхшээлтэй хүмүүст хүрэх боломжтой болгоно.
Таны гарчигны текст болон фонтыг хэвлэ
Толгойн хаягуудын "том, зоригтой, муухай" асуудал гарахад хамгийн амархан арга бол текстээ тэдгээрийг харахыг хүссэн арга замаар хэвшүүлэх явдал юм. Үнэн хэрэгтээ, шинэ вэбсайт дээр ажиллаж байхдаа би догол мөрөнд, h1, h2, h3 загваруудыг бичих нь зүйтэй. Би зүгээр л фонтын гэр бүл, хэмжээ / жингээр зөөгддөг. Жишээлбэл, энэ нь шинэ сайтанд зориулж урьдчилсан загварын хуудас байж магадгүй (эдгээр нь зөвхөн зарим загварыг ашиглах боломжтой загвар юм):
бие, html {маржин: 0; Налуу: 0; } p {фонт: 1em Arial, Женев, Helvetica, sans-serif; } h1 {фонт: bold 2em "Times New Roman", Times, serif; } h2 {font: bold 1.5em "Times New Roman", Times, serif; } h3 {font: bold 1.2em Arial, Geneva, Helvetica, sans-serif; }Та гарчигны үсгийн фонтыг өөрчилж эсвэл текстийн хэв маяг, эсвэл текстийн өнгөийг өөрчилж болно. Эдгээр нь таны "муухай" гарчигийг илүү эрчимтэй, дизайнтай уялдуулах болно.
h1 {фонт: bold italic 2em / 1em "Times New Roman", "MS Serif", "New York", serif; margin: 0; Налуу: 0; өнгө: # e7ce00; }Хил Хязгаарын нэр хаягийг бичих боломжтой
Батсууд нь таны гарчгийг сайжруулах гайхалтай арга юм. Мөн хил хязгаарыг хялбархан нэмэх боломжтой. Гэхдээ хил дээр туршилт хийхээ бүү мартаарай - танд гарчгийнхаа тал бүрт хил байхгүй байх хэрэгтэй. Мөн та энгийн уйтгартай хил хязгаараас илүү ихийг ашиглаж болно.
h1 {фонт: bold italic 2em / 1em "Times New Roman", "MS Serif", "New York", serif; margin: 0; Налуу: 0; өнгө: # e7ce00; border-top: solid # e7ce00 medium; хилийн ёроол: цэг # e7ce00 нимгэн; өргөн: 600px; }Би зарим нэг сонирхолтой харагдах загварыг танилцуулахын тулд түүвэрлэлийн дээд болон доод захыг нэмж оруулсан. Та хүссэн загварынхээ загварт хүрэхийг хүсч байгаа хил хязгаарыг нэмж болно.
Pizazz-ийн талаар дэлгэрэнгүй мэдээлэл авах боломжтой
Олон вэбсайтууд хуудасны дээд хэсэгт байрлах хуудасны толгой хэсэгт гарчигтай байдаг бөгөөд энэ нь ихэвчлэн сайтын нэр, график. Ихэнх дизайнерууд үүнийг хоёр тусдаа элемент гэж үздэг, гэхдээ та үүнийг хийх шаардлагагүй. Хэрвээ график нь гарчигийг засахын тулд тэнд байгаа бол толгойн хэв маягийг яагаад нэмэх вэ?
h1 {фонт: bold italic 3em / 1em "Times New Roman", "MS Serif", "New York", serif; background: #fff url ("fancyheadline.jpg") давтан-x доод; Суурь: 0.5em 0 90px 0; текст-шугам: төв; margin: 0; хил хязгаар: хатуу # e7ce00 0.25em; өнгө: # e7ce00; }Энэ сэдэвт заль мэх нь миний дүр төрх 90 пиксел өндөр байгааг мэднэ. Тиймээс би 90px (padding: 0.5 0 90px 0p) гарчгийн доод талд дэвслэхийг нэмсэн. Та товлосон текстийн текстийг хүссэн газраа яг хаана нь харуулахын тулд маржин, мөрийн өндрийг болон дэвсгэртээ тоглуулж болно.
Зургийг ашиглахдаа санах нэг зүйл бол хэрэв та дэлгэцийн хэмжээ, төхөөрөмж дээр суурилсан өөрчлөлттэй зурагтай вэбсайттай бол энэ нь үргэлж ижил хэмжээтэй байх болно. Хэрэв таны гарчиг яг нарийн хэмжээтэй байх шаардлагатай бол энэ нь асуудал үүсгэж болзошгүй. Энэ нь ерөнхийдөө ерөнхий зурагт хуудасны дэвсгэр зурагнаас зайлсхийх шалтгаан болдог.
Гарчиг дахь зураг солих
Энэ нь таныг вэбсайт дизайнеруудын хувьд түгээмэл хэрэглэгддэг арга юм. Учир нь та график гарчиг үүсгэхийг зөвшөөрдөг бөгөөд тэрхүү зурагтай гарчигны текстийг орлуулах боломжтой болно. Энэ нь веб дизайнерууд маш цөөхөн үсгийн маягттай танилцаж, өөрсдийнхөө ажилдаа илүү чамин үсгийн фонт ашиглахыг хүсдэг нь үнэн хэрэгтээ хийсвэр туршлага юм. Вэб фонтуудын өсөлт нь дизайнерууд хэрхэн ханддаг сайтуудаар үнэхээр өөрчлөгдсөн байна. Гарчигууд нь одоо олон янзын фонтууд болон зургуудыг тохируулж болно. Эдгээр үсгийн маягууд нь дахин шаардлагагүй болдог. Иймээс, та шинэ орчин үеийн практикт хараахан шинэчлэгдээгүй хуучин сайтууд дахь гарчигт CSS дүрсийг солих болно.
Женнифер Кэрнин эх нийтлэл. 9/6/17 дээр Жереми Герард засварлав