Отправляет email-рассылки с помощью сервиса Sendsay

Интернет-дизайн и мастеринг - полезные советы

Рассылка закрыта

При закрытии подписчики были переданы в рассылку "Левитас: Почему Ваш бизнес-сайт не работает?" на которую и рекомендуем вам подписаться.

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

←   Апрель 2005   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
Автор
Александр Левитас

Статистика

7.438 подписчиков
+5 за неделю
←   Все выпуски   →

Интернет-дизайн и мастеринг: советы Dia-Studia


Информационный Канал Subscribe.Ru
Статья №3: «Шрифты: что в имени тебе моём?» (19.04.2005) Все свои пожелания, соображения или возражения Вы можете отправлять по адресу dia-studia@yandex.ru Dia
Studia

Сперва сделаю небольшое отступление, касающееся дизайна и, в частности, данных статей. Многие дизайнеры дают различные советы, которые предлагается рассматривать, как аксиомы, не требующие пересмотра или несогласия (к примеру, с теми же фреймами на сайтах: мол, нельзя их размещать... а почему? Страницы индексируются хуже? — так можно указать в теге <!DOCTYPE>, что использованы фреймы, можно указать при регистрации сайта в поисковике, что используются фреймы; а можно (ко всему прочему) правильно организовать страницы, их связь между собой и верную работу в случае открытия субстраницы в отдельном окне браузера!). Итак, уважаемые читатели, прошу вас не воспринимать мои советы за подобные правила, потому что данные статьи призваны помочь вам разобраться со способами создания удобных, привлекательных сайтов, избежать несуразицы и сумбура. А как именно создавать дизайн и верстать — дело полностью ваше!

Разнообразие шрифтов

Сегодня необычными шрифтами мало кого удивишь. Со многими программами в качестве «бонуса» предоставляются наборы шрифтов для вашей коллекции. И дизайнеру порой даже трудно выбрать, какой шрифт подходит для разрабатываемого дизайна лучше... И советовать тут трудно, но...

Правильный выбор шрифта для дизайна не менее важен, чем выбор цвета и расположения элементов в композиции. Если напичкать страницу текстами самых различных шрифтов (да ещё и начертаний), то у посетителя голова закружится. Разобраться в такой каше будет очень трудно. А теперь представьте себе, что пользователь Интернета, который зашёл на подобный сайт, «сидит» на модеме, а не на выделенной линии, к примеру, — т.е. у него счёт идёт не на скачанные единицы информации, а на секунды! И он будет тратить эти драгоценные секунды на осознание того, что и как расположено на странице... Да ему проще закрыть этот сайт и найти другой, попроще. Как видите, здесь задействована не только эстетическая сторона, но и материальная. Ещё раз повторю: уважайте посетителя! И он это обязательно оценит, возвращаясь на ваш сайт снова и снова и советуя его своим знакомым. (Конечно, тут важен не только дизайн, но и содержание сайта, но дизайн играет немаловажную роль!)

На сайтах всегда лучше использовать шрифты, которые установлены у пользователей наверняка (т.е. поставляются с операционной системой). К таким шрифтам относятся Arial, Times New Roman. Ещё часто используют MS Sans Serif, Bookman Old Style, Courier, Tahoma и т.п. Но эти шрифты уже не так «надёжны» в плане наличия их у пользователя на машине. Конечно, в случае отсутствия шрифта, операционная система постарается заменить его на наиболее подходящий, но результат не всегда гарантирован — может получиться полная околесица, если вы используете какой-то особенный шрифт. Перечисленные выше шрифты легко заменятся Arial'ом или Times New Roman'ом — в зависимости от того, какой тип у шрифта (к примеру, с засечками или без (гротеск)). Не забудьте при создании сайта, что установленные на вашей машине шрифты могут отсутствовать у посетителей. И если вы при просмотре страницы видите всё так, как задумали, то посетитель может увидеть результат совершенно иным, если у него ваш шрифт не установлен. Поэтому в простом тексте лучше использовать простые шрифты, а если необходимо выделить что-то, то просто изменить начертание (сделать текст курсивом (italic) или полужирным (bold)) — причём, курсив в тексте будет заметен только при чтении нужной строки, а полужирный шрифт — издалека (эта особенность была прочитана мною у Артемия Лебедева, «Ководство»), что можно использовать в целях акцентирования и привлечения внимания.

А вот «особенные» шрифты лучше использовать в заголовках или в логотипах. Причём, по указанным выше причинам, в виде картинок. При этом не забывайте дублировать надпись на картинке в параметре ALT тега <IMG>, иначе если у посетителя отключена графика, то он не сможет понять, что вы разместили на этой картинке.

Сочетание шрифтов

Шрифты тоже могут сочетаться или не сочетаться между собой. Расскажу свои наблюдения (сочетания шрифтов в заголовке и обычном тексте):

  • если использовать гротесковые шрифты (без засечек) с гротесковыми, то результат будет хорошим;
  • заголовок с засечками, основной шрифт без засечек смотрятся интересно;
  • гротеск и шрифт с засечками тоже сочетаются вполне хорошо;
  • два шрифта с засечками смотрятся неплохо, но уже хуже.

Здесь представлены сочетания по убыванию эффективности. В принципе, любой из этих вариантов может выглядеть превосходно, если всё грамотно расположить и подобрать.

Но важно учесть вот что: основной шрифт не должен быть витиеватым, иначе трудно будет читать; шрифт заголовков или логотипов может быть каким угодно, но он тоже должен легко читаться. Особенно если такой шрифт передаёт название фирмы, то сложность прочтения не прибавит фирме известности.

«Это же мой размерчик!»

Размер (кегль) шрифта тоже нужно подобрать оптимальным, т.е. чтобы посетитель мог его спокойно читать. Можно использовать тег <FONT> для размещения текста, и в его параметре SIZE указывать размер (например, «3» — удобный для прочтения шрифт). Тогда пользователь сможет настроить отображение шрифта (по размеру) самостоятельно, используя настройки браузера (шрифт мелкий, средний, крупный и т.д.).

А можно использовать каскадные таблицы стилей CSS, которые на сегодня получили большую популярность. Здесь вы сможете указать размер шрифта, например, в процентах («%») или логических пунктах («pt»), можете также использовать предопределённые значения (например, «xx-small», «medium» и т.д.) (более подробно читайте в руководствах по CSS). Например:

<font style="font-size:12pt;">Ваш текст</font>

Здесь указан размер в пунктах, такого размера шрифт будет удобно читаться. Но пользователь изменить размер не сможет. Учитывайте это, если будете использовать стили.

И есть ещё некоторая особенность: даже один и тот же указанный размер для разных шрифтов может приводить к разному размеру в реальности. Тут нужно поэкспериментировать. И это ещё одна причина, почему не стоит пользоваться нестандартными шрифтами, которых может не оказаться у пользователя в установленных. При указании в стилях возможных вариантов шрифтов тоже учтите эту особенность:

<font style="font-family:Tahoma,MS Sans Serif,Arial">Ваш текст</font>

В этом примере указаны шрифты через запятую. Зачем? Предполагается, что текст будет отображаться шрифтом Tahoma, но здесь учтено, что такого шрифта у пользователя может не быть. Тогда взамен предлагается использовать шрифт MS Sans Serif. А если нет и его, то будет использован Arial, который обычно есть у каждого. Если же не окажется и Arial'а, то система сама подберёт подходящий (по её мнению) шрифт. Но тут уж ничего поделать нельзя: все возможные шрифты не перечислишь.

Это хорошая практика — указание возможных шрифтов, т.к. дизайнер заранее подбирает те варианты, которые будут выигрышно смотреться на странице. Но тут нужно учесть, что шрифт Tahoma крупнее, чем остальные из указанных. Поэтому не оставляйте варианты без проверки! Всегда проверяйте все исключения — не только в шрифтах, но и во всём остальном.

«Зри в корень!»

Всегда нужно обращать внимание на смысл информации, которую вы собираетесь выкладывать на сайте. И под неё выбирать оформление, в том числе шрифты. К примеру, для серьёзных организаций совершенно не подойдёт шрифт Comic Sans MS — он будет отвлекать посетителя от важности информации, навязывая ему ощущение весёлости и несерьёзности.

Для серьёзных проектов лучше использовать «серьёзные» шрифты. И не нужно сразу пленяться шрифтами с «рюшечками» и прочими излишествами. Главное — понять, какое впечатление этот шрифт будет вызывать у посетителей. Если оно совпадает с тем, чего вы добиваетесь, то вперёд! Если нет, то оставьте шрифт в покое, даже если вам он безумно нравится.

И не бойтесь сделать оформление проще, но понятней. Всё гениальное просто!

В следующих выпусках мы поговорим о расположении меню, информационной части и др. элементов документа на странице.

Выводы по статье
  1. правильный выбор шрифта для дизайна не менее важен, чем выбор цвета и расположения элементов в композиции;
  2. на сайтах всегда лучше использовать шрифты, которые установлены у пользователей наверняка (например, Arial или Times New Roman);
  3. в простом тексте лучше использовать простые шрифты, а если необходимо выделить что-то, то просто измените начертание (курсив или полужирный);
  4. курсив лучше использовать для акцента, а полужирный текст — для фиксации внимания (возможно, даже преждевременной);
  5. основной шрифт не должен быть витиеватым, иначе трудно будет читать; шрифт заголовков или логотипов может быть каким угодно, но он тоже должен легко читаться;
  6. размер шрифта тоже должен быть оптимальным;
  7. всегда проверяйте, что у вас получится в нестандартной ситуации;
  8. оформление сайта выбирайте по смыслу информации на нём.

Всего вам хорошего и успешного творчества!

© Dia-Studia, 19 апреля, 2005 г., dia-studia@yandex.ru, http://www.dia-studia.h14.ru/
При использовании материала для распространения, пожалуйста, указывайте ссылку на автора. Спасибо! ;)

http://subscribe.ru/
http://subscribe.ru/feedback/		 Подписан адрес:
Код этой рассылки: comp.design.diastudia		 Отписаться
В избранное