- •Дмитрий кирсанов
- •Глава I. Техминимум 18
- •Глава II. Основы дизайна 56
- •Глава III. Дизайн веб-сайтов 131
- •Глава IV. Веб-графика 175
- •Оглавление
- •II.1 Пространственные отношения (78)
- •II.10 Нюансировка (172)
- •V.3 Галерея (323)
- •Предисловие
- •Что здесь есть и чего здесь нет
- •Примеры
- •Соглашения
- •Сверим часы
- •Как выбрать дизайнера
- •Почему эта тема?
- •Сам себе Гутенберг
- •Глава I. Техминимум
- •Кодировки текста
- •Однобайтовые кодировки
- •Семейство 8859
- •Двухбайтовые кодировки
- •История
- •В начале был sgml
- •Прикладная философия
- •Золотой век
- •Html плюс
- •Идолы рынка
- •Бяки и буки
- •Три, четыре...
- •Синтаксис
- •Подстановки
- •Минимальный документ
- •Текстовая разметка
- •Ссылки и привязки
- •Изображения и объекты
- •Национальные особенности
- •Согласование кодировок
- •Среды и доступность
- •Доступность: таблицы
- •Как писать alt-тексты
- •Доступность: изображения-карты
- •Мета-данные и поиск
- •Мертвая зона
- •Принципы
- •Возможности
- •Модульный html
- •Режем по живому
- •Сборно-панельный сайт
- •Например
- •Синтаксис
- •Уровни соответствия
- •Конверсия
- •Надстройки
- •Графика
- •Вектор в Интернете
- •На все четыре стороны
- •Палитры
- •Системы представления цвета
- •Программирование
- •Динамический html
- •Модульные технологии
- •Динамические страницы
- •Глава II. Основы дизайна
- •Как учиться дизайну
- •Дизайн и «чужое творчество»
- •Материалы и инструменты
- •Пространственные отношения
- •Относительность размера
- •Форма и размер
- •Искусство выравнивания текста
- •Цвет и размер
- •Текстура и размер
- •Пропорции
- •Золото и пластмасса
- •Пропорций простота
- •Микропропорции
- •Размещение
- •Одноуровневые элементы
- •Разноуровневые элементы
- •Плотность
- •Пол и характер
- •Плотность текста
- •В нужное время и в нужном месте
- •Дизайн Пизанской башни
- •Прямоугольники
- •Круги и закругления
- •Кривые Безье
- •Бесформенность
- •Как устроен цвет
- •Прогулка по цветовому кругу
- •Главные цвета
- •Восприятие цвета
- •Сочетаемость цветов
- •Текст и фон
- •Текстуры
- •Плоский цвет
- •Геометрические текстуры
- •Пиксельные текстуры
- •Фотографические текстуры
- •Материальные текстуры
- •Шрифт и текст
- •Элементы шрифта.
- •Гарнитура, начертание, шрифт
- •Виды начертаний
- •Шрифты и время.
- •Переходные шрифты
- •Новая антиква
- •Кларендон
- •Новые рубленые
- •Маятник гуманизма
- •Подбор Шрифтов
- •Единство противоположностей
- •Слишком декоративные шрифты
- •Развивая тему
- •Шрифты и названия
- •Параметры Набора
- •Прописные и строчные
- •Интервалы
- •Выравнивание и отступы
- •Размещение
- •Чья случайность лучше?
- •Текст как текстура
- •Единство
- •Академический стиль
- •В полный рост
- •Размещение
- •Текстура
- •Центр масс системы
- •Правило рычага
- •Контраст
- •Контраст — это продолжение единства другими средствами
- •Одномерный контраст
- •Многомерный контраст
- •Аспекты контраста
- •Расстояние
- •Расположение
- •Текстура
- •Динамика
- •Динамика явная
- •Ветер по Гауссу
- •Динамика совсем явная
- •Динамика неявная
- •Нюансировка
- •Пространственные отношения
- •Глава III. Дизайн веб-сайтов
- •Преграды и препоны
- •От общего к частному
- •Типы сайтов
- •Первый шаг
- •В мире .Org
- •Скорей любите нас
- •Бесплатный сыр
- •Устройство сайта
- •Неупорядоченный континуум
- •Топология сайта
- •Распределение материала
- •Фреймы и окна
- •Первая страница
- •Всплеск и вскрик
- •Формат страницы
- •Заметки о полях
- •Во первых строках
- •У голубого экрана
- •Если тебе дадут линованную бумагу — пиши поперек
- •Ступеньки ригидности
- •Заглавия и заголовки
- •Заглавие
- •Заголовки: логика
- •Заголовки: дизайн
- •Разделители
- •Баннеры
- •Навигация
- •Общий обзор
- •Семантика
- •Разновидности одинаковости
- •По ту сторону кнопок
- •Символы и метафоры
- •Особые случаи
- •Динамическая навигация
- •Блоки текста
- •Коренные шрифты
- •Все шрифты ношу с собой
- •Осторожно: кириллица
- •Другие параметры
- •Правила набора текстов
- •Расстановка пробелов
- •Неразрываемые пробелы
- •Текстовые выделения
- •Спецсимволы
- •Позиционирование
- •Дурная наследственность
- •Двойное дно
- •Белое место
- •Фэйсом об тэйбл
- •Позиционирование в css
- •Глава IV. Веб-графика
- •Техника
- •Палитра и диффузия
- •Цветовые границы
- •Экранный анти-алиасинг
- •Пиксельные эффекты
- •Оптимизация
- •Взболтать и настоять
- •Чудное мгновенье
- •Функции
- •Выставочная графика
- •Как не надо делать фон
- •Прогладить с изнанки
- •Одномерные фоны
- •Одним куском
- •Логотипы
- •Диалектика формы
- •На единицу площади
- •Про что картинка?
- •Символ и слово
- •Аспекты логотипа
- •Текстура
- •Баннеры
- •Сколько натикало?
- •Форматы
- •В нужное время и в нужном месте
- •Слева при входе
- •В начале было что-то
- •Собственная гордость
- •Удар ниже пояса
- •Смена поколений
- •На килограмм живого веса
- •Рынок визуалов
- •Трехмерность
- •Император иллюзий
- •Пластмассовый призрак
- •Скульптура или барельеф
- •Искусство искажений
- •Нетекстурирующие эффекты
- •Текстурирующие эффекты
- •Логотип
- •Цветовая схема
- •Входные цвета
- •Информационные цвета
- •Первая страница
- •Карты на стол
- •Навигация
- •Логотип
- •Первая страница
- •Внутренние страницы
- •Галерея
- •15. (Книги России 1) www.Books.Ru
- •Индекс Символы.
- •А(латиница).
Про что картинка?
Не забыли ли мы еще одно важное практическое требование к логотипу — иллюстративность, необходимость соотносить смысловую нагрузку знака с тем объектом (или субъектом) реального мира, которому этот знак принадлежит? Если понимать эту иллюстративность буквально, то в большинстве случаев она оборачивается полнейшей противоположностью оригинальности — и в самом деле, логотип в виде книги (пусть и стилизованной) для издательства или изображение автомобиля в качестве логотипа автомобилестроительной компании вряд ли удовлетворят даже самых наивных заказчиков (исключения, такие как «яблочко» фирмы Apple, редки и только подтверждают правило). Выбор темы логотипа по иллюстративному принципу может послужить лишь отправной точкой творческого процесса; большинство же логотипов, в том числе и самые известные, прекрасно обходятся совершенно абстрактными формами без малейшего намека на что бы то ни было материальное. Неким компромиссом, в достаточной мере абстрактным и в то же время не лишенным
268
(а)
(в)
иллюстративности, может служить первая буква или аббревиатура названия фирмы в качестве основы графической части знака.
С другой стороны, не столь прямолинейно подражательные формы, нередко отсылающие сразу к нескольким объектам или явлениям и обычно непонятные без некоторых размышлений или без знания сферы деятельности владельца знака, вполне могут служить носителем того самого «скрытого смысла», без которого не бывает хорошего логотипа. Подобный же контраст между беспредметной геометричностью формы и реальностью ее информационного наполнения придает определенную художественную ценность, например, дорожным знакам или указателям в аэропорту. Вообще, абстрактная символика, пронизывающая всю окружающую нас визуальную среду, — одно из важнейших дизайнерских открытий двадцатого века, для многих из нас определяющее, пусть подсознательно, само понятие «современности».
Символ и слово
Композиционно большинство логотипов состоят из двух частей: графического знака и подписи (обычно названия компании). Психологическая модель восприятия информации человеком, прямо противоположная знаменитому «в начале было слово», требует размещения текста справа или снизу от графики — так, чтобы текст этот воспринимался именно как подпись, на которую обращают внимание уже после изображения. Из двух стандартных вариантов расположения — текст под графикой (рис. 62, а) и текст справа от графики (б) — сейчас популярнее второй, подчеркнуто асимметричный, более контрастный и динамичный. У этих двух основных схем есть множество вариаций, в которых текст так или иначе «прорастает» в графику, образуя с ней единое целое.
Расположение текста по окружности вокруг графики именно благодаря своей симметрии, наоборот, выглядит весьма уравновешенно, солидно и старомодно; этот прием часто используется для логотипов конференций и мероприятий, названия которых обычно достаточно длинны для того, чтобы их можно было свернуть в кольцо (при этом в центре располагается не только графическая часть знака, но и сокращенное наименование, а иногда и год проведения конференции).
Многие логотипы, созданные десятилетия назад, обходятся вообще без текста (точнее говоря, они могут сопровождаться названием компании, но оно не является их неотъемлемой частью). В те времена окружающая человека дизайн-среда не была еще заселена столь плотно,
269
как сейчас, и в повседневной жизни логотипы встречались значительно реже. Поэтому, скажем, фирма Mercedes Benz могла рассчитывать, что ее простейшая, с минимумом «скрытого смысла» трехлучевая звездочка, вписанная в круг (рис. 63, а), будет эффективно работать на образ компании без лишних напоминаний о том, кому именно принадлежит этот знак. К сожалению, запас простых геометрических форм и их комбинаций, пригодных на роль символа, не бесконечен. Поэтому в последнее время ощутимой стала противоположная тенденция — текстовые логотипы без какой бы то ни было графики. Так, логотип Microsoft (рис. 83, б) состоит лишь из названия, набранного специально приспособленным для этой цели шрифтом с единственным украшением — маленьким треугольным вырезом в букве «о» (в малых кеглях этот вырез незаметен и логотип опознается исключительно по шрифту).
Можно сказать, что чисто графический знак идеально подходит для Mercedes Benz по той же причине, по которой текстовый логотип работает для компании Microsoft. В первом случае действует примерно такая мотивация: «Мы настолько знамениты, что любой узнает наш знак даже без подписи», а во втором: «Уровень нашей компании общеизвестен, так что незачем пытаться поразить потребителя какой-то небывалой графикой». Для обычных же, средней руки компаний оптимальным остается традиционный подход, комбинирующий в едином логотипе графическую и текстовую части.