Baltų plotų (whitespace) panaudojimas

InternetasInterneto svetainės

0 • 9741 •

Pav.: Baltų plotų (whitespace) panaudojimas

Remiantis Mark Boulton straipsniu tinklapyje www.alistapart.com. Medžiagą parengė Mindaugas Brazaitis, 2009

Įžanga

Šiame straipsnyje apžvelgsime baltų tarpų panaudojimą (ang. whitespace). Ar geras teksto išdėstymas turi įtakos skaitymui? Vienareikšmiškai - taip. Gal dėmesio niekada ir neatkreipiame, kodėl vienus tinklapius ar lankstinukus yra malonu skaityti, jie atrodo prabangiai, o kiti - ne taip. „Lengvas“ įskaitomumas ir bendras teksto kuriamas pojūtis formuojamas baltų tarpų pagalba, pavyzdžiui, tarpo dydžiu tarp raidžiu (letter-spacing), eilutės aukščiu (line-height) ir manipuliuojant teksto nustatymais, tokiais kaip svoris (weight), šrifto šeimos (font-family) ir t.t. Taigi, norėdami valdyti skaitytojo dėmesį, sukurti tinkamą dizainą, turėtume išmokti pagrindinius dalykus, kuriuos ir apžvelgsime.

Maži ir dideli tarpai

Kiekviename tekste ir ne tik, kurį galime rasti žurnale, knygoje ar interneto svetainėje, yra tarpai: trumpai sakant – jų yra visur. Pradėkime nuo to, kas yra tarpas? Tarpas, kitaip dar vadinamas negatyviu tarpu, yra plotas tarp elementų, išsidėsčiusių kompozicijoje.

Juos galima skirstyti į dvi daugiau specifines rūšis, tokias kaip:

  • Dideli(macro) tarpai - kompozicijoje esantys tarp pagrindinių elementų (1 pav.);
  • Maži(micro) tarpai - plotas tarp „mažųjų“ elementų – sąrašo elementų, antraštės ir paveikslėlio arba žodžių iš raidžių (2 pav.).

Šios rūšys yra lygiareikšmės ir vienodai svarbios kokybiškam dizainui.

 

Macro tarpai Macro tarpai

1 pav. Dideli (macro) tarpai kompozicijoje esantys tarp pagrindinių elementų

Micro tarpai Micro tarpai

2 pav. Maži(micro) tarpai kompozicijoje esantys tarp „mažųjų“ elementų

Maži(micro) tarpai ir įskaitomumas

Bremeno Dailės Universiteto dėstytojas, Erik Spiekermann, žinomas vokiečių tipogrfas, pateikia puikų mažų(micro) tarpų praktinio panaudojimo ir gauto rezultato pavyzdį.

Jis, kaip specialistas, gavo užsakymą iš kliento - „The Economist“ laikraščio, kurie savo leidinio dizainą apibūdino kaip „sunkų“ ir sudėtingai įskaitomą. Pirmiausia reikia suprasti, kad laikraščio, taip pat ir tinklapio dizaine informacijos labai daug. Tai dažnai sukelia sunkumų, naudojant tarpus, nes privalu tilpti į apibrėžtą dydį. Todėl norint, kad dizainas būtų „lengvas“, t.y. patogus skaityti, reikia kad viduje ir išorėje būtų pakankamai laisvos vietos: kūrėjai turi manipuliuoti tarpo ir tuščių plotų dydžių nustatymais. Taigi, Erik Spiekermann, pertvarkydamas žinomo laikraščio dizainą pataisė nedaug: įdėjo daugiau baltos erdvės kiekvienam rašto simboliui, nežymiai sumažino šriftą, taip pasiekdamas geresnį matomumą (3 pav.). Visi šie pakeitimai dizainui pridėjo mažų(micro) tarpų. Rezultatas stulbinamas: laikraščio tekstai tapo lengviau įskaitomi, o bendras dizainas tapo šviesesnis, nors leidinio turinys, t.y. formatas, nepadidėjo. Laikraščiui „The Economist“ jis taip pat pridėjo ir didelių(macro) tarpų ir spalvų. Šis sėkmingai atliktas ir gerai įvertintas darbas parodo, kokį poveikį dizaino efektyvumui gali turėti maži(micro) tarpai esantys tarp mažųjų elementų (žodžių, raidžių ir t.t).

Micro tarpais papildyti simboliai

3 pav. Kiekvienam rašto simboliui pridėta daugiau baltos erdvės: mažų(micro) tarpų.
(Pradinis šriftas - „Economist 101“, o tipografo patobulintas - „Ecotype“ )

Prekinio ženklo pozicionavimas(positioning)

Dizaineriai naudoja baltus plotus, norėdami sukurti rafinuotumo ir elegantiškumo pojūtį aukštesnės klasės prekės ženklams. Prabangių parduotuvių pavadinimuose ir vitrinose pastebima, kad tipografija kartu su fotografija yra „jautriai“ naudojamos. Garsiausi kosmetikos produktų prekių ženklai naudoja baltus tarpus, siekdami pasakyti klientams, kad jų produktai rafinuoti, aukštos kokybės ir dažniausiai brangūs(4.1 pav).

Gucci reklama Barbara reklama Givenchy reklama

4.1 pav. Kosmetikos prekių ženklai naudoja baltus tarpus, siekdami pasakyti klientams, kad jų produktai rafinuoti, aukštos kokybės ir dažniausiai brangūs

Priešingai elgiasi pigius produktus siūlančios kompanijos: vidutinės kokybės prekei, kuri turi reprezentuoti pigumą ir masinio skonio atitikimą, „brangus“ įvaizdis yra nepageidaujamas, nes netenkina tikslinės pirkėjų grupės lūkesčių(4.2 pav).

Gucci reklama Barbara reklama

4.2 pav. Reklama reprezentuojanti pigumą ir masinį skonį

Panagrinėsime pavyzdį (4.3 pav.), kur dvejuose dizainuose turinys ir nuotrauka yra tokie patys, tačiau pasiektas rezultatas skirtingas. Pirmame paveikslėlyje panaudota mažiau baltų tarpų ir tai sukuria pigumo iliuziją, antrame priešingai - jaučiama prabanga, nes daugiau. Taigi, kur mažiau batų tarpų – „pigu“, daugiau – „prabangu“. Į prekės ženklo pozicionavimą – jausmo kūrimą - įeina kur kas daugiau, nei tarpų panaudojimas, bet tai yra svarbiausia dalis, kurios tikisi užsakovai ir jo tikslinė rinka.

Pigi, prabangi reklama

4.3 pav. Dešinėje - „pigiai“, kairėje - „parbangiai“ atrodanti reklama

Aktyvus(active) ir pasyvus(passive) tarpai

Balti tarpai yra naudojami sukurti subalansuotą ir harmoningą išdėstymą (layout), tam kad sukeltų „gerą“ jausmą. Tai irgi gali įtraukti skaitytoją į kelionę dizainu, taip kaip fotografas palieka "vietą žiūrėjimui" portretinėje nuotraukoje, pastatydamas subjektą ne kadro centre ir liepdamas žiūrėt į likusią erdvę. Tarpai, kurie naudojami skaitytojo dėmesio valdymui, kad šis eitų nuo vieno elemento prie kito, vadinami aktyviais(active) tarpais.

Pateikiamas pavyzdys, kuriame pradinis tekstas be tarpų bus modifikuotas (5 pav.) į tekstą su aktyviais tarpais (7 pav.):

Macro tarpai

5 pav. Pradinis tekstas be jokių tarpų

Tekstas yra „sunkiai“ įskaitomas, todėl norint sukurti harmoningą ir vizualiai patogų dizainą, reikia pridėti baltų tarpų. Naudodamiesi CSS(angl. Cascading Style Sheets), atliksime tokius pakeitimus:

  • Pridėsime karštines(margins);
  • Pakeisime šrifto šeimą(type family);
  • Keisime šrifto svorį(weight);
  • Padidinsime linijos aukštį(line-height).

Šios modifikacijos tekstui pridėjo pasyvių(passive) tarpų.

Macro tarpai

6 pav. Tekstas pridėjus pasyvius(passive) tarpus

Galvojate kad pasyvūs tarpai yra neapgalvotas vidinės erdvės panaudojimas kompozicijoje ?

Klystate, nes būtent jie suteikia pastraipai balansą ir erdvę kvėpavimui.

Toliau atliekame teksto keitimus.

Viduje yra tai, į ką norime, kad skaitytojas atkreiptų dėmesį (antra citata - „They heven‘t played anywhere near as well as they‘d liked but we haven‘t given them the opportunity to.“). Pabrėžti šį elementą galima panaudojus skirtingą spalvą arba padidinus šrifto dydį, tačiau šiame pavyzdyje paprasčiausiai pridedame didelių(macro) tarpų aplink elementą, tam kad patrauktume skaitytojo akis, tuomet sumažiname mažus(micro) tarpus šrifto simbolių viduje, naudodami pastorinimą (bold).

Macro tarpai

7 pav.Tekstas pridėjus aktyvius(active) tarpus

Šiai kompozicijai atlikti pakeitimai: buvo pridėti aktyvūs(active) tarpai, kurie labiau pabrėžia arba susistemina informaciją.

Praktika, praktika ir dar kartą praktika

Vienintelis būdas išmokti teisingai naudoti tarpus yra praktika. Grafikos dizaineriai turi vadovautis tokiu pat principu kaip ir kovos menų kovotojai, norėdami išmokti technikos, turi praliesti valandų valandas, tobulindami paprastą judesį.

Keletas garsių tipografų išleido visiems prieinamas knygas apie tipografiją. Vienas tokių - Šveicaras Emil Ruder, kuris po 21 metų tipografijos mokymo, pristatė „Tipografiją: Dizaino vadovą“ („Typography: A Design Manual“), kurioje pareiškė: „Knyga specialiai apribota iki gryno tipografiško apipavidalinimo darbui su iš anksto paruostais šriftais, kurie yra priklausomi nuo tikslių matavimų sistemos. Tikslas - akivaizdžiai parodyti tipografijos taisykles ir, nepaisant tam tikrų bendrų savybių, tai pat pabrėžti kontrastą tarp tipografijos ir grafinio dizaino, kuris ir parinkime, ir pritaikyme yra laisvesnis ir sudėtingesnis“. Jo mokymas pagrįstas juodos ir baltos spalvos naudojimu (black and white), kuriame pabrėžiama tipografija ir raidžių formų dizaino subtilybės. Šioje knygoje parodyti teisingai naudojami elementai ir dažniausiai kompozicijose pasitaikančios klaidos, mokantis pagrindinių principų, taip pat yra pavyzdžių, pratimų ir patarimų.

Reziumė

Sužinoję kaip dizaine galima manipuliuoti erdvėmis viduje, išorėje ir aplink turinį, dabar netiesiogiai galėsime skaitytojui nurodyti, į ką atkreipti dėmesį, kur pradėti skaityti,o produktų reklamas kursime tiksliau atitinkančias tikslinės auditorijos lūkesčius, ir galbūt netgi savo turinį pamatysime naujoje šviesoje.

Pamoka pateikta

Facebook