Ирсэнтэй хамт хувийн компьютеруудболон анхны ширээний хэвлэлийн системүүд нь хэвлэх урлагт тектоник өөрчлөлт гарсан бөгөөд үүний үр дагавар нь одоо л мэдэгдэхүйц болж байна. Энэ нь дэлхийн хэмжээнд хэвлэх хэв маягийн анхны өөрчлөлт биш, бусад нь ч байсан. Аж үйлдвэрийн ертөнцийн машинууд гар урчуудаа ялж байсан үеийг санахад хангалттай. Үсгийн гоо сайхныг бодвол масс үйлдвэрлэл, ашиг нь илүү чухал болсон. Чанараас илүү тоо хэмжээ чухал байсан.

Их мастерууд шинэ фонт үүсгэхээ больсон, аль хэдийн байсан нь ном хэвлэхэд тохиромжтой байв. Уран урчууд хэчнээн мэргэжлийн байсан ч ажилгүй байж, технологийн процессын нэг хэсэг болсон.

Гэсэн хэдий ч үйлдвэржилтийн ялалт нь хэвлэлийн машин гарч ирснээр их мастерууд алга болсон гэсэн үг биш юм. Эдгээр хоёр ертөнц бие биенээсээ үл хамааран оршин тогтносоор байв - хэвлэгч нар гар урчуудын авъяас чадварыг хүлээн зөвшөөрч, ахиц дэвшлийг зогсоох боломжгүй гэдгийг ойлгосон. Энэ бол хэв маягийн хоёр дахь өөрчлөлт байсан бөгөөд үүний үр дүнд тэрээр өөрийн "сүнс" буюу хүн төрөлхтний нэгээхэн хэсгийг алдсан юм. Харин саяхан болсон явдлыг ойлгохын тулд та 500 жилийн хугацаанд буцаж очиж, энэ бүхэн хаанаас эхэлснийг олж мэдэх хэрэгтэй болно.

АНХНЫ ШИЛЖИЛТ

Шинэ хуучин хоёрын анхны зөрчил анхны хэвлэх машин зохион бүтээсний дараа үүссэн. Үүнийг бүтээгч Йоханнес Гуттенберг уг машиныг ашиглан цагт 240 хуудас хэвлэх хурдтай олон төрлийн найруулга хийх боломжтой. Энэ бол хувьсгал байсан.

Үүнээс өмнө бүх номыг гараар бүтээдэг байсан. Өнгөрсөн үеийн номуудыг гараар бичиж, нарийн төвөгтэй загвар, загвараар чимэглэсэн байв. Хуулбарлах үйл явц маш урт байсан ч үр дүнд нь ямар ч ном, тэр ч байтугай хуулбар нь урлагийн бүтээл байв.

Мэдээжийн хэрэг, анхны хэвлэсэн номыг гараар бичсэн номтой харьцуулах боломжгүй юм. Тэд тийм ч үзэсгэлэнтэй биш байсан ч жижиг, хямдхан байв. Хамгийн чухал нь: хувь хүний ​​тэмдэгтүүд болон бүх үсгийн гэр бүлүүдийг солих чадвар нь зөвхөн латин хэл дээр төдийгүй Европын бусад хэл дээр ном хэвлэх боломжтой болсон.

Хүмүүс зөвхөн эдгээр өөрчлөлтийг талархан хүлээж авсан. Тэдэнд өөрсдийн ойлгодог хэл дээрх ном, авч явах ном хэрэгтэй байсан. Тэд мэдлэгээр цангаж, хэвлэсэн номууд түүнийг тайлж байв.

Гэвч анхны шилжилтийн үр дүнд ном хүн чанараа алдсан. Машинууд үндсэн процессыг авсан боловч гар урчууд эрэлт хэрэгцээтэй хэвээр байв. Үсэг бүрийг гараар сийлсэн бөгөөд загвар, чимэглэлийг мөн хүмүүс урласан. Гэсэн хэдий ч ном үйлдвэрлэх үйл явцаас гар урлал бүдгэрч эхлэхэд тун удахгүй байх болно.

ДИЖИТАЛ НАС

Эхний шилжилт нь гараар бичсэн номуудыг устгасан. Аж үйлдвэржилт эцэстээ хэвлэх урлагийг хүн чанараас нь салгаж, бүх зүйл механикжсан, гар урчууд ажилгүй хоцорчээ. Гэвч гурав дахь шилжилт нь эцэст нь хэвлэх урлагийг урлаг болгон дуусгав. Өнөө үед ихэнх чихэвчнүүд ямар ч онцлог шинжгүй байдаг. Энэ бол зүгээр л компьютер дээрх фонтуудын цуглуулга юм. Энэ эсвэл тэр үсгийн түүхийг мэддэг хүн бараг байхгүй. Үүнийг хэн ч тоохгүй. Тохиромжтой хэв маягийг хайж олохын тулд бид хэдэн зуун фонтыг минутын дотор гүйлгэдэг бөгөөд бусад бүх зүйл тийм ч чухал биш юм.

_______________________

"Манай компьютержсэн ертөнцөд үсгийн фонт, тэдгээрийн янз бүрийн хувилбарууд олширч байна. шинэ түвшинМанай соёлд шууд заналхийлж буй харааны бохирдол гэж дизайнер Массимо Виньелли хэлэв. "Мянга мянган фонтоос бидэнд цөөн хэдэн үндсэн фонт хэрэгтэй, учир нь бусад бүх зүйл зүгээр л хог юм."
_______________________

Зарим талаараа түүний зөв. Typography нь зөвхөн фонтоос илүү зүйл юм. Эдгээр нь зөвхөн сайхан захидал биш, бас өөр зүйл, бидэнд мэдрэмж төрүүлдэг зүйл юм. Үндсэндээ хэвлэх урлаг бол мессеж юм. Оросын нэрт хэвлэгч Лазар Лисицкийн хэлснээр, хэвлэх урлаг нь илтгэгчийн хэлж буй санааг уншигчдад оптик байдлаар дамжуулах ёстой."

Зүүгээр илгэн цаасан дээр бичдэггүй болоод удаж байна. Хэвлэх бэхний үнэртсэн ширүүн цаас алга болжээ. Гялалзсан хэвлэлийн зах зээл нь микроскопийн хэмжээ хүртэл багассан. Өнөөдөр бид хэвлээгүй, шивсэн бичвэрүүдийг уншдаг, цаасан дээр огт уншдаггүй. Мөн хэвлэх урлаг өөр нэг шилжилтийн шатандаа орсон бололтой. Энэ нь ямар байхыг хэн ч мэдэхгүй, гэхдээ цаасны дараа бидний мэддэг дэлгэцүүд хуучирч хоцрох болно. Дараагийн хувьсгал хэзээ болохыг хэлэхэд хэцүү, гэхдээ шинэ шилжилтзаавал болно.

Энэ бүхний хамгийн гунигтай зүйл нь хүмүүс төгс төгөлдөрт хүрэхийн төлөө өөрийнхөө нэг хэсгийг алдсан явдал юм. Өнөөдөр уран бичлэгийн ур чадвар бараг хэнд ч хэрэггүй. Энэ нь удаан хугацаа шаарддаг, анхаарал халамж, тэсвэр тэвчээр шаарддаг. Өнөөдөр энэ нь утгагүй юм - эцэст нь бүх амтанд тохирсон чихэвч байдаг. Бид зомби шиг фонтуудыг сонгодог: нэр, хэмжээ, загвар... Мессеж? Захиа? Компьютерийн фонтуудын ард ямар ч мессеж, түүх, юу ч байхгүй.

ӨНГӨРСӨНИЙ НОСТАЛГИ

Өнөөдөр олон загвар зохион бүтээгчид текстэд шаардлагатай өвөрмөц байдлыг өгөх шинэ фонт хэрэгтэй гэж бодож байна. Типографтай ажиллах олон арга байдаг бөгөөд тэдгээр нь тус бүрдээ нэг зорилгыг баримталдаг - дижитал үсгийн хувийн бус байдлаас зайлсхийх. Бүх зүйлийг ашигладаг - өнгөний тодосгогч, эзэлхүүний хуурмаг байдал, сөрөг орон зай, товчхондоо стандарт фонтыг арай бага стандарт болгон хувиргаж чадах бүх зүйл.

Үүнтэй холбогдуулан дизайнеруудын фонтын алдагдсан жинхэнэ байдлыг олж авах хүслийг харуулсан гурван өсөн нэмэгдэж буй чиг хандлагыг тэмдэглэж болно. Типографийн үндсэн гурван чиг хандлага байдаг боловч тэдгээр нь хаа сайгүй гарч ирдэг тул тэдгээрийг анзаарахгүй байх нь хэцүү байдаг. Бид чимэг, усан будаг, малгай зэрэг хэв маягийн талаар ярьж байна.

VINTAGE GRUNGE TYPOgraphy

Би хэвлэмэлийн тухай хуучин нийтлэлийг зассан бөгөөд үүнийг үзээгүй хүмүүст уншихад тустай байх болно.

Типографи- вэб дизайны хамгийн чухал талуудын нэг, учир нь түүний тусламжтайгаар үндсэн мэдээллийг дамжуулдаг. Харамсалтай нь олон дизайнерууд болон үйлчлүүлэгчид зоримог туршилт хийхээс айж, төсөлдөө нэг эсвэл хоёр "батлагдсан" фонт сонгохоос айдаг.

Тиймээс энэ нийтлэлийг хэвлэлийн далайд төөрсөн хүмүүст зориулав. Бид хэвлэмэл зүйн үндэс, ямар төрлийн фонт байдаг, фонтын бүтцийн талаар ярих болно.

Үсгийн болон үсгийн хэлбэрүүд - ялгаа нь юу вэ?

Олон хүмүүс "typeface" болон "фонт" гэсэн үгсийг сольж хэрэглэдэг. Үнэндээ энэ нь ижил зүйл биш, одоо би яагаад гэдгийг тайлбарлах болно.

Чихэвчбичих/хэвлэх боломжтой хэв маягийн хувьд ижил төстэй тэмдэгтүүдийн багц юм. Эдгээр нь тоо, үсэг, тэмдэг юм. Фонт- Энэ бол хэмжээ, хэв маяг гэх мэт хэд хэдэн хүчин зүйлээр тодорхойлогддог илүү нарийхан ойлголт юм. Ерөнхийдөө Arial бол үсгийн хэлбэр, Arial Bold бол фонт юм.

Ангилал

Фонтуудыг хэд хэдэн бүлэгт хувааж болно - serif (serif), sans serif (sans-serif), гараар бичсэн (скрипт), дэлгэц (дэлгэц). Гэсэн хэдий ч өөр төрлийн ангилал байдаг.

Serif фонтууд, Antiqua (Serif)

Үсэг бүр нь жижиг серифтэй тул тэдгээрийг ингэж нэрлэдэг. Вэб дизайн дахь том блок текстийг хэвлэхдээ тэдгээрийг уншихад хэцүү гэж үздэг тул тэдгээрийг ашиглахыг зөвлөдөггүй. Эдгээр фонтыг ихэвчлэн гарчигт ашигладаг.

Serif фонт нь хэд хэдэн дэд төрлүүдтэй байдаг - жишээлбэл, Хуучин хэв маяг("Хуучин хэв маяг" - тэднийг бас хүмүүнлэг гэж нэрлэдэг, хүмүүнлэгийн сериф) - энэ ангиллын хамгийн анхны фонтууд нь 1400-аад онд ашиглагдаж байсан. Тэдний ялгах онцлог- өнцгөөр байрласан тэмдгийн хэсэг нимгэн болно. Фонтын жишээнд Adobe Jenson, Centaur, Goudy Old Style зэрэг орно.

Шилжилтийн серифүүд- 1700-аад онд ашигласан. Үүнд Times New Roman, Baskerville, Caslon, Georgia, Bookman зэрэг фонтууд орно. Тэдний үсгийн зузаан ба нимгэн хэсгүүдийн хоорондох ялгаа нь Хуучин хэв маягтай харьцуулахад илүү мэдэгдэхүйц боловч орчин үеийнхээс бага ажиглагддаг.

Орчин үеийн сериф (Шинэ загварын эртний)- 1700-аад оноос хойш ашигласан бөгөөд дүрүүдийн зузаан, нимгэн хэсгүүдийн хооронд хүчтэй ялгаа бий. Үүнд Didot, Bodoni зэрэг фонтууд орно

Мөн эцэст нь , Slab serifs (Slab фонтууд)- ерөнхийдөө бүх шугамын зузаан ижил, төгсгөлд нь том серифтэй байна

Жижиглэсэн фонтууд, Grotesques (Sans Serif)

Сериф фонтууд нь серифгүй учраас ингэж нэрлэдэг). Тэд илүү орчин үеийн харагддаг бөгөөд 18-р зуунд ашиглагдаж эхэлсэн.

Sans serif фонтын үндсэн 4 төрлийг энд оруулав. Гротеск (Хуучин гротеск), Неогротеск (Шинэ гротеск), Гуманист (Хүмүүнлэг), Геометр (Геометр).
Хуучин гротескүүд- хамгийн эхнийх нь тэд сериф фонттой төстэй боловч серифгүй.
Жишээлбэл, Франклин Готик, Акзидензе

Шинэ гротескүүдхуучин гротесктэй харьцуулахад хялбаршуулсан дүр төрхтэй. Өнөөдөр хамгийн алдартай фонтуудын ихэнх нь шинэ sans serifs, жишээлбэл, MS Sans Serif, Arial, Helvetica, Univers юм.

Гуманистууд- бусад бүх sans serif фонтуудаас илүү уран бичлэгтэй (өөрөөр хэлбэл тэдгээрийн шугамын зузаан өөрчлөгддөг). Үүнд, жишээлбэл, Гилл Санс, Фрутигер, Тахома, Вердана, Оптима, Люсид Гранде зэрэг багтана - тэдгээрийг ихэвчлэн сайтын биеийг дүүргэхэд ашигладаг.

Геометрердийн тоон дээр үндэслэн, жишээлбэл, "O" нь тойрог гэх мэт; нь хамгийн орчин үеийн sans serif фонт гэж тооцогддог. Жишээ нь - ITC Avant Garde Gothic, Erbar Grotesk, Eurostile, Futura, Kabel, Metro, Neuzeit Grotesk, Rodchenko, Spartan.

Гараар бичсэн (скрипт)

Гараар бичсэн фонтууд гар бичмэл дээр суурилдаг. Ийм үсгийн хоёр төрөл байдаг - албан ёсны болон энгийн. Албан бичиг нь 17-18-р зууны үеийнх нь гараар бичсэн бололтой. Зарим фонтыг Жорж Снелл, Жорж Бикхэм зэрэг алдартай зураачдын гар бичмэл дээр үндэслэсэн байдаг. Орчин үеийн фонтуудын жишээ болгон та Kuenstler Script-г авч болно. Үзэсгэлэнтэй, дэгжин боловч хуудасны үндсэн хэсэгт тохирохгүй.

Энгийн фонтууд нь илүү орчин үеийн хувилбар бөгөөд 20-р зуунд үүссэн. Энэ нь албан ёсны бус, ихэвчлэн тод зураастай, сойзны цохилттой байдаг. Эдгээр фонтуудад Mistral болон Brush Script орно.

Фонтуудыг харуулах

Дэлгэцийн фонтын ангилалд ерөнхийдөө текст бичихэд тохиромжгүй фонтууд багтана. Ихэнхдээ тэд өргөлт болж үйлчилдэг. Интернет хуудсан дээр гарч эхэлж байгаа хэдий ч тэдгээрийг ихэвчлэн хэвлэхэд ашигладаг. Дэлгэцүүдийн дунд та хар үсгийг олж болно - анхны хэвлэх машинуудын анхны фонтууд.

Цагаан толгойн үсгийн бус фонтууд (Dingbats)

Цагаан толгойн үсгийн бус фонтууд- эдгээр нь үсэг огт агуулаагүй, харин тэмдэг, гоёл чимэглэл агуулсан фонтууд юм.

Пропорциональ ба нэг зайтай

Пропорциональ үсгийн фонт дээр тэмдэгт нь байгалийн зөв бичихэд шаардагдах хэмжээний зай эзэлнэ. Жишээлбэл, Times New Roman бол пропорциональ фонт юм. Гэхдээ monospace фонтууд бүгд ижил өргөнтэй тэмдэгтүүдтэй байдаг. Ийм фонтуудад жишээлбэл Courier New орно

Сэтгэлийн байдал

Үсгийн төлөв байдал нь тухайн нөхцөл байдалд үүнийг ашиглах нь зүйтэй эсэхэд ихээхэн нөлөөлдөг. Тодосгогчийг бас ихэвчлэн ашигладаг - бизнесийн хэв маягийг албан бус, хөнгөн, драматиктай хослуулдаг. Жишээлбэл, Times New Roman бол хатуу фонт бөгөөд үүнийг ихэвчлэн ашигладаг бизнесийн захидал харилцаа. Жишээлбэл, Helvetica нь эргэн тойрныхоо фонтуудаас хамааран сэтгэл санаагаа өөрчилдөг.

Зузаан ба хэв маяг

Фонтын зузаан нь: хөнгөн, нимгэн, ердийн, дунд, тод, хүнд, хар.

Үсгийн гурван хэв маяг байдаг - налуу, ташуу, жижиг толгой. Гарчиг бичихдээ ихэвчлэн жижиг том үсгийг ашигладаг.

Налуу ба ташуу нь өөр өөр хэв маягтай хэдий ч сольж болно. Ташуу нь ердийн фонтуудын ташуу хувилбар юм. Үүнийг авахын тулд Photoshop дээрх Free Transform-distort функцийг ашиглахад л хангалттай. Гэхдээ налуу үсэг нь үсгийн налуу хувилбарыг хариуцдаг тусдаа тэмдэгтийн багц юм.

Фонтын бүтэц

Тэмдэгт бүр нь бусад фонтуудтай хэрхэн хослуулж байгааг тодорхойлоход ашиглаж болох тодорхой шинж чанаруудтай байдаг. Энд гол нь:

Үсгийн шугам (суурь)- текст байрлах төсөөллийн шугам. Заримдаа бөөрөнхий фонтууд үсгийн шугамаас бага зэрэг ухардаг.

Дундаж шугамихэвчлэн "x" үсгийн өндрөөр тодорхойлогддог ихэнх жижиг үсгийн өндрийг илэрхийлдэг. Эндээс x-өндөр гэдэг ойлголт гарч ирсэн.

Том үсгийн дээд мөр (Том)- өндөр том үсэг"А".

Дээрх зураг нь бүх үсгийн гурван нийтлэг хэсгийг харуулж байна.

Гол цус харвалт, Stem- тэмдэг тус бүрийн гол босоо, түүний дотор налуу.

Хөндлөвч (бар)- үсгийн хэвтээ хэсэг

Зууван (аяга)- үсгийн бөөрөнхий хэсэг.

Дээд өргөтгөл (Өгсөх)- “d”, “h”, “b” гэх мэт үсгүүдийн наалдсан хэсэг.

Descender- “p”, “q”, “f” зэрэг үсгүүдээс доошоо наасан хэсэг

Serifs- serif үсгийн өвөрмөц онцлог). Зарим үсгийн фонт нь илүү тод харагддаг бол заримд нь бага тод илэрхийлэгддэг.

Апертур- "A", "c" эсвэл "m" зэрэг нээлттэй тэмдэгтүүдийн зайг заана.

ЧихЭнэ нь дээрх жишээн дэх "g" үсэг шиг тэмдэгтийн гоёл чимэглэлийн нэмэлт юм.

Холбох цус харвалт (үсний шугам)Энэ бол сериф үсгийн хамгийн нимгэн хэсэг юм.

Хөндлөвч - хэвтээ шугам, "A" ба "H" тэмдэгтүүдийн адил.

Унах (Терминал)- зарим үсгийн тэмдэгтүүдийн дизайн дахь цус харвалтын дугуй эсвэл зууван (дусал хэлбэртэй) төгсгөл.

ГогцооЗөвхөн зарим жижиг "g" үсгүүдэд тохиолддог бөгөөд бүрэн хаалттай эсвэл хэсэгчлэн хаалттай байж болно.

Спур- "G" гэх мэт зарим үсэг дээр жижиг хоч.

Холболт (холбоос)дээд ба доод хэсэг"g" үсэг.

Нуруу- "s" үсэгтэй төв муруй.

Сүүлний үсэг (сүүл)- гоёл чимэглэлийн шугам, жишээлбэл, "R" эсвэл "Q" үсэг дээр.

Төгсгөлийн элемент (Терминал, Эцсийн)- цус харвалт нь серифгүйгээр төгсдөг

Мөр- үндсэн цус харвалтаас үргэлжилсэн дугуйрсан шугам. (Үнэнийг хэлэхэд Оросын олон сайтууд энэ үзэл баримтлалын талаар огт өөр тодорхойлолт өгдөг)

Зохиогчоос:Сайн байцгаана уу, найзууд аа! Бид мэргэжлийн вэб дизайны нарийн ширийн зүйлийг үргэлжлүүлэн судалж байгаа бөгөөд өнөөдөр бид маш халуун сэдэвтэй байна - вэб typography. Харамсалтай нь, олон хөгжүүлэгчид энэ чиглэлийн үндсэн суурь, дүрмийг ч мэддэггүй. Магадгүй тэд зүгээр л санаа зовдоггүй бөгөөд үүнд цаг үрэхийг хүсдэггүй, эсвэл утга учрыг нь бүрэн ойлгодоггүй байж магадгүй юм. Ерөнхийдөө миний зорилго бол вэб дизайн дахь типографи нь үндсэн суурь бөгөөд үүнгүйгээр урагшлахад маш хэцүү байх болно гэдгийг танд хүргэх явдал юм.

Типографи ба мессеж

Аливаа интернет эх сурвалжийн зорилго нь мэдээллийн мессеж юм зорилтот бүлэг. Танай вэбсайтад зочлогчид юуг хамгийн түрүүнд анхаарах вэ? Мэдээжийн хэрэг, текст дээр! (Мэдээж хэрэг, санамсаргүй сурталчилгаа, олон тэнэг баннераар бөглөрөөгүй бол). Таны төслийн амжилт эцсийн дүндээ текстээс хамаарах бөгөөд зөвхөн текстээс хамаарна.

Вэб дизайнд хэв загвар нь үнэхээр юу нөлөөлдөг болохыг олж мэдье.

Нэгдүгээрт, вэб нөөцийн зураг. Өндөр чанартай хөгжүүлэлт нь энгийн нүдээр харагддаг бөгөөд та сайтад хэр удаан үлдэхийг хүсч байгаагаа тооцоолохын тулд мега мэргэжилтэн байх шаардлагагүй. Тахир, унших боломжгүй текст нь зочдод нэвтэрснээс хойш 10-15 секундын дараа таны холбоосыг орхих эхний шалтгаан юм.

Хоёрдугаарт, вэб нөөцийн өвөрмөц байдал. Интернэтийн орон зайн дэвшилтэт хөгжлийн өнөөгийн хурдаар туйлын өвөрмөц контент олох нь ердөө л бодит бус ажил гэдгийг харгалзан үзэхэд таны даалгавар бол энэ агуулгыг өвөрмөц байдлаар харуулах явдал юм. Өрсөлдөгч сайтуудын тулаанд үл тоомсорлодоггүй хүн үргэлж ялдаг энгийн дүрэмхөгжил, харин эсрэгээр, тэдгээрийг үр дүнтэй ашиглаж, хамгийн их ашиг хүртдэг.

Вэб дизайн дахь типографийн үндэс

Вэб дизайн дахь фонтууд

Типографи вэб дизайнбүрэн байгалийн хууль дүрэмтэй. Фонтуудаас эхэлье. Зөв сонголтФонтууд нь таны хөгжлийн үзэл баримтлалыг ихээхэн тодорхойлж, нөөцийн ерөнхий ойлголтод нөлөөлнө.

Хэдийгээр тэр үеийн талаар маш бага мэдээлэлтэй байсан ч дизайнерууд зөвхөн үйлдлийн системийг дагалддаг фонтуудыг ашиглаж чаддаг байсан. Бүх гайхалтай хувилбарууд нь зураг эсвэл флэшээс өөр зүйл биш байв. Үүнийг шийдвэрлэх арга зам байсан ч маш их асуудал үүсгэсэн.

@font-face CSS өмчийг нэвтрүүлснээр дизайнеруудын гарыг зүгээр л чөлөөлсөн. Би ямар ч фонтын файлын холбоосыг бүртгүүлсэн бөгөөд одоо энэ нь сайтын хуудсан дээр аль хэдийн ашиглагдаж байна. Хөгжүүлэгчдийн зүгээс энэ сэдэвт сэтгэл дундуур байгаа боловч энэ нь бүрэн шийдэгдэх асуудал болж хувирсан.

Бүх фонт нь чадварлаг вэб дизайн хийхэд тохиромжгүй гэдгийг би анхаарна уу. Гол нь унших боломжгүй, дэлгэцээс харахад хүндрэлтэй байдагтай холбоотой. Зарим фонтууд хэтэрхий хүнд бөгөөд нөөцийг удаашруулдаг - үүнд анхаарлаа хандуулаарай. Би нэмж оруулах болно техникийн шинж чанарфонттой ажиллахдаа: тэдгээрийн дэлгэц дотор өөр өөр хөтөч- файл, тэр ч байтугай бүхэл бүтэн гэр бүл боловсруулах ийм асуудал байдаг.

Макро ба микро типографи

Та эдгээр нэр томъёоны нэрнээс аль хэдийн ойлгосон байх:

макро түвшин - бүтээдэг ерөнхий бүтэцтекст, дизайнтай холбоотой контентын байршлыг тодорхойлдог;

бичил түвшин - хамгийн жижиг нарийн ширийн зүйлс, зай, зай, догол гэх мэтийг анхаарч үздэг.

Макро типографийн даалгавар бол дэлхий нийтийнх юм - текст блокуудыг амьд, идэвхтэй, гэхдээ нэгэн зэрэг эв найртай, салшгүй болгох явдал юм. Микротипограф нь илүү энгийн боловч чухал үүрэг гүйцэтгэдэг - уншигдахуйц байдлыг хангах. Эдгээр асуудлыг амжилттай, бүтэлгүйтсэн шийдлүүдийн жишээг Интернет дээр олон бий.

Нэгдмэл найрлагыг бий болгох нь юуны түрүүнд орон зайг ойлгоход оршино. Вэб дизайнер нь зургийг бүхэлд нь харах ёстой, гэхдээ тэр үед үүнийг нарийвчлан задлах ёстой. Энд ямар ч ач холбогдолгүй элементүүд байхгүй: гарчиг, догол мөр, элементүүдийн хоорондох босоо зай, бүртгэл, зузаан ...

Вэб дизайны фонтыг харьцангуй нэгжээр (% эсвэл "em") зааж өгөхийг зөвлөж байна, энэ нь агуулгын дасан зохицох, уян хатан байдлыг дэмждэг. Дэлгэцийн хэмжээ өөрчлөгдөхөд блокууд хөдөлж, фонт нь тогтвортой байх үед хариу үйлдэл үзүүлэхгүй контейнерт илүү танил "px" пикселийг ашиглах нь утга учиртай юм.

Текстийн чимэглэл

Типографийн чухал хэсэг бол компьютерийн симбол бичгийн хэвлэлт юм. Үүнд: цэг таслал тавих, хаалт, зураас, зураас, цэг, зай гэх мэт.

Ийм алдаа нь анх харахад агуулгын агуулга, өвөрмөц байдалд онцгой аюул учруулдаггүй боловч өөрийгөө хүндэтгэдэг ямар ч эх сурвалж бичвэрт энгийн алдаа гаргахыг зөвшөөрөхгүй гэдгийг санаарай. Зургийн талаар санаарай, үүнд ямар ч жижиг зүйл байхгүй!

Одоо зохион байгуулалтын талаар. Энд дүрэм байдаг:

Текстийн блок нь хуудасны өргөний 40-50% -иар хязгаарлагдах ёстой.

Догол мөр хоорондын зай 1.5 байх ёстой.

Арын дэвсгэр болон текстийн хоорондох ялгаа нь 75-90% дотор байх ёстой.

Нүдэнд эвтэйхэн фонт нь 12-16 px, гэхдээ хамгийн жижиг блок нь 10 пикселээс багагүй байх ёстой.

Мөр хоорондын зай нь үсгийн хэмжээтэй харьцуулахад хадгалагдаж, хувиар хэмжигддэг; хамгийн тохиромжтой нь 140-150% хангалттай байх болно.

Текстийг голд нь эсвэл зөвтгөх нь маш муу хэлбэр гэж тооцогддог. Үгсийн хоорондох тасархай зай, догол мөрний ирмэгүүд нь ойлголтыг бууруулж, ихэвчлэн цочроодог.

CSS загварууд

CSS загвар нь вэб дизайн дахь фонттой ажиллах хэрэгсэл юм. Хөгжилөөс CSS загваруудаливаа сургалтын курс эхэлдэг. Тэд юунд хэрэгтэй вэ? Нөөцийн бүх хэв маягийг нэгтгэн дүгнэхийн тулд! CSS нь хуудас, блокуудыг бүхэлд нь нэгтгэж, үндсэн чиглэлээс хазайлтыг хянадаг. Таны ойлгож байгаагаар нэг санаа хангалтгүй, түүнийг хэрэгжүүлэхийн тулд танд мэдлэг, ур чадвар хэрэгтэй болно.

Нэг удаа би нэг сонин нийтлэлээс вэб дизайн нь 95% typography гэж уншсан. Үүнд итгэх эсэхээс үл хамааран хүн бүр өөрөө шийднэ. Гэхдээ унших боломжгүй текст бол зорилгогүй бүтээгдэхүүн юм. Миний танд өгөх зөвлөгөө бол мэдээлэл хүргэх чанарт даруй анхаарлаа хандуулаарай, үүнийг хойшлуулах хэрэггүй. Энэ бол миний хувьд. Шинэчлэлтүүдэд бүртгүүлээрэй, та хамгийн сонирхолтой зүйлсийг алдахгүй байх болно! Баяртай!

Аливаа төөрөгдлийг арилгахын тулд зарим гол нэр томъёоны утгыг тодруулах нь чухал юм. Эхний чухал багц түлхүүр үгс"фонт" ба "хэв маяг" гэсэн ойлголтуудыг тодорхойлно уу.

Фонт гэдэг нь тодорхой хэмжээ, загвар бүхий тэмдэгтүүдийн багц юм. Үсгийн хэв маяг нь үсгийн хэв маягийн гэр бүлүүдийг ижил төстэй байдлаар тодорхойлдог. Энд байгаа түлхүүр үг нь өөр өөр фонтыг бүлэг эсвэл гэр бүл болгон тусгаарладаг загварууд юм. Жишээлбэл, эдгээр нь serif, sans serif, гараар бичсэн, дэлгэц, monospace болон бусад байж болно. Бичгийн хэлбэр нь нийтлэг гүйцэтгэлийн хэв маягаар нэгдсэн янз бүрийн загвар, хэмжээтэй фонтуудын багц гэж бид хэлж чадна. Таны харж байгаагаар фонт нь илүү нарийн ойлголт юм.

Вэб хуудасны загвар зохион бүтээхдээ фонтыг сонгох нь маш чухал. Мэдээжийн хэрэг, стандартаас фонт ашиглах нь хамгийн сайн арга юм Windows багцэсвэл Mac. Гэхдээ заримдаа энэ багц нь дизайнерын санааг хэрэгжүүлэхэд хангалтгүй бөгөөд дараа нь бүх ачаа нь зохион бүтээгчийн мөрөн дээр унадаг. Аз болоход, Google вэб фонтуудэнэ асуудлыг шийдэх маш гоёмсог шийдлийг санал болгож байна.

Мөн "жин", "kerning" гэх мэт нэр томъёо байдаг. Тэдгээрийг бүгдийг нь ашиглан өөрчилж болно CSS хэрэгслүүддогол мөр, гарчиг эсвэл бусад текстийн элементүүдэд хэрэглэнэ. Үсгийн "жин" шинж чанар нь бичих үед мөрийн зузааныг тодорхойлдог. Энэ нь 100-аас 900 хүртэлх утгын цуврал бөгөөд тоо бүр нь хэв маягийн зоригтой тохирох жинг илэрхийлдэг. Ердийн үсгийн "хэвийн" нь 400 тоотой, тод "болд" 700 тоотой тохирч байна. Кернинг гэдэг нь үсгийн хоорондын зайг хэлбэрээс нь хамааруулан өөрчлөх явдал юм. Энэ бол тэмдгүүдийг зөв байрлуулах, тэдгээрийн хоорондын зайг тохируулах үйл явц бөгөөд үүний үр дүнд эв найрамдалтай байх ёстой. Хэдийгээр олон хүмүүс kerning-д төдийлөн ач холбогдол өгдөггүй ч энэ нь маш сайн үр дүнд хүрэхэд тусалдаг жижиг зүйлүүд юм.

Нормыг зөрчсөн

Шинэ фонт бий болгох хэрэгцээг хэлэлцэх нь нэлээд үндэслэлтэй юм. Ард нь Сүүлийн үедолон вэбсайтууд хуучирсан. Тэд бид аль хэдийн залхсан стандарт фонт ашигладаг.

Өнөөдөр олон зуун фонт байдаг, гэхдээ ялгаатай OSөөрсдийн багцыг санал болгож байна. Мөн эдгээр багцад зөвхөн цөөн хэдэн фонт багтсан болно. Хэрэв та хэн нэгэн таны системд байхгүй байж болох фонтыг сонговол уг фонтыг үндсэн фонтоор солих болно. Эдгээр шалтгааны улмаас үндсэн фонтуудыг ашиглахыг зөвлөж байна. Гэхдээ заримдаа үндсэн фонтууд нь дизайнерын төсөөллийг бүрэн гүйцэд гаргаж чаддаггүй. Тиймээс хэрэв та өөрийн загварт тусгай фонт хэрэгтэй гэдэгт итгэлтэй байгаа бол өөрийн тусгай фонтыг зураг болгон хувиргаж, вэбсайтдаа байршуулах боломжтой. Гарчиг, толгой хэсэг эсвэл цэсээ график болгож, тэдгээрийг ашиглана уу.

Гарчиг нь сайтын сэдэвтэй тохирч байгаа эсэхийг шалгаарай. Үүнд өөр өөр өнгө, доогуур зураас, дэвсгэр дүрс, график текст багтаж болно. Эцсийн эцэст шийдвэр таных.

Нэмж дурдахад, та сайт дээрх бүх текстийн холбоосууд ижил фонттой байх ёстой. Янз бүрийн фонт, дизайны холбоосыг ашиглах нь хэрэглэгчдэд навигаци хийхэд ихээхэн бэрхшээл учруулна.

Зөв фонт сонгох

Янз бүрийн фонт нь уншигчдын сэтгэл санаанд өөр өөр нөлөө үзүүлдэг гэдгийг тэмдэглэх нь зүйтэй. Ерөнхийдөө serif фонтууд нь хэвлэмэл материалд илүү тохиромжтой. Сериф нь үсгүүдийн хооронд зай үүсгэхээс гадна нэг тэмдэгтийг нөгөө тэмдэгтээс тусгаарлахад тусалдаг. Ихэнхдээ serif фонтууд нь хувийн мэдрэмжийг өгдөг бөгөөд тэд хүндэтгэл, оюун ухаан, мэргэжлийн ур чадварыг илэрхийлдэг.

Sans serif фонтууд нь вэб хуудсанд хамгийн тохиромжтой. Дэлгэцийн бага нягтрал нь серифийг бүдэгрүүлж, ойлгоход хэцүү болгодог. Sans serif фонтууд нь оновчтой байдал, загварлаг байдал, залуу нас, орчин үеийн мэдрэмжийг илэрхийлэх хандлагатай байдаг.

Жишээлбэл, серифийн сонголт нь мэргэжлийн ур чадвар, эрх мэдэл бүхий мэдээллийн мэдрэмжийг өгдөг. Үүнийг Нью Йорк Таймс гэх мэт гол хэвлэл мэдээллийн хэрэгслээр харж болно. Жижиг блогуудын хувьд та том мөрийн өндөртэй sans serif фонт ашиглаж болно. Энэ нь хэрэглэгчдэд блог текстийг хурдан үзэх боломжийг олгодог.

Та зочдод ямар мэдээлэл хүргэхийг хичээж байгаагаа үргэлж бодож байх ёстой. Үсгийн фонт сонгохдоо аз жаргалтай мессежийг цайвар, агаартай, зөөлөн үсгийн хэлбэртэй байх ёстой, харин Halloween гэх мэт бараан өнгийн сэдэвтэй мессежийг илүү хатуу ирмэгтэй фонттой хавсаргах нь дээр гэдгийг санах хэрэгтэй.

Гаргацтай

Типографи, ихэвчлэн уншигддаггүй хэв маяг нь нүдийг маш ихээр ядаргаатай болгодог. Мэдээжийн хэрэг, шөнийн цэнгээний газруудын сурталчилгаа гэх мэт Funky эсвэл бусад бичигдэшгүй фонтуудыг ашиглаж болох зарим үл хамаарах зүйлүүд байдаг.

Гэсэн хэдий ч, хэрэв та жишээлбэл, сод, уйтгартай эсвэл Акка хэрэглэхийг хүсч байвал энэ санаагаа орхисон нь дээр. Хэрэв хүсэл нь хангалттай хүчтэй хэвээр байвал эдгээр фонтуудыг бага зэрэг ашиглах хэрэгтэй. Жишээлбэл, гарчиг болгон. Гэхдээ дараа нь үндсэн бичвэр илүү гаргацтай байх ёстой. Энэ нь таны сайтад эрч хүчийг бий болгоход тусална. Ийм фонт ашиглах нь сул тал биш харин дизайны давуу тал байх ёстой гэдгийг та санаж байх ёстой.

Мэдээллийн агуулга

Загвар нь таны мессежийг нөхөх ёстой. Дизайнер яг юу бодож байсныг хэрэглэгч ойлгох шаардлагагүй. Бичлэгийн буруу сонголт нь хэрэглэгчийн компани болон түүний үйлчилгээний талаарх буруу ойлголтыг бий болгоход хувь нэмэр оруулдаг.

Бизнесийн төсөл зохиохдоо та ихэвчлэн уламжлалт гөлгөр фонтуудыг ашиглах хэрэгтэй. Хэрэв танд албан ёсны загвар байхгүй бол үүнийг бас анхаарч үзэх хэрэгтэй. Ялангуяа хүмүүс таны сайтыг нухацтай авч үзэхийг хүсч байвал.

Байршил ба хэмжээс

Энэ нь үр дүнтэй дизайн хийхэд маш чухал юм - текстийг ямар газар байрлуулах, түүний хэмжээ ямар байх ёстой. Мэдээлэл унших эсвэл вэбсайтаас гайхалтай том үгсийг харахын тулд нүдээ чангалахыг хэн ч хүсэхгүй. Сайн дизайны зорилго бол тэнцвэрийг олох явдал юм. Үүний эхний алхам бол аль мэдээлэл илүү чухал болохыг тодорхойлох явдал юм.

Ерөнхийдөө таны анхаарахыг хүсч буй үгсийг бага зэрэг хийх хэрэгтэй. Эсвэл эсрэгээр - бага насныхан бага байх ёстой. Энэ бүхэн ач холбогдлоос хамаарна. Өөрөөр хэлбэл, та үгсийн шатлалыг бий болгох хэрэгтэй.

Үсгийн фонт байрлуулах тухайд үүнийг тэнцвэртэй байлгахыг хичээ. Текстийн хэсгийг дөрвөн өнцөгт тараах шаардлагагүй. Энэ нь хэрэглэгчдийн анхаарлыг ихээхэн сарниулах болно.

Өнгө

Энэ бол хамгийн хялбар талуудын нэг юм. Та текстийг цаанаас нь ялгаж, уншихад хялбар болгох өнгө сонгох хэрэгтэй.

Таны туслахууд тодосгогч өнгө, түүнчлэн цус харвалт (цус харвалт) болон гэрэлтэх (гэрэлтэх) гэх мэт эффектүүдийг ашиглах болно. Энэ нь сайтыг илүү сонирхолтой, уншихад хялбар болгоход тусална. Та хүмүүсийг зогсоод харагдуулах өнгө сонгох хэрэгтэй бөгөөд мэдээллийг дизайны зонхилох хэсэг болгох хэрэгтэй.

Дүгнэлт

Photoshop дээр фонт ашиглах нь вэб хуудсан дээр ашиглахаас эрс ялгаатай. Энэ нь зарим загвар зохион бүтээгчид яагаад хэв загвартай ажиллахад хэцүү байдгийг тайлбарлаж байна. Вэб дээр хэвлэх нь нэлээд өргөн сэдэв бөгөөд маш их судалгаа шаарддаг. Загварын сэтгэл хөдлөл, гоо зүйд тохирсон хэв маягийг ашиглах аргыг олох нь маш чухал гэдгийг та үргэлж санаж байх хэрэгтэй. Холихоос бүү ай Төрөл бүрийн төрөлфонтууд, зүгээр л сайн байгаа эсэхийг шалгаарай.

Найзууд аа!

Энэ нийтлэлд би шинэхэн дизайнеруудын хамгийн нийтлэг алдаануудад дүн шинжилгээ хийх болно.

Өнөөдөр бид фонт ашиглах талаар ярих болно. Би анхлан суралцагчийн ажлыг мэргэжлийн хүнээс хэрхэн ялгаж чадахыг та мэдэх үү? Эхлэгч нь дүрмээр бол сурсан бүх зүйлээ ажилдаа харуулахыг хичээдэг. Энэ нь нэг ажилд янз бүрийн өнгө, янз бүрийн эффект, мэдээжийн хэрэг олон тооны фонтыг элбэг ашиглахад илэрдэг. Мэргэжлийн дизайнер нь эсрэгээрээ нэг төслийн хүрээнд нэг буюу хамгийн ихдээ хоёр фонт, мөн хязгаарлагдмал өнгөт палитр ашигладаг. Хэрэв тэр график эффектгүйгээр хийх боломжгүй бол түүний хэрэглээг хамгийн бага хэмжээнд хүртэл бууруулахыг хичээдэг.

Тэгэхээр, сайн зураг төслийн номер нэг дүрэм бол барилга юм модульчлагдсан сүлжээ(нийтлэлийг үзнэ үү), дараа нь хоёр дахь дүрэм: үсгийн тоог хязгаарлах!

Хамгийн бага тооны фонт нь дизайны нийцэл, тууштай байдлыг дэмждэг. Таны бүтээл бага байх тусам өөр өөр хэв маяг, бүх төрлийн өнгө, фонтоор дүүрэн байх тусам илүү утга учиртай, мэргэжлийн харагддаг.

Ихэнхдээ дизайнер нь төслийн нэг фонтыг сонгодог. Түүнчлэн, сонгосон үсгийн шинж чанар нь дизайны бүтээлч санаа эсвэл сэтгэл санааны байдалд тохирсон байх ёстой. Жишээлбэл, хэрэв бид зориулж товхимол хийж байгаа бол гар утасГурав дахь үе, дараа нь хөнгөн, орчин үеийн sans-serif фонт нь бидэнд тохирох болно. Гэхдээ Эрмитаж дахь импрессионист үзмэрийн сэдэвтэй товхимол нь сонгодог, "хөл дээрээ тогтсон" сериф фонтод илүү тохиромжтой байх болно. Ерөнхийдөө фонтыг амжилттай сонгох нь дизайнерын ажилд туйлын чухал байдаг, учир нь фонтын шинж чанар, төслийн санаа, мөн чанар хоорондын зөрүү нь бүхэл бүтэн ажлыг сүйтгэж болзошгүй юм.

Заримдаа нэмэлт фонт ашиглах шаардлагатай болдог. Хоёр фонттой ажиллахад эхний фонт нь тухайн бүтээлийн сэтгэл санаа, шинж чанарыг онцолж, хувь хүний ​​онцлогийг өгдөг. Энэ фонт нь гарчиг болон дэд гарчигт ашиглагддаг. Заримдаа дизайнерууд энэ зорилгоор ер бусын фонт ашигладаг. Энэ нь өвөрмөц байдлын үүднээс хийгддэггүй, харин хоёр дахь, илүү танил фонттой харьцуулахад тодосгогчийг нэмэгдүүлэх замаар текстийн тодорхой хэсгийг тодруулах зорилготой юм.

Нэг бүтээлд тийм олон гарчиг байдаггүй тул тодосгогч зарчим нь өө сэвгүй ажилладаг, ялангуяа гарчиг нь үндсэн бичвэрээс хамаагүй том байдаг.

Хоёрдахь фонт нь дүрмээр бол нүдэнд илүү танил бөгөөд түүний даалгавар нь үзэгчдийн анхаарлыг татах биш харин зөвхөн мэдээллийн чиг үүргийг гүйцэтгэх явдал юм. Уншихад хялбар, нүдийг чинь ядраахгүй байх ёстой. Эхлэн суралцагчид ихэвчлэн уншихад хэцүү, үрэлгэн фонтоор том текстийн хэсгүүдийг бүтээхэд ноцтой алдаа гаргадаг. Би бас "гараар бичсэн" фонтуудын дийлэнх хувийг ийм фонт болгон оруулдаг. Ийм фонтууд нь жижиг мэндчилгээний картанд тохиромжтой, гэхдээ түүнтэй ажиллахад тохиромжтой биш юм их хэмжээнийтекст.

Фонтыг сайн ашиглах жишээ энд байна:

Таны харж байгаагаар энд зөвхөн хоёр фонт ашиглаж байна. Нэг нь гарчиг, нөгөө нь үндсэн текст. Энэ ажил нь гоёмсог, тууштай харагдаж байна.

Фонтын буруу хэрэглээг энд харуулав.

Энд би зориуд зарим нэг ер бусын фонтуудыг ашиглан энэ дизайны зохицолгүй, үл нийцэх байдлыг мэдрэх болно. Ажилдаа хэт олон фонт бүү ашигла! 8 янзын фонт холилдсон, тэр тусмаа үрэлгэн, уншихад хэцүү фонттой ажил шиг муухай зүйл байхгүй.

Ийм ажлын жишээ энд байна:

Энэ бол миний төсөөллийн бүтээл биш. Би ийм олон бүтээлийг харсан бөгөөд дүрмээр бол шинэхэн дизайнерууд эсвэл сонирхогчид хийсэн.

Хэрэв та дизайны сурах бичгийг харвал гарчигт sans serif фонт, үндсэн текстийн хувьд сериф фонт ашиглах зөвлөмжийг олох болно.

Гэхдээ энэ дүрэм хэтэрхий ерөнхий бөгөөд практик дээр үүнийг тойрч гарах шаардлагатай болдог.
Ингээд эцэст нь дахиад нэг зөвлөгөө өгье. Хэрэв гарчгийн фонт нь орчин үеийн харагдаж байвал үндсэн фонт болгон sans-serif фонтыг сонгох нь дээр. Хэрэв таны анхны фонт хуучирсан бол үндсэн фонт нь serif байх ёстой.

Үсгийн фонт ашиглах сэдэв нь шавхагдашгүй тул нэг жижиг нийтлэлд бүх зүйлийн талаар ярих боломжгүй юм. Боломжтой бол фонттой ажиллах мэдлэгээ та бүхэнтэй хуваалцах болно. Дашрамд хэлэхэд миний дотор InDesign сургалтын курс, Би энэ чухал сэдэвт маш их анхаарал хандуулдаг.