Գեղեցիկ տպագրություն վեբ ձեւավորման մեջ: Գեղեցիկ տպագրություն Վեբ դիզայնի մեջ Գեղեցիկ տպագրություն

Typewolf տառատեսակների վերաբերյալ ռեսուրսների կուրիչը Jeremy Schoaf- ը ընտրեց կայքերի օրինակներ Հետաքրքիր տառատեսակային լուծումներով եւ նկարագրեց նրանց առավելություններն ու թերությունները:

Թղթի բարակ հյուսվածքով համադրությամբ, այս տպագրությունը զգում է այնպիսի զգացողություն, որ կարդում եք գիրքը:

Պարզապես մաստակ:

Շնորհիվ վեբ տառատեսակների, որոնք կօգնեն տեղավորել արտադրանքի տպագրությունը `արտադրողի տպագրության վրա: Դա տեղի է ունենում ավելի ու ավելի հաճախ: Կայքը պարզապես մաստակը ընտրեց Գոթամը իր ապրանքանիշը նկարելու համար, որը պահպանում է կայուն եւ առցանց եւ օֆլայն ջրանցքների ինքնությունը:

Այս կայքը լավ օրինակ է, թե ինչպես է միայն մեկ խաղարկությունը երբեմն անհրաժեշտը: Օգտագործելով գոթամի տարբեր հագեցվածությունը եւ վերին դեպքում վերնագրերը կարգավորելը, պարզապես մաստակը տեղադրեց ամեն ինչի հստակ հիերարխիան `մեկ ինտենսիվությամբ:

Լոգոները վերնագրում եւ ոտնահետքերով կանգնած են PNG ձեւաչափով, այնպես որ նրանք կորցնում են համացանցային տառատեսակի հստակությունն ու մասշտաբը: Լոգոյի համար վեբ տառատեսակի օգտագործումը միշտ չէ, որ հնարավոր է, մանավանդ, եթե ձեզ հարկավոր է լավ վերահսկողություն գանգուրի վրա. Այնուամենայնիվ, SVG- ի պատկերը այս դեպքում կկարողանա ավելի լավ, քան PNG- ն, քանի որ այն կարող է մասշտաբի եւ միեւնույն ժամանակ պահպանել իր հստակությունը:

Ամփոփություն

Բարեբախտաբար, վերոհիշյալները վերոհիշյալ էին, քանի որ տպագրության որոշակի լուծումներ կարող են ազդել դիզայնի վրա: Այստեղ դուք ունեք մի քանի հիմնական մտքեր.

  • Եթե \u200b\u200bպատրաստվում եք օգտագործել մի քանի հարվածներ, ապա մշտական \u200b\u200bհամակարգ մշակել որոշակի տպագրության մեջ եւ կպչել դրան:
  • Հիմնական տեքստի համար ընտրեք տառատեսակ, նորմալ italic, ճարպային մակագրությամբ եւ համարձակ ոճով ֆիթնես:
  • Եթե \u200b\u200bդուք պատրաստվում եք ընտրել հանրաճանաչ դիզայն, փորձեք այն համատեղել ավելի քիչ բերված, դիզայնը տարբերակելու համար:
  • Ծրագրի սկզբում պատրաստեք ոճային ուղեցույց, ձեր թիմի անդամների միջեւ տառատեսակների հաջորդական օգտագործումը երաշխավորելու համար:
  • Օգտագործեք հակադրություն եւ նման չէ դիզայնին:
  • Մի օգտագործեք էկրանի տառատեսակները հիմնական տեքստի համար: Օգտագործեք դիզայնը նպատակակետում:
  • Մի վախեցեք օգտագործել ոչ-ոքի միայն մեկ յոթը: Դուք կարող եք տեղադրել հիերարխիան `մեկ ընտանիքի տարբեր հագեցվածության եւ ոճի օգնությամբ:
  • Եթե \u200b\u200bձեր պատկերանշանը թույլ է տալիս այն կատարել SVG- ում `սահմանում եւ մասշտաբրություն ապահովելու համար:

Գերազանց կայք է սկսվում գեղեցիկ տպագրությունից: Եվ չնայած որոշ կանոններ կարող են կոտրվել, երբեմն, ճիշտ կլինի վերադառնալ այն հիմնական սկզբունքներին, թե որն է լավ տպագրություն եւ ինչպես ստեղծել այն:

Այս հիշեցումը կօգնի ձեզ թարմ հայացք ձեր նախագծերին, մտածեք նոր մոտեցումների մասին կամ վերադառնա ավելի պարզ ձեւավորման:

Այսպիսով, այսօր մենք անտեսում ենք նորաձեւության միտումները, կենտրոնանում են տպագրության տեսության վրա, եւ թե ինչպես «կանոնները» կարող են օգնել մեզ գեղեցիկ տեքստեր ստեղծելու գործում:

Չափ եւ հիերարխիա

Չափի հարցերը: Ընթերցվող տպագրություն ստեղծելու համար դա կարող է լինել որոշիչ գործոն: Փոքր տեքստը դժվար է հաշվի առնել, ոչ թե կարդալու ինչ-որ բան, բայց շատ մեծ, կգերազանցի գծի բարձրությունը եւ կհանգեցնի խառնաշփոթի:

Ձայնագրելի տպագրությունն ունի հիերարխիայի մի քանի շերտեր: Այս շերտերը ենթադրում են, որ օգտագործողը, ով պետք է կարդա առաջինում, երկրորդում եւ երրորդ տեղում: Բացի այդ, տեքստի չափերի ակնհայտ հիերարխիա կա `վերնագրերի մի չափս, մյուսը, հիմնական տեքստում, իսկ երրորդը, ենթավերնագրերում:

Հետեւում եւ կերինգ

Հետեւելը եւ Kerning- ը հաճախ շփոթված են: Քորդնինգը տառերի միջեւ ընկած ժամանակահատվածում ընտրովի փոփոխություն է, կախված դրանց ձեւից: Tracking- ը տառերի հավաքածուի միջեւ ընկած ժամանակահատվածի փոփոխություն է, I.E., պարբերություններ կամ տեքստի բոլոր բլոկի միջեւ:

Կերինը հաճախ կիրառվում է հատուկ տարրերի վրա `ստեղծագործելիության հստակություն, բարելավում, եւ, նույնիսկ, տեքստի նորաձեւ հատվածների համար: Հետեւելը հաճախ օգտագործվում է հիմնական տեքստի տառատեսակը չափազանց լայն տարածելու համար:

Սահմանափակեք կիրառական ոճի ոճերի քանակը

Ծրագրերի մեծ մասի համար կան երկու կամ երեք ոճ: Որպեսզի սխալ չլինի ընտրելու համար, գտեք տառատեսակի ընտանիքը մեծ քանակություն Առկա նկարչական տատանումներ: Ամենաբարձր որակի տառատեսակները ունեն լայն տեսականի, ճարպ, սովորական, italic, խտացրած, սեւ եւ այլն:

Խառնել եւ համեմատել ոճերը

Ես խորհուրդ եմ տալիս ընտրել երկու տարբեր ոճեր: Ամենատարածված զույգը սերիֆն \u200b\u200bէ եւ Sans Serif- ը: Միացնելով տարբեր ոճեր եւ ոչ-ոքի, փնտրեք տառեր, նույն բարձրությամբ եւ ձեւով:

Այս փոքր մանրամասները զգալիորեն կանդրադառնան, թե ինչպես են այս տառատեսակները միասին կանդրադառնան, եւ տեքստի ընթերցման հարմարության վրա:

Փոխանցում եւ անջատում

Շատ դեպքերում լարային փոխանցումներ եւ դրա կարիքը չունեն: Առցանց տեքստի դեպքում այս տեխնիկան միայն բարդացնում է արագ ձուլումը եւ հասկացողությունը: Փոխանցումները խանգարում են ընթերցանությանը եւ ամբողջական ուժին հաճախ չեն հանգեցնում անընթեռնելի ձեւաչափման:

Մի փոխեք տառատեսակները

Երբեք մի փոխեք տառատեսակը: Մի փորձեք այն ավելի խիտ, բարակ կամ ավելի բարձր դարձնել: Ավելի լավ է ընտրել մեկ այլ:

Տառատեսակի զարգացման դիզայներները շատ ժամանակ են ծախսում, որ այս տառատեսակը խորհրդատվություն է եւ բավարարում է ոճի ոճը: Կարիք չկա որեւէ բան փոխել: Դուք չեք կարողանա բարելավել այն, եւ շատ դեպքերում այն \u200b\u200bընդամենը կփչացնի ամեն ինչ:

Եթե \u200b\u200bտառատեսակը ձեզ չի համապատասխանում, ուրիշ բան փնտրեք: Օգտագործեք նույնականացման նման տառատեսակի գործիք, գործիք, որը սահմանում է նմանատիպ տառատեսակներ:

Հակադրություն

Հակադրություն ստեղծելու համար օգտագործեք տպագրությունը: Նաեւ ինչպես ստեղծել հիերարխիա, որը դուք օգտագործում եք տարբեր չափսեր, տեսողական հետաքրքրություն առաջացրեք `փոխելով քաշը, գույնը եւ տառատեսակի ոճը:

Գույնը ամենաարդյունավետներից մեկն է եւ Պարզ եղանակներ Հակադրության ստեղծում: Կատարյալ հակադրություն - մուգ տեքստ `թեթեւ ֆոնի վրա (կամ հակառակը): Դուք ունեք գրեթե անսահմանափակ գույներ, որոնք կօգնեն ձեզ հասնել այս նպատակին: Խաղում եմ գույնի եւ տպագրության հետ, հիշեք, որ մի քանի գույնի համադրություններ, օրինակ, վառ կարմիր վառ կապույտի վրա, կարող են բավականին դժվար լինել:

Երբ հակադրվում է, ձեռք բերելու ընթերցվող տեքստ ստեղծելը լավագույն օգտագործեք պարզ ֆոն: Բայց եթե այն պարունակում է նման տեսողական տարրեր, ինչպիսիք են պատկերները կամ նախշերը, ապա բարձրացրեք տառերի չափը. Սա կստեղծի բաժանմունք ֆոնի եւ առաջին պլանի տարրերի միջեւ:

Հավաքածուի ժապավենի ձեւաչափ

Հիանալի խմբի ձեւաչափը բեռնարկղի տեքստի չափն է: Դա կարող է լինել ամբողջ տեքստի շրջանակի լայնությունը կամ միակ սյունակը:

Տողի ձեւաչափը կարեւոր է, քանի որ էկրանին նիշերի (ներառյալ տարածությունների, հատուկ նիշերի եւ կետադրական նշանների) քանակը ազդում են ընթերցելիության վրա: Եթե \u200b\u200bտողերը շատ երկար են կամ շատ կարճ, օգտագործողի տեսքը դժվար կլինի շարժվել:

Տպագրական ոճի տարրերից. «45-ից 75-ից սկսած ցանկացած կերպարներ, որոնք համարվում են գոհացուցիչ լարային երկարություն մեկ սյունակի հավաքածուի համար: 66 նիշ տողը (ներառյալ տառերն ու տարածությունները) համարվում է կատարյալ: Multicolone հավաքածուի համար իդեալական միջինը կլինի լարային, երկարատեւ 40-50 խորհրդանիշ »:

Նույնիսկ չնայած այն հանգամանքին, որ այս գրքի հրատարակման պահին ոչ ոք չէր մտածում բջջային տպագրության մասին, Multicolon Set- ին վերաբերող առաջարկությունը չի կորցրել իր արդիականությունը: Փոքր էկրաններով դեպքերում նույնիսկ կարող եք օգտագործել յուրաքանչյուր տողի 35 նիշ:

Article Carrie Casins- ի թարգմանություն

Այս ցուցակը կազմվում է II- ի արդյունքների համաձայն: 2008 թ. Նախորդ «Հիթային դրախտները» կարելի է գտնել եւ:

Յուրաքանչյուր օրինակ ուղեկցվում է համառոտ մեկնաբանությամբ եւ սքրինշոթը սեղմելը տանում է դեպի սկզբնական կայք:

Սերմերի համաժողով

Ոչ մի ֆլեշ, ոչ նկար, աղմուկ չկա; Պարզապես լավ ոճավորված տառատեսակ եւ լավ գրված տեքստ. Իրական ապացույց, որ միայն տառատեսակով կարելի է ձեռք բերել մեծ արդյունք: Ես կցանկանայի տեսնել այսպիսի օրինակներ:

Նորություններ ձեւավորելը:

Վերնագրի եւ հիմնական բովանդակության մեծ հակադրությունը, շատ մաքուր տարածություն եւ լավ կազմակերպություն:

Omniti.

Հաճելի պատկերանշանը, հստակ տեքստը եւ շատ գեղեցիկ գունային սխեման: Իմացեք ավելին նախագծման մշակման մասին կարելի է կարդալ:

Designr.it.

Հոյակապ տեսակի ձեւավորված պատկերանշան (որեւէ մեկը գիտի, թե որ տառատեսակն է) եւ շատ զտված մասեր:

Դիզայնի դիտում:

Էնդի Ռաբլժվար. Դիզայներ, որը գործնականում կիրառում է նույն սկզբունքները, որոնք նպաստում են: Ինձ դուր է գալիս, թե ինչպես է նա փոխում աղեղի չափը, կախված հոդվածի հրապարակման օրվանից, ուստի ամենաթարմ տեքստը համապատասխանում է մեծագույն կարիալին:

WordPress.org & WP 2.5.x կառավարիչ

Չնայած WordPress Blogger պլատֆորմը հիմնված չէ կայքի վրա, բայց նրանց կայքը ցուցադրվում է հազարավոր, եթե ոչ միլիոնավոր, մեր էկրաններ ամեն օր: Ես կցանկանայի ավելի շատ առցանց եւ անցանց դիմումներ, ինչպես նաեւ:

Ucepype.

Ես իսկապես չէի ցանկանում այս կայքը ներառել վերանայման մեջ, քանի որ դրա վրա օգտագործվում է ֆլեշ: Այնուամենայնիվ, դրա վրա ներկայացված են որոշ հիանալի տառատեսակներ (եւ իմ ընտրյալներից ոմանք պետք է ավելացնեն):

Տախտակամածը:

Մեկ այլ կայք, որը հիմնված է միայն ամեն ինչի տառատեսակների վրա: Հիերարխիայի եւ գծանշման հիանալի օրինակ: Ով ասաց, որ «լուսանկարն ասում է ավելի քան հազար բառ»: Ոչ, տառատեսակը ավելի լավ է ասում:

Դժոխք այո, ընկեր:

Շատ տեղեկություններ, առանց խստության զգալու, գումարած կայքը կապված է լավ ֆրեզերային ցանցի հետ:

Տեղեկատվական ճարտարապետներ:

Դիզայներները չէին վախենում մեծ դատարկ հատվածներից եւ սահմանափակ գույներով:

Նազ Համիդ:

Լավ արված: Դիզայն, որը խոսում է իր համար:

Jon tan.

Տպագրական առումով հագեցած, էլեգանտ եւ առանց քաոսի եւ պատկերանշան ... դա նկար չէ:

Քննարկվում է:

Շատ լավ պատվիրված տեղեկատվություն, եւ այն ուղեկցվում է կոկիկ ընտրված գունային պալիտրա միջոցով:

Elliot Jay պաշարներ:

Այս կայքը առաջ է քաշվել բազմաթիվ մրցույթներում: Նա այստեղ հայտնվեց տառատեսակների լավ օգտագործման շնորհիվ:

Այն բաները, որոնք մենք անում ենք

Բազմաթիվ, կազմակերպված եւ մեծ տառատեսակ:

Հաջորդ հոդվածում «Վեբ գրության մանրամասն վերլուծություն» թեմայով մենք ուշադիր քննարկում ենք այս կայքերից մի քանիսը: