Текстът в интернет
- 8.11.2001
В тази глава ще разгледам:
Характеристики на шрифта
Терминология
Семейство — съвкупност от шрифтове, обединени под общи признаци (font-family);
Начертание — комплект символи от дадена гарнитура, които се различават по цветова наситеност, пропорции, контраст и наклон (typeface);
Тежест — определя се от дебелината на основните и съединителни контури в различни начертания;
Пропорции — показател за промяна на ширината;
Контраст — отношение на дебелината на съединителните контури към дебелината на основните контури.
Класификация
Всички шрифтове могат да се класифицират в три основни групи — серифни (serif), несерифни (sans-serif) и шрифтове свободен стил (декоративни, ръкописни и т.н.).
Удобство на четене
За по-кратко ще използвам израза удобочетимост, под който ще разбирам — удобство, комфорт на четене. То може да зависи от множество различни фактори, като започнем от ширината на буквите и завършим с грамотността на читателя.
Изисквания и фактори за удобочетимост
Качеството на процеса четене може да бъде разгледано от две страни — скорост и удобство. Второто е по-важно при четене на дълъг текст. За да не го претоварим стилистично, е добре да се ограничим със семейство шрифтове (най-вече с техните начертания).
Скоростта зависи от анатомията на буквите. Шрифтът написан с главни букви се чете 12 пъти по-бавно от шрифта написан с малки букви. Курсивният шрифт се чете също толкова добре както нормалния, но само в среден по дължина текст.
Буквите трябва да са достатъчно контрастни и тъмни на бял или слабо наситен сив фон. Всички други варианти от гледна точка на удобочетимостта са губещи.
Големината на шрифта (кегел) зависи от типа на текста. Най-разпространен е вариантът 12—14px. Дребният текст (9—10px) ще бъде прочетен тогава, когато не е обемист и се намира във фокуса на вниманието.
Пробели (бели полета)
Ще изясня общите изисквания:
-
Абзац (Paragraph)
определя темпа на четене. Разстоянието, което отделя абзаците един от друг, по подразбиране е 1em (16px). Увеличаването на това разстояние създава впечатление, че абзацът е самостоятелна единица;
p {margin:1em} -
Отстъп (Text Indent)
разстоянието в началото на първия ред в абзаца;
text-indent {} -
Междуредов пробел (Leading)
разстоянието между базовите линии в два съседни реда. Междуредовото разстояние е приблизително 120% от използвания кегел на шрифта. Заглавията и дребния текст се четат по-добре ако leading-ът е около 100—110%;
line-height {} -
Tracking & Kerning
тези функции определят разстоянията между думите и буквите. Малкият кернинг е подходящ за заглавия, той придава сбит вид на текста, което помага за неговото възприемане като едно цяло.
letter-spacing {} word-spacing {}
Подравняване
Както знаем от любимия MS Word, съществуват четири вида подравняване на текста: ляво, дясно, централно и двустранно.
-
Ляво подравняване
подравняването в ляво е най-актуално, тъй като процеса на четене се осъществява отляво надясно. Поради отсъствието на сричкопренасяне, от дясната страна се образуват твърде назъбени краища; -
Дясно подравняване
това подравняване има по-скоро ефект при заглавия, бележки и т.н., но в никакъв случай като основен текст; -
Централно подравняване
преди време беше актуално заглавията да се центрират, но сега, като че ли това излезе от мода. Използването му като основен текст разрушава визуалната тежест; -
Двустранно подравняване
при обемист текст, двустранното подравняване е най-удачно, стига ширината на колоната да не е прекалено тясна, за да не остават зеещи дупки.
Текстът като част от web дизайна
Основни знания за шрифтовете в интернет
За по-голяма яснота, най-напред ще отделя стандартните разбирания за функциите на шрифта използвани в интернет от тези в предпечата:
-
Размер (кегел)
приблизителната разделителна способност на един 17" монитор при резолюция 1024—768px е 96dpi. В офсетовия печат стандартната разделителна способност е 2400dpi. Измервателната единица е пункт (1pt = 0,352mm). При компютрите пикселът е най-малкият размер, който може да бъде изобразен на екрана. В интернет приложенията се препоръчва кегелът да се задава в проценти:16px = 12pt = 100% -
Семейство шрифтове (font family)
Типографското разнообразие в интернет не е голямо. То се ограничава с наличието на разпространените стандартни шрифтове. Благодарение на политиката на Microsoft®, съществува неголям набор от TrueType шрифтове, наречени Core Fonts for Web, които са безплатни и са достъпни за масовата интернет аудитория. Това са:
Те са оптимизирани за нискоекранна резолюция и са предназначени специално за използване в WEB. Освен тях популярни са:
Кръгът се стеснява, ако разгледаме само кирилизираните шрифтове. Макар малко на брой, те са напълно достатъчни за постигане на добри резултати.
Какво може и какво не шрифтът в web
Поради ниската си екранна резолюция, мониторът не е в състояние да изобразява твърде малки детайли. Ако на хартия може да се напечата текст от порядъка на 1—2pt, то на един стандартен дисплей минимумът е 7—8pt.
За четлив се смята шрифтът, не по-малък от 9px (минимум), в най-добрия случай той трябва да е несерифен, поради отсъствието на допълнителни елементи (засечки).
Шрифтовете с кегел над 17px (удебелени — наклонени) използват функцията Anti-Alias за заглаждане на контурите (italic, bold). Шрифтът ще изгуби уникалността на начертанията си, ако намалим кегела под допустимия размер на мащабиране.
Можем да използваме максимално гъвкаво CSS за да нагласиме текста както ни хрумне, но с оглед на това, че старите браузъри няма да покажат това, което сме имали предвид.
В сравнение със списанията, които използват множество цветови съчетания между текст и фон, компютрите са много по-напред със своите True Colors (24bit). В най-добрия случай три-четири цвята са напълно достатъчни за различните елементи в една web страница.
Естетика и още нещо
За да изглежда един сайт пълноценно, далеч не е необходим цял арсенал от шрифтове. В идеалния случай са нужни не повече от два — един серифен и един несерифен. Как да се използват те, е въпрос на лични предпочитания.
Строго погледнато, несерифните шрифтове са по-удачни за заглавия, където отсъствието на засечки дава възможност думите да бъдат възприети като едно цяло. Текстът с малък кегел трябва да е минимален по обем, той ще се възприема по-лесно и ненатрапчиво, ако контрастът му спрямо фона бъде леко омекотен.
Серифните шрифтове, за разлика от несерифните, трябва да се използват предимно при текст с голям обем. Тексът, написан със серифен шрифт, се чете по-бързо, поради спецификата му. Засечките допринасят за визуалното възприемане на дълги пасажи. Читателят не чете всяка дума поотделно, а минава с поглед върху редовете и абзаците, тъй като на подсъзнателно ниво се съхранява информация за специфичния рисунък на буквите.
Начертанията също трябва да се прилагат предвидливо. Серифните шрифтове изглеждат добре в курсивно начертание, което подсилва изразителността им. Несерифните шрифтове вървят ръка за ръка с удебелено начертание, поради отсъствието на засечки, което ги прави още по-естествени.
Текстови блокове
Ширината на текстовите блокове има голямо значение, както за дизайна на сайта, така и за удобството на читателя. Тя е свързана с движението на погледа при четене, който се движи от единия до другия край на всеки абзац.
Текстът се възприема най-добре, когато не надвишава 60—90 символа на ред. Могат да се използват няколко варианта: задаване на оптимален стационарен размер на текстовия блок или задаване на процентно отношение, което да е с възможност за увеличаване или намаляване до определен минимален размер. Вариантът, в който е включено използването на хоризонталния scroll, не е за предпочитане.
Има и други варианти. Можем да използваме колони (но не повече от три) с фиксиран или динамично променящ се размер или да ограничим една — две от тях до 20—30 символа на ред, ако текстът е предназначен за бърз преглед (новини, коментари, бележки и др.).
Проблемът при дългия по обем текст е, че се увеличава вертикалната дължина на страницата, което е свързано с две ограничения: (1) Превъртане на вертикалния scroll; (2) превишаване на оптималния размер на страницата 30KB. Има един изход — разпределяне на съдържанието в отделни страници. Това решение не е идеално, защото откъсва читателя от основната тема, като изисква от него допълнителни действия. Неудобство в случая е и изчакването на повторно зареждане на съдържанието.
Гъвкавост
Основните критерии за гъвкавост са свързани с намаляване и увеличаване кегела на шрифта и броя на символите в един ред. Първият случай е задължителен, за да могат читателите да имат по-голям контрол над размера на текста. Вторият случай е оптималното решение, което позволява увеличаването или намаляването ширината на текстовите полета.
Шрифт и графика
Заглавията и навигацията, които са приоритет на текста, са почти напълно отнети от графиката.
В много случаи използването на стандартни шрифтове не може да задоволи изискванията към дизайна, що се касае до изписването на къси фрази или заглавия, които да изглеждат както е преценил авторът:
Това е работилницата на Евгени Динев (шрифт Verdana 10px)
(графика)
Текстът и графиките могат да бъдат съчетани заедно:
Предимството на графиката в този случай е, че лесно може да се постигне желания резултат, докато при използването на стандартни шрифтове не винаги може да ни се удаде това.
Забележете, че ако се опитате да създадете прекалено малък шрифт, не винаги ще получите желания резултат:
От примера се разбира следното — шрифт 1 е нарисуван, шрифт 2 е Lozen с изключен Anti-Alias, шрифт 3 също е Lozen, но с включен Anti-Alias.
Ясно е, че за да бъде четим дребения шрифт е по-добре той да се нарисува на ръка. Разликата се състои в това, че конструкцията на TrueType и PostScript шрифтовете е векторна, което значи, че те могат да бъдат мащабирани в големи граници, като запазват максимално идентичността си, а стандартния екран, който е с резолюция 72dpi не може да отрази точно прекалено малките мащаби.
Забележете, че качествените списания използват резолюция над 2400dpi, където е възможно използването дори на микроскопични шрифтове.
