Дмитрий Кирсанов - Веб-дизайн
- Название:Веб-дизайн
- Автор:
- Жанр:
- Издательство:Символ-Плюс
- Год:2006
- ISBN:5-93286-003-0
- Рейтинг:
- Избранное:Добавить в избранное
-
Отзывы:
-
Ваша оценка:
Дмитрий Кирсанов - Веб-дизайн краткое содержание
Книга автора бестселлера `Факс-модем: от покупки и подключения до выхода в Интернет` — Дмитрия Кирсанова — первый полный курс веб-дизайна на русском языке, написанный профессиональным дизайнером. От теоретических основ визуального дизайна до интернетовских технологий и приемов практической работы над сайтом — все это есть в книге, написанной понятно, подробно и увлекательно. Издание будет полезно не только начинающим создателям сайтов, но и дизайнерам, работающим в более традиционных областях, специалистам по рекламе и маркетингу, художникам, программистам, — и, конечно же, всем творческим и любознательным людям.
Веб-дизайн - читать онлайн бесплатно ознакомительный отрывок
Интервал:
Закладка:
Если на странице используется фоновое изображение, указываемый в теге BODY цвет фона должен соответствовать цвету «среднестатистического» пиксела фонового изображения. Только при этом условии пользователи, отключившие загрузку графики, не будут испытывать затруднений с чтением текста, а те, у кого фоновое изображение еще не докачалось, не будут шокированы резким перескоком цветов в тот момент, когда фон внезапно подстилается под уже видимые элементы переднего плана.
Цвета, указываемые в атрибуте color тега FONT, перекрывают как цвет из атрибута text тега BODY, так и цветовые установки броузера. Можно даже менять цвет ссылок, вставив тег FONT с атрибутом color внутрь тега A. CSS, в свою очередь, позволяет менять не только цвет букв, но и фоновый цвет любого элемента, в том числе и фоновый цвет отдельных символов и фрагментов текста. Если часть текста закрашена одним цветом, а часть другим (что обычно бывает, когда фон состоит из сильно различающихся по цвету областей — например, светлой центральной части и темной полосы вдоль границы экрана), фоновый цвет в теге BODY должен быть таким, чтобы на нем были легко различимы оба цвета текста.
Как и цвета в графических вставках, указываемые в HTML цвета текста, фона страницы и фона ячеек таблиц подвергаются искажениям на 256-цветных мониторах. Однако ничего похожего на «безопасную палитру» (стр. 246) для этих HTML-цветов, к сожалению, не предусмотрено: броузер просто сводит эти цвета к ближайшим цветам текущей палитры экрана, что может давать самые непредсказуемые результаты (например, указанный в теге BODY фоновый цвет может далеко разойтись с тем же самым цветом, использованным в изображении).
Выбрав для текста чисто белый текст на небелом фоне, имейте в виду, что броузер не станет воспроизводить фоновый цвет при печати страницы на принтере. MS1E поступит при этом вполне разумно, самостоятельно заменив перед посылкой на печать цвет текста на черный, но в броузере Netscape для этого нужно будет установить (по умолчанию сброшенный) флажок Black Text в настройках печати (точнее, вам как автору страницы нужно будет напомнить сделать это вашему читателю), — иначе из принтера вылезет белый лист без каких–либо следов текста страницы. Об этом нужно помнить при выборе цветовой схемы для страниц, которые пользователь с большой вероятностью захочет распечатать (счетов, инструкций и т. п.).
ССЫЛКИ
Гипертекстовые ссылки — элемент, не имеющий прямых аналогов в других жанрах дизайна и требующий поэтому особого внимания создателя сайта. Так же как плотность размещения и тщательная взаимная подгонка графических элементов есть признак хорошего качества визуального дизайна (стр. 84), о качестве подготовки текста на веб–сайте можно довольно быстро составить впечатление по тому, насколько этот текст насыщен ссылками. Если в этой книге мое стремление отследить все связи глав и разделов сдерживалось нежеланием загромождать текст бесконечными «стр. такая–то», то на веб–сайте можно дать себе полную волю — ведь гипертекстовые ссылки почти не мешают чтению.
С другой стороны, разумеется, добавление ссылки не может пройти бесследно для звучания, интонации и, в каком–то отношении, даже для смысла фразы. Если считать ссылку разновидностью текстового выделения, то можно сформулировать несколько практических советов. Прежде всего, точно так же как курсивом не стоит выделять целое предложение, длину ссылки нужно ограничивать необходимым минимумом — например, ссылкой на архив с программой достаточно сделать ее название или слово «download», а не всю фразу целиком. Ссылочным лучше всего делать то слово или словосочетание, которое допускает, с учетом смысла всего предложения, произнесение с логическим ударением (эмфазисом), пусть и не сильно выраженным. И наконец, следует избегать разметки ссылок поверх курсива, полужирного и других традиционных средств текстового выделения. Кстати, довольно–таки странно выглядит ссылка во внутритекстовом заголовке (если только вы не решите снабжать ссылками — например, на список разделов вверху страницы — все заголовки подряд).
Общепринятые визуальные атрибуты ссылки — измененный по отношению к основному тексту цвет (о принципах выбора которого мы говорили на стр.113) и подчеркивание — явно дублируют друг друга. И хотя такое двойное акцентирование помогает ориентироваться в текстовых ссылках быстро и почти подсознательно, подчеркивание все же не стало в массовом сознании обязательным признаком гипертекстовой ссылки. Косвенным подтверждением этому может служить тот факт, что в графических ссылках (например, на кнопках навигации) текст почти никогда не снабжается подчеркиванием. Поэтому в последнее время появляется все больше сайтов, отключающих с помощью CSS подчеркивание и для текстовых ссылок (для этого в стилевой спецификации достаточно написать A {text–decoration: none }).
ДРУГИЕ ПАРАМЕТРЫ
Почти все остальные параметры набора текста пока что поддаются регулировке только с помощью CSS (со всеми оговорками о применимости этой технологии, стр.40). HTML не позволяет ни изменять межстрочные, межбуквенные и межсловные расстояния, ни как–либо влиять на переносы текста, ни поворачивать или масштабировать текстовые объекты. (Можно, правда, изменять выравнивание текста по левому краю на противоположное, — однако выключка текста по ширине возможна, опять–таки, только с помощью CSS.) Судя по всему, еще очень далек тот день, когда визуальные броузеры смогут обеспечить такой же контроль над текстовыми блоками, как даже самый примитивный из графических редакторов.
Стоит сказать пару слов об оформлении абзацев. По традиции броузеры не делают отступов красной строки, отделяя абзацы друг от друга вертикальными отступами (как в этой книге). Не прибегая к помощи CSS, можно имитировать более традиционное (с точки зрения книжной верстки) оформление, заменив тег Р между абзацами на BR со следующей за ним горизонтальной распоркой — невидимой графической вставкой или несколькими подряд неразрываемыми пробелами (стр. 238). Если, однако, учесть, что того же видимого результата можно добиться с помощью CSS (обнулив значение margin и указав отступ красной строки text–indent для тега Р) уже в четвертых версиях обоих броузеров, от подобных искусственных приемов лучше воздержаться: членение на абзацы очень важно для информационной целостности текста, и неразумно жертвовать структурной разметкой этого аспекта ради сиюминутных визуальных выгод.
Здесь же нужно обсудить особенности оформления табличного текста. Как вы уже наверняка знаете, таблицы в HTML есть основной и почти единственный инструмент для размещения материала на двумерной плоскости страницы (мы будем подробно говорить об этом ниже, стр.234). Однако не так уж редко на веб–страницах встречается и собственно табличный материал, организация которого в строки и столбцы несет информационную, а не визуальную нагрузку.
Читать дальшеИнтервал:
Закладка: