|
АБРАКАДАБРА (Тоже самое но в читаемом виде)
Bol'6instvo saytov doverxu napolneni melkim tekstom, kotoriy bol'no
4itat'. No za4em? Net pri4ini vjimat' tak mnogo informacii v ekran. Eto
glupaa kollektivnaa o6ibka, kotoraa otnositsa k vremenam kogda ekrani
bili deystvitel'no malen'kimi. Tak 4to…
Ekran i jurnal: 100%-razmer 6rifta — eto ne mnogo. Fotograf: Wilson Miner.
Ne zastavlayte nas izmenat' razmer 6riftaMi ne xotim izmenat' nastroyki brauzera kajdiy raz kogda pose6aem noviy sayt!
Ne govorite 4to perepolnennie sayti vigladat lu46ePerepolnennie
sayti ne vigladat xoro6o: oni vigladat skverno. Zaxlamlenie stranic
vsem podrad nikogda ne ulu46alo uzabiliti. Budu4i lenivimi, vi
zakidivaete nas vsey informaciey bez razbora. Mi je xotim 4tobi vi
podumali i otobrali li6' naibolee vajnoe. Mi ne xotim delat' va6u
rabotu.
Ne govorite 4to prokrutka stranic — eto ploxoPotomu 4to togda
polu4aetsa, vse sayti ploxie. V prokrutke net ni4ego durnogo. Tak je
kak net ni4ego durnogo i v listanii stranic knigi.
Ne govorite 4to tekst nevajen95% veb-dizayna — eto tipografika (eng).
Ne zastavlayte nas nosit' o4kiVmesto etogo, uberite golovu ot monitora, otkin'tes' nazad i prodoljite 4tenie (vidimo, svoego sayta) v rasslablennoy poze.
Pat' prostix pravil
1. Ostav'te razmer 6rifta dla osnovnogo teksta kak est'
Razmer 6rifta kotoriy vi 4itaete sey4as ne est' bol'6oy. Eto tot razmer kotoriy brauzer ispol'zuet po-umol4aniu (imeetsa vvidu sayt avtora, no ved' vrёt, rediska!).
Mi ne xotim najimat' na knopki «bol'6e/men'6e» ili izmenat' nastroyki brauzera. Mi xotim srazu je na4at' 4itat'.
Vna4ale, sozdat' xoro6iy maket s bol'6imi 6riftami bolee slojno, no eti
slojnosti pomogut vam sproektirovat' bolee prostoy i asniy sayt (eng).
Napolnit' sayt ku4ey informaciey neslojno, v otli4ii ot togo kak
sdelat' sayt pro6e v ispol'zovanii. Sperva vi budete 6okirovani,
naskol'ko velik razmer 6rifta, no 4erez den' ne zaxotite videt' dla
osnovnogo tekst razmer men'6iy 4em 100% (ot togo 4to v nastroykax).
Vigladit bol'6evato na perviy vzglad, no posle togo kak vi stanete
ispol'zovat' eto, vi bistro poymёte po4emu sozdateli vsex brauzerov
vibrali takoy razmer 6rifta po umol4aniu.
2. Pustoe prostranstvo — aktivniy element dizayna
Pozvol'te va6emu tekstu di6at'. Ispol'zovanie pustogo prostranstva —
eto ne prixot' otdel'nogo dizaynera i ne imeet otno6enia k 4uvstvu
prekrasnogo (eng).
«6irina kolonki doljna bit' proporcional'na razmeru 6rifta. 4eres4ur 6irokie kolonki utomlaut glaza i e6ё imeut nekotoriy (kakoy je?) neblagopriatniy
psixologi4eskiy effekt. 4eres4ur sjatie toje mogut me6at', potomu 4to
prerivaut process 4tenia i frustriruut 4itatela, zastavlaa glaza
smenat' stroku sli6kom 4asto.»
Josef Muller-Brockmann, Grid Systems
Ispol'zovanie pustogo prostranstva umen'6aet uroven' naprajenia, tak
kak pozvolaet pro6e fokusirovat'sa na glavnom. Vam ne nado zapolnat'
vsё okno brauzera. To 4to pustoe prostanstvo delaet sayt priatnee — ne
slu4ayniy effekt: eto logi4noe sledstvie konstruktivnogo dizayna. Kto
skazal 4to sayti doljni bit' napolneni podzavazku?
Muller-Brockmann: «Vopros o 6irine kolonki — eto vopros ne tol'ko dizayna ili formata sayta; vopros doxod4ivosti ne menee vajen.»
Pojaluysta, ubedites' 4to kolonka ne sli6kom 6iroka i 4to vi dobavili
pustogo mesta sleva i sprava 4tobi glazu pro6e bilo prigat' (s odnoy
4asti stranici nga druguu). Mi (pol'zovateli) ne xotim menat' razmer
6rifta ili okna. Mi xotim srazu na4at' ego 4itat'. Razumnoe
regulirovanie kolonki po 6irine eto slavno; nekon4au6iesa stroki teksta
poperёk ekrana — net.
Korol' uzabiliti, Akob Nil'sen, nedavno dobavil
putogo prostranstva na svoёm sayte i ograni4il maksimal'nuu 6irinu
kontenta (levaa kartinka). V prejney versii (kartinka sprava) stat'a
ras6iralas' na vsё okno. Nemnogo uveli4it' mejstro4noe rasstoanie, i ti
budu6' sover6enen, Akob.
Prostoe pravilo: po 10-15 slov v stroke (eto dla angliyskogo azika; dla russkogo, gde slova v srednem dlinnee, stoit vzat' veli4inu pomen'6e).
Dla rezinovoy vёrstki, pri 100% veli4ini 6rifta, polovina okna dla
osnovnoy kolonki budet xoro6im re6eniem na bol'6instve razre6eniy
ekrana.
3. Pomenayte visotu stroki na udobnuu dla 4tenia
Vot 4to govorat specialisti po 4teniu (imenno tak):
Stroki teksta, raspolojennie sli6kom tesno, uxud6aut
skorost' 4tenia potomu 4to v takom slu4ae sosednie linii s4itivautsa
odnovremenno. Glaz ne mojet fokusirovat'sa na 4rezmerno blizkix strokax
i … 4itatel' tratit energiu v nepravil'nom meste i utomlaetsa bistree.
Vsё to je ostaёtsa pravdoy i dla strok, kotorie sli6kom daleko otstoat
drug ot druga.
Mejstro4noe rasstonie v HTML sli6kom malo po umol4aniu. Esli vi
uveli4ite ego, tekst stanet bolee legko 4itaemim. 140% budet v samiy
raz.
4. Ispol'zuyte kontrastnie cveta
Ob etom daje neobazatel'no govorit'. No esli vi ispol'zuete lubuu iz nijesleduu6ix kombinaciy:
— svetlo-seriy tekst na tёmno-serom fone
— serebraniy tekst na snejno-belom fone
— seriy na jёltom
— jёltiy na krasnom
— zelёniy na krasnom i tak dalee…
… zna4it vi ne veb-dizayner, a vsego-li6' dizayner-samodur (tak a perevёl «with an attitude», spasibo kommentatoram).
Esli vi nastaivaete na bitii svoёm veb-dizaynerom, to doljni znat' 4to
nikto daje ne smojet pro4itat' 4to vi napisali. Prekratite etot absurd
i pozvol'te ludam pro4itat' to 4to vi pi6ete. Zamet'te, dla ekrannogo
dizayna naibolee sil'niy kontrast toje neidealen, tak kak bukvi
na4inaut mercat' (flicker; kajetsa, imeetsa vvidu neravnomernost' otrisovki). Poprobuyte #333 na fone #fff.
5. Net tekstu v izobrajeniax!
Mi xotim iskat' tekst, kopirovat' tekst, soxranat' tekst, igrat'
kursorom i videlat'/pome4at' ego poka 4itaem. Tekst v izobrajeniax
vigladit priatno, no priatnost' — ne to dla 4ego su6estvuet internet (eng).
On su6estvuet dla ob6enia i dostupa k informacii, i etu informaciu
doljno bit' legko 4itat', mas6tabirovat', citirovat', kopirovat' i
peredavat'.
Esli vi ne mojete sdelat' sayt, xoro6o viglada6iy bez teksta obla4ёnnogo v izobrajenia, vi doljni budete na4at' (u4it'sa, 4to li?) s samogo na4ala.
Rasskajite ob etom ludam
Esli vi xotite 4tobi bol'6e saytov stali udobnee dla 4tenia, rasskajite
ob etom manifeste drugim. Postav'te u seba na saytax, v blogax ssilku
na etu stranicu, 4tobi ludi znali kak sdelat' ix sayti 4itabel'nee.
____ ot perevod4ika ____
Firefox 3.0.5 pozvolaet ne zaviset' ot jelaniy dizaynerov, on prozra4no
zapominaet nastroyki zoom dla kajdogo sayta (ran'6e bil nujen addon «No
Squint»).
Rostislav 4ebikin v svoey knige upominaet 4to v CSS razmer 6rifta (kegl') predpo4titel'nee ukazivat' kak font-size: 1em; dla na6ego slu4aa. Standartnie imenovannie obozna4enia (large, medium, small ) i procenti (font-size: 100%; ) ne godatsa potomu 4to v nekotorix slu4aax mogut privesti k razli4nomu otobrajeniu teksta.
Avtoru stat'i, Oliver'u, neploxo bi samomu zadumat'sa nad takimi problemami v readability svoego sayta kak:
a) sil'nie zatrudnenia pri poiske pose6ёnnoy ssilki v tekste (po4ti ne otli4aetsa ot osnovnogo teksta),
b) trudno pro4itat' datu napisania stat'i i kommentariev — ix tam prosto net. /habrahabr.ru/blogs/webdev/48862/#habracut Perevod stat'i Oliver Reichenstein «The 100% Easy-2-Read Standard».
|
|