На главную

Библиотека Интернет Индустрии I2R.ru

Rambler's Top100

Малобюджетные сайты...

Продвижение веб-сайта...

Контент и авторское право...

Забобрить эту страницу! Забобрить! Блог Библиотека Сайтостроительства на toodoo
  Поиск:   
Рассылки для занятых...»
I2R » Сайтостроительство » CSS

Вопросы применения разных шрифтов в CSS

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

Указывая несколько разных шрифтов "на выбор", мы расчитываем, что броузер применит первый найденный шрифт из указанных нами. А вот что мы можем получить на практике... Это уже интересно... Мы не знаем, какой шрифт будет на компьютере посетителя, мы не знаем, на что наткнемся — на Виндоус, Мак или на что-то еще. А на разных платформах установленны разные системные шрифты, кроме того, пользователь может сам изменить настройки и "вычистить" некоторые шрифты.

В подобных случаях, как я заметил, большинство веб-дизайнеров и веб-мастеров старается применять шрифты из стандартного набора Офиса, но откуда такая уверенность в наличии Офиса на всех компьютерах? Мне, например, он вообще не нужен, и поставил я его только по крайней нужде, шрифты все давно уже используются "приносные". На своей машине я могу прописать все шрифты, которые у меня есть, но у половины посетителей сети их нет! Что они увидят? Да что угодно!

Следующая проблема — наличие "разноязыковых" шрифтов на разных компьютерах. Мы привыкли, что почти все "эксплуататоры" сети в нашей строне пользуются адаптированными Виндусами, "обрусевший" Виндус нам привычен, но если страничка ваша будет просматриваться на европейском, например, компьютере? Как я понимаю, наши соплеменники поставят себе десяток-другой русских шрифтов, но как узнать, каких именно... Вполне возможна ситуация, при которой нужный шрифт будет найден, но будет он не русским. Что мы получим в итоге?

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

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

Примерная схема описания шрифтов.


Первое Указываем семейство шрифтов, используемое на нашей странице или в данном элементе:
  • font-family [Семейства шрифтов]:
    • serif — антиква — шрифт с засечками.
    • sans-serif — гротеск — шрифт без засечек.
    • cursive — курсивы.
    • fantasy — аллегорические.
    • monospace — моноширные.

Второе Вторым этапом нам надо обезопасить себя от вероятности попадания на нежелательный вариант шрифта, например, италик. Для этого имеет смысл явно указать:

  • font-style: normal;

Для большей надежности можно указать и "жирность" шрифта:

  • font-weight: normal;

В основном, все. Осталось только определиться с размерами.

С размерами шрифтов тоже все очень интересно. Самое полезное для пользователей, это указание размеров шрифтов в процентах — можно будет изменять размер шрифта в зависимости от силы зрения. Но! Тут есть интересный момент — мало того, что шрифты выводятся разными броузерами разного размера и у разных броузеров разные "амплитуды" их изменения, тут еще и психология примешанна. Люди так привыкли к фиксированным размерам шрифтов, что во многих случаях даже не пробуют изменить их, заранее уверенные, что ничего хорошего не получится.

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

Подробнее о системных шрифтах:

  • caption шрифт, используемый для заголовков элементов управления
  • icon шрифт, используемый для описания иконок
  • menu шрифт, используемый в меню
  • message-box шрифт, используемый в диалоговых окнах
  • small-caption шрифт, используемый для небольших элементов управления
  • status-bar шрифт, используемый в "статусе" окна

Идея проста — в большинстве случаев человек подстраевает размеры системных шрифтов под свои возможности. При применении подобных шрифтов все сводится к стенографическому описанию:

font: menu например.

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

Вариант указания размера шрифта в пикселях или пунктах хорош тем, что независимо от установок на экран сразу выводится текст предсказуемого размера. Но вот размеры его изменить сложновато... Кстати, "сложновато" только в Эксплорере, если точнее, то в Эксплорере5, в 5.5 не проверял. Броузеры Опера5.02 и Нетскейп6 меняют размер шрифтов независимо от того, в каких единицах указан его размер.

Несколько советов из практики описания шрифтов методами CSS.

Если на всей странице используется только одно семейство шрифтов, то имеет смысл описывать стили шрифтов в процентном отношении от шрифта страницы, с учетом наследования, конечно, описывая только размеры и "жирность", "наклонность". При такой схеме описания стилей текста мы можем задавать семейство и основные описания "стартового" шрифта только в одном месте — в описании BODY. Можно будет и изменить при желании...

Межстрочное расстояние можно указать и для каждого элемента, и для всего текста страницы, в зависимости от потребностей: line-height: 120%;. Для более точного понимания — свойство оговаривает высоту строчного блока, порождаемого текстовым элементом. Описать можно и в процентах и в "em".

Свойство text-indent задает отступ для первой строки текста в блоке, по типу "красной строки". Если вы используете подобный прием, то учтите, что каждый абзац надо "закрывать" закрывающим тэгом параграфа. Отступ можно задать как фиксировано, так и в процентах от ширины блока.

Вот, вроде, и все, что можно применить для простейшего описания текста в CSS.

Алямкин Илья Юрьевич
S.T.Y.L.E.mtk.on.ufanet

Спонсор раздела

Рассылки Subscribe.ru:

Библиотека сайтостроительства - новости, статьи, обзоры
Дискуссионный лист для web-разработчиков
Подписка на MailList.Ru
Автор: NunDesign
Другие разделы
Оптимизация сайтов
Web-студии
» Новое в разделе
Web-дизайн
Web-программирование
Интернет-реклама
Раскрутка сайта
Web-графика
Flash
Adobe Photoshop
Рассылка
Инструменты вебмастера
Контент для сайта
HTML/DHTML
Управление web-проектами
CSS
I2R-Журналы
I2R Business
I2R Web Creation
I2R Computer
рассылки библиотеки +
И2Р Программы
Всё о Windows
Программирование
Софт
Мир Linux
Галерея Попова
Каталог I2R
Партнеры
Amicus Studio
NunDesign
Горящие путевки, идеи путешествийMegaTIS.Ru

2000-2008 г.   
Все авторские права соблюдены.
Rambler's Top100