7 jednoduchých pravidel pro mobilní typografii
Pravděpodobně jste slyšeli, že dobrá typografie je neviditelná, ale je přesnější říkat, že dobrá typografie činí čtení bez námahy.
Když se oko pohybuje po celé řadě textu, dělá to v skokech nazývaných sakády; nečtete dopisy, ani slova, čtete snímky jednotlivých částí slov a váš mozek vyplňuje to, co očekává. Pokud je mozek překvapen, posílá oči zpět, aby zjistil, zda je jeho předpoklad správný. Dobrá typografie minimalizuje práci, kterou mají vaše oči udělat tím, že vytvoří hladký průtok podél linie.
Mobilní zařízení mají pro některého typografu vlastní problémy: prostor je omezen a okolní světlo je často špatné. Ale díky jednoduchým úpravám technik, které již používáme pro web, můžeme zlepšit čitelnost mobilních zařízení.
1. Udělejte si prostor
Na rozdíl od obecné víry, typografie se netýká uspořádání malých křiklavých čar na obrazovce; typografie je z velké části o prostoru uvnitř a kolem nich.
Typografie dluží daleko méně k formám sebe sama než k prostoru, který tvoří
Abychom to pochopili, pomáhá pochopit, odkud pocházejí fonty: díra uprostřed 'o' (a 'b', 'c', 'p' atd.) Se nazývá "počítadlo". byly vyřezány z kovu pro použití v originálních tiskařských listech, ty byly vytvořeny kovovým úderníkem, který byl vyřezán a poté veden do talíře. První návrháři typů pracovali s tvary, které by nevytiskly. Typografie dluží daleko méně k formám sebe sama než k prostoru, který tvoří.
Když hovoříme o hierarchii, obvykle to znamená
přes
, a možná i na
. Existuje však další hierarchie, která ovlivňuje tok čáry nebo odstavce, a to je prostorová hierarchie: prostor mezi písmeny je menší než mezera mezi slovy, mezera mezi slovy je menší než mezera mezi řádky a dále.
Pro optimální čitelnost v mobilních zařízeních věnujte zvláštní pozornost prostorové hierarchii, gestaltové seskupení postav do slov, řádků a odstavců je ještě důležitější v přirozeném světle.
2. Získejte opatření
Opatření je délka řádku textu. Nebo přesněji je to ideální délka pro řadu textů, protože je to vzácné, že každý řádek přesně padne.
Obecně přijaté, ideální opatření pro pohodlné čtení je kolem 65 znaků. Fyzická délka opatření závisí na návrhu písma, sledování (viz níže) a přesném textu, který používáte. Prvních 65 znaků tohoto článku, nastavených v PT Serif, je 26,875 cm široké, v Open Sans, 28,4375 em, v Ubuntu, 27,3125; pokud bych přidal kurzívu, malé čepice nebo tucet dalších typografických podrobností, změnil by se další.
Je to vzácné, že 65 znaků se rozšiřuje na okraj prohlížeče, ale u většiny mobilních zařízení přesahuje 65 znaků (pokud je zobrazeno dostatečně velké, aby bylo čitelné) přesahuje hranice prohlížeče. V důsledku toho jste u mobilních zařízení nuceni snížit míru.
Neexistuje běžně přijatá norma pro měření na mobilní obrazovce, nicméně tradičně úzké sloupce textu v novinách nebo časopisech usilují o 39 znaků. Protože toto ideální opatření bylo testováno po staletí, slouží nám pro mobilní typografii.
3. Uvolněte a poté utáhněte vodicí lištu
Vedoucí je mezera mezi čarami a když je nastavena příliš těsně, sakcadní skok z konce jedné řady do začátku dalšího obtížně sledovat. Při nastavení příliš volně se mezery mezi slovy začnou vyrovnávat, čímž se vytvářejí to, co se obvykle nazývají řeky, což přerušuje plynulý tok linky.
l-r: ideální vedení, příliš těsné, příliš volné.
Obvyklý standard pro vedení je okolo 1,4, ale podle mých zkušeností, že je příliš těsný pro obrazovky: jedna z klíčových charakteristik písma, která funguje dobře na obrazovce, jsou velké pulty a velké čítače vyžadují trochu extra vedoucí k zachování prostorové hierarchie .
Vrátit toto pravidlo, kratší opatření vyžaduje méně vedení. Takže i když budete pravděpodobně nastavit, že jste vedli trochu uvolněnější pro styl desktopů, nezapomeňte jej utahovat pro mobilní obrazovky.
4. Najděte sladké místo
Všechna písma mají alespoň jedno sladké místo; kombinaci velikosti, na které se nejlépe reprodukují na obrazovce, a bod, v němž algoritmus prokládání aplikovaný v prohlížeči narušuje návrh písma co nejméně.
Sladká skvrna je obvykle bodem, ve kterém většina úderů odpovídá pixelové mřížce - pixelové písmo, pokud si je pamatujete, pracovalo pouze při rozměru na své milé místo.
Nastavení písma na jeho sladké místo vede k většímu kontrastu. Kontrast je obzvláště důležitý při návrhu pro mobilní zařízení, protože má potenciál rozptýlit oslnění mimo vaší jemně osvětlené přístrojové laboratoře.
Zjistíte, že drobné úpravy vedoucího budou tlačit a vytáhnout linky z celých pixelů. Podle mého názoru kontrastní trumfy vedou k mobilním obrazům, takže pokud budete muset kompromisy vedoucí k udržení čáry na celých obrazových bodech, učiňte to.
Standardním přístupem pro návrháře je položit typ pomocí základní mřížky, ale pro mobilní zařízení musíme místo toho použít výšku x (výška x je doslova výšky malých písmen "x"). Ze studií o čitelnosti víme, že mozog rozpozná špičku slov, nikoliv spodní část, takže abychom dosáhli většího sákávacího toku, musíme zajistit, aby horní část našich znaků byla nejblíže k pixelům.
5. Neztraťte si hadr
Háček je hranou bloku textu. Většina toho, co čtete, je zarovnána doleva (přinejmenším pro latinské jazyky), což má za následek roztrhaný pravý okraj.
Když se vaše oči skáčou z jednoho konce řádku do druhého, mozku je lépe schopen posoudit úhel a vzdálenost dalšího seskoku, jestliže jsou všechny skoky konzistentní - myslet na to, že běží přes krokové kameny, je to hodně rychleji, jestliže jsou rozmístěny důsledně. Z tohoto důvodu by měl být levý okraj vašeho textu plochý, přičemž každý řádek začíná na stejném místě (přesný opak platí pro jazyky, které se čtou zprava doleva).
V důsledku toho byste nikdy neměli zarovnat více než dva nebo tři řádky textu.
Často je text oprávněný, což znamená, že slova na řádku jsou rozmístěna stejně tak, že na obou stranách není žádný hadr. (Domnívám se, že odůvodněný text je módní, protože citlivý design učil návrháře, aby mysleli na bloky.) Odůvodněný text má za následek nekonzistentní mezery a v nejhorších případech vede k pár slov na řádku, která je vážně krutá. Problém s odůvodněným textem je zhoršován kratší mírou, takže odůvodněný text může být v mobilu nečitelný.
l-r: vlevo zarovnaný, zarovnaný uprostřed, odůvodněný.
Pokud je pro vás skutečně důležitá čistota, rozdělte text tak, aby změkčovala hadru, ale nikdy neodůvodněte text na mobilním zařízení.
Ragged right text má další výhodu pro mobilní: text je často čten v rušivých situacích a čtenáři se často dívají pryč od textu - zkontrolovat název stanice nebo přijmout hovor. Háček vytváří náhodný tvar v pravém sloupci, který pomáhá oko přemístit svou poslední pozici s minimálním přečtením.
6. Zmenšete kontrast
Zatímco chceme podpořit kontrast mezi textem a pozadím, chceme jej omezit mezi různými úrovněmi typu.
Na mobilních zařízeních je viditelný výrazně méně textu, takže je kontrast přehnaný
Důvodem je, že naše mozky posuzují význam založený na kontextu. Vaše nadpisy mohou být na ploše dvě nebo dokonce tři, a to na ploše, a to funguje, protože na obrazovce je více textů. Na mobilních zařízeních je viditelný výrazně méně textu, takže je kontrast přehnaný.
Většina návrhářů používá sekvenci Fibonacci jakéhokoli druhu k velikosti textu. U mobilních zařízení utáhněte poměry nahoru, abyste snížili kontrast velikostí typů. Například pokud používáte zlatý poměr ke zvýšení velikosti, kterou vynásobíte číslem 1,618. Pro mobilní zařízení použijte menší poměr a násobte tím, že místo toho použijete 1,382.
Stolní obrazovky tolerují extrémnější typografické váhy než mobilní obrazovky.
7. Upravte sledování podle měřítka
Když upravíme velikost písma pro mobilní zařízení, musíme si být vědom potřebných změn sledování.
(Kerning je rozestup dvou párů písmen tak, aby mezi nimi byl prostor opticky konzistentní s prostorem mezi ostatními znaky.) Kerning byl přidán do písma, když byl postaven , a to pravděpodobně trvalo měsíce. Pokud jste vybrali profesionálně postavené písmo, bylo to provedeno správně a pokud se domníváte, že to nebylo provedeno správně, najděte jiné písmo.)
Sledování není kerning. Sledování je rozteč písmen aplikovaná na všechny znaky písma. Obvykle byste také neměli měnit sledování.
Výjimky z tohoto pravidla platí pro velký text, například nadpisy a malý text, například poznámky pod čarou. Větší text vyžaduje méně sledování a menší text vyžaduje více sledování. První je kvůli seskupení a druhé je prospěšné kontrastu. Pokud jste provedli změny v záhlavích, nebo pokud používáte typ písma zobrazování, který má obvykle přísnější sledování, možná budete muset trochu uvolnit sledování, jakmile jej změníte.
souhrn
Typografie je řemeslo, které návrháři stráví celoživotní honování, přesně proto, že každý text, každý typ písma a každá technologie přináší nové výzvy. Neexistují žádná tvrdá a rychlá pravidla, která budou vždy fungovat v každé dané situaci.
Když usilujete o čitelnost, je třeba mít na paměti tři principy: plynulý průtok po liniích, jasnou hierarchii prostorů a dostatečný kontrast. To platí zejména pro mobilní web.
Neexistuje žádné pravidlo, které nemůže být zrušeno na důkaz vašich vlastních očí, ale pokyny zde budou sloužit jako ideální výchozí bod pro krásně rozložený text na mobilních zařízeních.