Размер текста имеет значение для оптимального восприятия информации посетителем. Многообразие браузеров и устройств отображения веб-ресурсов предъявляют требование адаптивной верстки. Идеи дизайнера могут апеллировать к трансформации текста для удобства его размещения или прочтения.
Во всех практических ситуациях, размещение текста на HTML-странице, его ориентация, трансформация, выбор шрифта и размеры играют важную роль для внешнего вида страницы, комфорта посетителя и рейтинга сайта.
Базовые правила CSS для текста
Основные теги HTML, в которых размещается текст: div и span. Эти элементы - основные, но не единственные кирпичики, из которых строится веб-страница. Можно указать размер текста в HTML и CSS. В первом случае используется атрибут тега style, во втором случае - правило стиля.
Размер текста задается через выбор шрифта и его размера. Кроме того, используются шрифты с различными размерами букв и строго пропорциональные шрифты, в которых, например, буква i занимает столько же места, сколько буква Ш.
Пример обычных правил:
- font-size: 14px;
- font-family: Arial.
Эти описания определяют через атрибут style тега или CSS: размер текста 14 пикселей, имя шрифта Arial. Такой вариант описания не привязывает элемент к родительскому, окну браузера или смежным элементам.
Простое описание каждого текстового элемента удобно, но занимает много места. Не всегда удобно использовать наследование описаний, но выделять общие правила и уточнять особенности каждого элемента - это классический, практичный и компактный стиль.
Использование значений таких правил через: %, em или rem и позволяет определять размер через изменение размера текста CSS - правила родительского элемента.
Стандарт CSS предлагает также ключевые слова: xx-small, x-small, small, medium, large, x-large и xx-large. Однако, разработчики чаще применяют удобное описание CSS: размер текста - это пиксель (px).
Трансформация текста
Правила CSS - не догма и не руководство к действию. Как ими манипулировать определяет разработчик. Большое значение здесь имеет опыт. Знания и умения, накопленные с течением времени, позволяют быстро и эффективно решать неординарные задачи.
Обычно размещение текста - забота координатора проекта, дизайнера, но не разработчика. Координатор и дизайнер могут не знать, что такое CSS и размер текста в практике кодирования.
Выбор разработчика определяет возможности по созданию нужного сайта, формированию нужного дизайна. Разработчик - это качество результата и время выполнения работы.
Возможности HTML и CSS
Динамика развития гипертекста - медленный и очень инерционный процесс. Практика создания сайтов - это значительно более высокая динамика. HTML5 и CSS3 - это масса новых возможностей, но иной разработчик может создать идеальную конструкцию правил и тегов по собственному опыту, без использования новых возможностей, и обеспечить идеальную работу веб-страницы в любых браузерах, на любых устройствах.
Браузер - это DOM (дерево объектов страницы) и язык программирования JavaScript. Создание современного сайта - это оптимальное сочетание HTML, CSS и JavaScript.
Идея просто использовать стандартные правила и решать только с их помощью, как изменить размер текста в CSS и его размещение средствами HTML, уже давно в прошлом. Интернет-программирование - это не инерционные стандарты гипертекста, это стремительное движение вперед. Важно накапливать опыт применения правил, создавать оптимальные знания и умения.
Порой тратить время на изучение новых возможностей HTML и CSS полезно, но еще более полезно переносить эти новые возможности на привычные «старые» конструкции. Это необходимо не столько на реальной практике, сколько нужно разработчику для создания опыта, который понадобится в будущем.
Тренировка ума - хорошая идея. Качественно разместить текст - это задача далеко не HTML и CSS. Это, прежде всего, содержание текста, его корректная формулировка, его фактический размер, распределение смысла и только затем - серия правил, которая идеально представит нужный смысл в нужном месте страницы посетителю.
Концентрация и формирование смысла
Никогда не было и никогда не будет объективных причин решать задачу так, как ее определил руководитель проекта, заказчик или иное лицо, управляющее работой разработчика.
Более того, координатору проекта, как и разработчику, следует понимать: правила CSS и размер текста - это совершенно разные понятия. Первое - это конструкция, в которую что-то как-то можно поместить. Второе - это динамика: до прихода посетителя (перемещения мышки) это один текст, одно содержание. В момент актуализации в нужном месте окна браузера должно появиться совсем другое содержание, совсем иной текст.
Если сознательно разделить нужные правила CSS, а размеры текста определить по моментам востребованности последнего, то сайт оживляется и дизайн приобретает динамичный стиль.
Открылась страница - посетитель увидел концентрацию смысла по категориям. Посетитель обратил внимание на определенное место веб-страницы, и она ответила взаимностью: раскрыла конкретный смысл актуализированной категории.
Живой сайт и динамичный смысл, чего больше желать посетителю? Разве что уважения к разработчику.
