9 padomi labākai tipogrāfiskai hierarhijai
Katram projektam ir nepieciešama sistēma un teksta elementu hierarhija. Iedomājieties tikai par visiem mazajiem teksta gabaliem, kas tiek izmantoti visā dizainā - virsrakstus, pamattekstu, navigācijas elementus, juridisko informāciju, parakstus un tā tālāk.
Bet kā jūs izveidojat šo hierarhiju, lai katrs teksta elements vienmērīgi plūst uz nākamo? Šodien mēs jums soli pa solim izveidosim tipogrāfijas hierarhijas sistēmu, kuru var izmantot gandrīz jebkuram dizaina projektam. (Un mēs savienojam padomus ar skaistiem lieliskas tipogrāfijas piemēriem, lai palīdzētu jums iegūt nelielu iedvesmu.)
Izpētiet Envato elementus
1. Sāciet ar ērtu ķermeņa kopiju
Lai gan jūs varētu vēlēties sākt ar foršu virsraksta ārstēšanu, vieta, kur sākt, faktiski ir pa vidu. Vispirms izveidojiet ērtu burtu, izmēru un atstarpi galvenā korpusa kopijai.
Tam vajadzētu būt jēgai, jo tā ir lielākā teksta daļa dizainā. Neatkarīgi no tā, vai veidojat vietni vai brošūru, šī koncepcija ir tāda pati. Saskaņā ar Baimarda institūta datiem ķermeņa kopijas ideāla lasāmība ir no 50 līdz 60 rakstzīmēm vienā rindā (vai kolonnā). Šī vadlīnija palīdzēs iestatīt lasāmā teksta mērogu un ņemt vērā dažāda veida burtveidolu (piemēram, parasto versiju saīsinātu versiju pret plāksni).
2. Veidojiet mērogu
Tiklīdz jūs zināt, kāda būs ķermeņa kopija, jūs varat iestatīt mērogu ap to visiem pārējiem teksta elementiem dizainā. Var būt viegli nepamanīt noteiktus teksta blokus; izveidojiet sarakstu ar katru atšķirīgo teksta lietojumu jūsu projektā.
- Ķermeņa kopija
- Virsraksti
- Apakšpozīcijas
- Paraksti
- Bloķēt pēdiņas
- Navigācijas elementi
- Kājenes informācija
- Likumīga kopija vai atrunas
Tagad izveidojiet mērogu, kas nosaka burtu burtu, izmēru diapazonu un izmantošanu katram no šiem elementiem. (Un iebūvējiet to vietņu CSS vai darba dokumentu stilu failos.) Ir vairāki veidi, kā izveidot mērogu, taču labs sākumpunkts var būt lieluma procenti. Varat arī izveidot skalu, pamatojoties uz matemātiku aiz bāzes līnijas režģa vai vizuāli.
Sākumā ir vienkārša skala:
- Ķermeņa kopijas lielums
- Virsraksti ir ķermeņa kopijas lielums, kas reizināts ar 220%
- Apakšpozīcijas ir ķermeņa kopijas lielums, kas reizināts ar 150%
- Navigācijas elementi ir ķermeņa kopijas lielums, kas reizināts ar 80%
- Kājenes / likumīgās kopijas korpusa lielums ir 80 reizes
3. Domājiet, ka lielākais ir mazākais, augšā - apakšā
Šis noteikums ir diezgan vienkāršs: vislielākajam un vissvarīgākajam tekstam jābūt augšpusē, un lasot lapu vai ekrānu, izmēriem vajadzētu samazināties.
Tas nenozīmē, ka jūs nevarat katru reizi pārkāpt šo noteikumu ar nelielu dizaina smalkumu, bet tam vienmēr vajadzētu būt sākumpunktam tipogrāfiskās hierarhijas veidošanā. (Kurš patiešām ritina virsraksta Web lapas beigām un pēc tam atpakaļ uz augšu, lai sāktu lasīt?)
4. Izstrādājiet kosmosa noteikumus
Tikpat svarīgi kā burtu lielums ir atstarpe starp un ap to. Starp telpas noteikšanas faktoriem ietilpst priekšējais (vai līnijas augstums), ievilkumi (vai nav), iesaiņojumi un notekas un izlīdzināšana.
Apsveriet atstarpes proporcijas, kas atspoguļo mērogu, ko izmanto teksta lieluma noteikšanai. Arī audekla izmērs ir diezgan svarīgs šeit. Lielāki audekli ir lasāmi ar stingrāku atstatumu nekā mazie audekli. (Tāpēc daudziem projektiem ir daudz mazākas atstarpes attiecībā uz ierīcēm, piemēram, mobilajiem tālruņiem, un stingrāki noteikumi darbvirsmām.)
Tāpat kā ar burtu lielumiem, atstarpes noteikumi būtu jāievieš iepriekš visam projektēšanas ietvaram. Konsekventa, tīra atstarpe ir viena no mazām lietām, kas var radīt vai sabojāt dizainu.
5. Iestatiet treknrakstu un slīprakstu
Kaut arī treknrakstā un slīprakstā nav atšķirīga tipa elementu vai izmēru, lietojums ir svarīgs. (Vienkārši tēlojiet, kā izskatīsies dizains, ja visi citi vārdi būs treknrakstā.)
Tas padara treknu un slīprakstu pamatnostādnes īpaši svarīgas. Tā vietā, lai aplūkotu izmēru vai vietu, apsvērums ir daudz kontekstuālāks. Lietošanas specifikācijās var būt noteikts, ka tikai tik daudziem vārdiem vai frāzēm (vai konkrētiem vārdiem vai frāzēm) var būt šāda apstrāde. Bieži pieļauta kļūda ir pārmērīgi izmantot treknrakstu un slīprakstu; ja rodas šaubas, nelietojiet to.
6. Izveidojiet “Z”
Kopējā lasīšanas shēma ir Z forma. Neatkarīgi no tā, vai veidojat valodu, kas skan no kreisās uz labo vai no labās uz kreiso (apvelciet Z), lietotāji lasīs no viena stūra pāri līnijai līdz beigām un pēc tam atpakaļ uz sākuma stūris un pāri līnijai atkārtotā rakstā.
Izmantojiet šo dabisko plūsmu, ievietojot teksta elementus uz ekrāna. Šīs Z formas dēļ vairums zīmolu izvieto logotipu augšējā kreisajā stūrī. Tā ir pirmā vieta, kurai acs nolaižas lasot.
7. Apsveriet vizuālo svaru
Izmērs nav vienīgais faktors, kad runa ir par to, cik liels teksta elements izskatās ekrānā. Vizuālais svars ir tikpat svarīgs un var ietekmēt tipogrāfiskās skalas veidošanas veidu.
Veidraksti izskatīsies lielāki, ja:
- Tajos ietilpst bieza gājiena svari
- Tajos ietilpst uzplaukumi vai izrotājumi
- Viņi ir plaši
- Tie ir jaunievedumu bāzes burtveidoli
- Viņiem ir garāks x-augstums
- Tos izmanto kā visus vāciņus
Šrifti izskatīsies mazāki, ja:
- Tie ir kondensēti
- Tajos ietilpst viegls vai plāns gājiena platums
- Ar fonu ir maz kontrastu
- Tos lieto ar mazajiem burtiem
8. Izveidojiet akcentus
Ir daži vārdi, kurus vēlēsities izcelt un kas nedaudz atpaliek no parastās tipogrāfiskās skalas. Pievienojot burtiem akcentu, tas var izcelties, nepielāgojot faktisko izmēru vai burtu.
Pie izplatītākajiem akcentiem pieder:
- Krāsa
- Pasvītrojums
- Iezīmējiet
- Teksts pogā vai formā
- Vienkārša animācija
- Mainīt gadījumā no cita veida tāda paša izmēra
Jauka lieta par jebkuru akcentu tipa hierarhijā ir tā, ka tas ir tūlītējs uzmanības piesaistītājs. Šie elementi ir jāizmanto taupīgi, lai panāktu lielāko triecienu un galvenos elementus konstrukcijā.
9. Izmantojiet “Acu testu”
Visbeidzot, katram noteikumam ir izņēmums (vai divi). Tur nāk klāt “acu pārbaude”. Paskatieties uz skalu uz ekrāna. Kā teksts izskatās un jūtas jums? Vai ir loģiska plūsma? To ir viegli lasīt?
Ja tas kaut kādā veidā jūtas izslēgts, apsveriet iespēju pielāgot mērogu. Atkarībā no izmantotā burtveidola un citiem dizaina elementiem - no attēliem līdz krāsām līdz kontrastam - skala būs jāpielāgo no jūsu puses. Tas ir tikai sākumpunkts, kad neesat pārliecināts, ko vēlaties darīt.
Un pajautājiet arī citām acīm. Izveidojiet vienu vai divas versijas ar dažādām hierarhijām, lai redzētu, kura versija saņem vislabāko atbildi. Dizains ir vizuālā māksla, padarot “acu pārbaudi” par neprecīzu, bet diezgan uzticamu iespēju.
Secinājums
Kad esat iestatījis projekta tipogrāfisko hierarhiju, vislabāk to var dokumentēt. Izmantojot CSS, izveidojiet vietņu mērogu vai izveidojiet stilu failus, strādājot ar drukātiem projektiem.
Lielāka mēroga dizainam vai zīmolam rakstiet skalu un specifikācijas stila rokasgrāmatā. Tipa hierarhijas izveidošanai ir nepieciešams neliels darbs aizmugurē, taču tas padara projektu pabeigšanu ātrāku, vieglāku un nemaz nerunājot par konsekventāku, jo jūs virzāties uz priekšu ar nākamajiem projektiem.
