it-swarm-eu.dev

Ideální šířka sloupce pro odstavce online

Není nic horšího, než narazit na web s odstavci, které pokrývají šířku rozlišení obrazovky. Obvykle jsou tak obtížně čitelné, ani se neobtěžuji.

Mnoho webových designérů používá obecné mřížkové a sloupcové systémy, ale nemyslím si, že by byly optimalizovány pro čitelnost, jsou spíše průvodcem designem v obecné estetice.

Myslím, že to jde až na slova na řádek. Existují pravidla pro tisková média stejná pro obrazovková média?

Existují nějaké pokyny, které by mi pomohly změnit šířku odstavců na obrazovce?

Chci vzít v úvahu:

  • Hlavní tváře webových fontů (tj. Arial, Verdana, Georgia, Times)
  • Velikost písma rozsahu (tj. 8px-24px)
  • Mezera mezi sloupci
102
theorise

Ideální délka čáry je přiměřeně krátká nebo přiměřeně dlouhá; to, co je obecně esteticky příjemné číst, je obecně dobrý údaj.

Sloupce ve webovém kontextu mají smysl, pouze pokud jste se zaměřili na velmi kompaktní obsah; který překonává účel použití sloupců nad zkrášlení. Důvod, proč jinak nedávají smysl, není proto, že jsou špatně podporováni, ale kvůli posouvání; pokud neprovedete vodorovné rozložení se sloupci, může to vést k tomu, že se uživatelé posouvají nahoru a dolů. Kromě dvou sloupců také vidím cokoli matoucí, protože to zatěžuje paměť uživatelů, když čtou malou pauzu - zvažte, jak sloupce přidávají druhou osu.


Příliš dlouhá - je-li řádek textu příliš dlouhý, oko návštěvníka se bude těžko zaměřovat na text. Důvodem je, že délka ztěžuje získání představy o tom, kde se čára začíná a končí. Dále může být obtížné pokračovat ze správného řádku ve velkých blocích textu. - Christian Holst

Příliš krátká - pokud je čára příliš krátká, oko se bude muset příliš často vrátit zpět, čímž se zlomí rytmus čtenáře. Příliš krátké řádky také mají tendenci stresovat lidi a nutí je začít na dalším řádku před dokončením aktuálního (přeskočení potenciálně důležitých slov). - Christian Holst

Navíc si můžete být vědomi velikosti vašeho obsahu. Pro delší obsah preferujte delší řádky; s krátkým obsahem preferují kratší řádky. Velikost odstavců a sekcí v obsahu se obvykle mění jako proměnná podle toho, jak dlouhý by měl být řádek - nechcete jednořádkové odstavce, ale stejně nechcete třicetřádkové odstavce. Vyberte si šťastný průměr, který usnadňuje vizualizaci obsahu.

Obecná pravidla palce

Vezměte je se zrnem soli, jsou to pouze pokyny; klidně je rozbijte. Opakuji, že to nejsou „jedno pravidlo pro všechny“, které musíte přijmout; jen Push/Stopa správným směrem.

  • 12 slov na řádek
  • 39 znaků bez ohledu na velikost typu (abeceda a půl)
  • vynásobte velikost bodu 2 a interpretujte jej jako picas (points-times-two)
  • přibližně 50–60 až nejvýše 75 znaků (včetně mezer) - toto je obvykle směrnice půjčená od našich přátel v typografii

„Prvky typografického stylu“ od Roberta Bringhursta zmiňuje následující konkrétnější měření

  • Délka řádku 45 až 75 znaků (míra); konkrétně 66 včetně mezer; Jeden sloupec
  • 40 až 50 znaků; více sloupců
  • 85 až 90 znaků; diskontinuální text; velkorysé vedení
  • Minimálně 40 znaků; oprávněné
  • 12 až 15 znaků; okrajové poznámky; Angličtina

Proměnné čitelnosti:

  • velikost písma
    • větší = Zkusil jsem to, (někteří) lidé to považují za nepříjemné. Zaměřte se jen na šťastnou „střední velikost“
    • střední/standardní = větší šířka
    • menší = menší šířka
  • výška řádku
    • velké (1.9+) = snazší skenování řádků, delší řádky jsou přijatelnější
    • normální = kratší řádky
    • menší = velmi krátké řádky
  • délka obsahu
    • big blob = dlouhé řádky + velká výška řádků
    • krátká zpráva = krátké řádky + přiměřená výška řádku

Dokud budete věrni „použitelnosti zdravého rozumu“, žádné nastavení nebude samo o sobě špatné. Na rozdíl od většiny designových aspektů si to můžete také vyzkoušet sami, jednoduše do prvku vložit nějaký čitelný obsah (ne nutně to, co se tam má, a pokud možno čerstvé), a zjistit, zda jej můžete pohodlně přečíst. Pokud můžete, skvělé; jinak jej upravte, dokud nastavení neodpovídá vašemu obsahu (vyzkoušejte jej pomocí několika písem, nejen vašeho hlavního).

92
srcspider

Podívejte se také na tento odkaz: http://www.informationarchitects.jp/en/100e2r/ .

Navrhování ohnuté s tváří přilepenou k obrazovce je pro vaše záda špatné; zkuste se opřít a pokračovat v navrhování v uvolněné poloze. Vaše návrhy budou uvolněnější a stejně tak i vy.

Chcete-li si uvědomit, jak malý je text na mnoha webech, porovnejte knihu, kterou si pohodlně přečtete, a poté změňte velikost písma, dokud typ v knize a na obrazovce nebude přibližně stejný:

Výchozí výška řádku HTML je příliš malá. Pokud zvětšete výšku řádku, text bude čitelnější. Pro typ na obrazovce je dobrým měřítkem 140% vedoucí pozice.

Navrhují mít 100% velikost písma (výchozí prohlížeč), 10–15 slov na řádek (obvykle 50% okna prohlížeče s výchozím písmem), 140% výšku řádku - což pro mě zní docela rozumně.

8
Nikita Prokopov