Простая по композиции сплэш-страница наглядно демонстрирует принципы интеграции фотографики: монохромная, но с тоновым компонентом середина противопоставлена черно-белой периферии (297); тема прямых линий как вспомогательных построений (94)
Книги России 1) www.books.ru
Габариты стандартного баннера как основа организации пространства страницы (208); «вживление» баннера в тело страницы в попытке подавить реакцию отторжения чужеродного материала (279); логотип над цветовой границей в фоновом изображении (250); темная полоса вдоль левого края уравновешивается асимметричной, утяжеленной справа линейкой-разделителем в текстовом поле (188); «синее» равновесие выстроено вокруг вертикальной оси, совпадающей с фоновой границей синего и белого, а «оранжевое» имеет своим центром масс черный полумесяц в логотипе, причем яркий оранжевый флаг слева от этого полумесяца уравновешивает разрозненные пятна ссылок и других элементов того же цвета на всей странице (158); на страницах со списками книг этого же сайта — строки таблицы с чередующимся фоновым цветом (227)
Www.ideo.com/net3/ideo.htm
Регулярная решетка контрастирует с псевдослучайной разбросанностью содержимого клеток (87); почти монохромная гамма близких по тону синих во всех элементах дизайна, кроме нарочито ярких разноцветных фотографий (111); «лежачее» расположение страницы (см. также пример 3) подчеркнуто горизонтальной размывкой заголовка «IDEO» вверху (300); навигационная панель слева построена на основе общего для всех кнопок размытого фотографического фона (210)
Www.chess.ibm.сom/learn/html/e.html
Сбалансированная цветовая гамма, построенная на контрасте мягко-оливкового и синего (115); комбинация геометрической (горизонтальные полоски) и фотографической текстур (118); композиция прошита пунктирными соединительными линиями, стилизованными под чертеж или радиосхему (94); фото земного шара из космоса (фон под спортсменом) вводит дугу большого радиуса (98), своей наклонностью (98) поддерживающей динамику визуала (168); имитация фотографической «глубины резкости» (299) придает выпуклость фигуре атлета; фотографический визуал интегрирован в композицию размывкой краев (289)
Www.tlg.com
«Декадентская» материальная текстура фона имитирует пятна и потертости, «осыпание» графического визуала слева (121); почти полное отсутствие выравниваний элементов по вертикали (87); при всем при том композиция страницы полностью уравновешена по любому из своих аспектов (155); кегль шрифта в навигационных кнопках внизу — на пределе видимости (138); увеличение трекинга (141) и использование стиля «все заглавные» в надписях мелким кеглем (140); «гуманистический» рубленый шрифт (133)
Www.verso.com
Светлый, теплый, мягкий и ненасыщенный цвет текста на темном, холодном и насыщенном фоне (116); яркий фотографический визуал (288) неясного содержания, состоящий по большей части из трудноопределимых, но впечатляюще фотографических искажений (299); «гуманистический» рубленый шрифт (133) в названии студии
Www.vivid.com
б
Рис. 19
(к стр. 104)
Рис. 20
(к стр. 112)
Рис. 22 (к стр. 114)
Рис. 21
(к стр. 112)
Рис. 43
(к стр. 163)
Рис. 78
(к стр. 307)
Рис. 79
(к стр. 309)
Рис. 87
(к стр. 318)
Рис. 88 (к стр. 318)
Рис. 89 (к стр. 319)
Рис. 90 (к стр. 320)
Рис. 91 (к стр.321)
Рис. 92 (к стр. 322)
Индекс
Символы.
’
и кавычки в английском языке 232 правила расстановки пробелов 228
‘
и кавычки в английском языке 232
правила расстановки пробелов 228
..., правила расстановки пробелов 228
:
во французском языке 230 правила расстановки пробелов 228
;
во французском языке 230 правила расстановки пробелов 228
?
в адресе ссылки в HTML 30 в адресе ссылки в XML 53 во французском языке 230 правила расстановки пробелов 228 !
синтезирование шрифтов 221 установка величины полей 195 фоновые изображения 241
CTR, параметр баннера 277 влияние анимации 280 влияние вопросительного предложения 282 влияние надписи «click here» 169, 281 влияние объема графического файла 286 влияние предложения бесплатных услуг 283 при расположении баннера у полосы
drop caps см. буквицы DSSSL, язык 53 DTD 29, 48, 151 dvips, программа 12
E
ECMA, ассоциация 67 ECMAScript, язык 66 EM, тег 34, 45 em dash см. длинное тире emTeX, программа 12 en dash см. короткое тире encodings см. кодировки Encynova, логотип фирмы 317 entities см. подстановки Erika, гарнитура 317
expandable outlines см. раскрываемые оглавления expanded fonts см. шрифты, растянутые Expression, графический редактор 101, 104 extra bold см. начертания шрифта, сверхжирное Eye Candy, программа 290
ISO, организация 180 ISO 10646, кодировка 18 ISO 8859, серия кодировок 17 ISO 8859-1 см. Latin-1, кодировка Ispell, программа 12 italic см. курсив ITC Garamond, гарнитура 137
J.
Java, язык
апплеты 25, 69
виртуальная машина 69
кофейная чашка 264 JavaScript, язык 25, 43, 64
взаимодействие с полями форм 64
перекатывание (rollover) 213
управление окном броузера 64, 190, 198, 325
управление фреймами 64 Jenson, гарнитура 128 JPEG, формат 120, 252, 295 JScript, язык 65
К.
Kai's Power Tools, набор фильтров 295 kerning см. кернинг
L.
LaTEX, система верстки 12 Latin-1, кодировка 17, 33, 230
216, 223, 228 «вес» заголовков 20 заглавие страницы 200 недоступность фреймов 32, 189 автоматическое перенаправление 40, 188, 192 авторского права символ 230, 232 аддитивная система представления цвета 63 адрес назначения гиперссылки 30 в XML 53
передача параметров вызова программы 30 с # 187
Академическая, гарнитура 131 академический стиль 29, 90, 151, 179, 181 иерархия заголовков 200 линейки-разделители 203 объем файлов 187 поля страницы 194 размеры окна 197
указание ширины и высоты изображений 236 активность объектов в композиции 79, 81, 106,
базовая линия шрифта 80, 94, 325 базовый кегль текста в броузере 194, 216 баланс 155 баннеры 204, 275
alt-текст 276, 278
CTR 277
автоматическая смена 276
англоязычные 284-286
анимированные 280, 300
динамика 280
минибаннеры 262, 277, 287
муляжи элементов интерфейса 284
надпись «click here» 169, 281
объем графического файла 286
предложение бесплатных услуг 283
проклик 277
размещение 188, 195, 205, 279, 330
русскоязычные 284, 286
серии 286
«скрытый смысл» 299
службы обмена 276
составные 285
«старение» 286
сюжет 280
текст 282
форматы 277
формулировка в виде вопросов 282 барельефная трехмерность 293, 301, 302 Баскервилль, гарнитура 129 безопасная палитра 177, 245, 246, 307
значения в системе RGB 247 Безье, Пьер 99
Безье кривые см. кривые Безье белый цвет 108, 110, 112 Бернштейн, Сергей 99 бесплатная графика 8, 77, 153, 211, 293 бесплатные услуги, влияние на CTR баннера 283 беспроволочный телеграф 184 бесформенность см. аморфность Бетина Скрипт, гарнитура 134 бланки см. формы блок-схемы 93 Блэк, Роджер 112
Бодони, гарнитура 81, 130, 136, 137 браузеры см. броузеры о. Браун 40 броузеры 5
alt-текст как всплывающая подсказка 37, 314
Microsoft Internet Explorer см. Internet Explorer, броузер
Netscape Navigator см. Netscape Navigator, броузер
МК-54, микрокалькулятор 292 мнемонические подстановки 29, 231 многозначные числа 229 многоточие, правила расстановки пробелов 228 модерн, стиль 99, 127, 130 модульный HTML 44, 51, 54 мониторы
256-цветные 61, 62, 177, 224, 246, 247, 249, 250 вывод цветовых границ 248 количество цветов 61, 107, 117, 176, 245 размер пикселов 248 разрешение 61, 117, 176, 190, 193, 245 частота развертки 115, 119 монохромные изображения 62, 265, 273, 297
моноширинные шрифты 125, 137
выбор в CSS 219
выбор в HTML 217
стандартный в Windows 219 монументальная живопись 78 «Москва—Петушки» 142 муар 119 муляжи элементов интерфейса 284
Н.
наброски от руки 101 навигационная панель 206
в виде выпадающего меню 66, 206, 214
в отдельном фрейме 189
на левом поле 171
перекатывание (rollover) 65, 212-214, 311
размещение 208, 262
ускорение загрузки 38, 213
элементы см. кнопки навигационной панели навигация на сайте 205, 312 Нагано, логотип Олимпиады 271 Наггум, Эрик 152 наклонные линии 94, 168, 308, 331 наложение
букв 143, 273, 305, 329
объектов 89, 236, 241, 326
с помощью CSS 43
текста на размытые фотографии 259
частично прозрачных изображений 296 наплыв 80, 128 насыщенность цвета 104, 112, 307
изменение с помощью фильтров 296
контрастирование 113
повышенная 299
фона 114 насыщенность шрифта 125
рубленых 97, 135, 136, 143, 166, 272, 298 Национальный центр суперкомпьютерных
приложений США 22 начертания шрифта 124
жирное 125
курсив 34, 49, 125, 128, 136, 140, 148, 230, 306
малые прописные 126, 325
перекошенное 125
полужирное 125, 148, 230
прямое 125
сверхжирное 126
светлое 125
некоммерческие сайты 180 немецкий язык
кавычки 232
пробел в конце предложения 230 неразрываемые пробелы 229, 238
имитация отступов красной строки 226
мнемоническая подстановка 29
новая антиква 81, 130, 136
изменение пропорций 139 «ноготки» (thumbnails) 190, 257, 258
на сайте www.kirsanov.com 313 номера символ 229, 233 нюансировка 154, 171, 329
в логотипах 174, 270, 317
О.
оба броузера 5
общего знаменателя принцип 177, 245, 246
объекты
в векторной графике 56
контуры 96, 101, 117, 118, 247, 301, 323, 328
наложение 43, 89, 236, 241, 259, 296, 326
обрезка фона 296
отступы вокруг 240
повторение 171
размещение 85
размывка со смазыванием 168, 300
расстояние между 85, 164
степень заметности в композиции 79, 81, 206, 297, 300, 329, 333
тени 301 объем файлов
баннеров 286
векторной графики 57
влияние диффузии 255
влияние мелкого кегля 138
влияние растровых эффектов 295
влияние трехмерности 295
влияние фрагментирования графических вставок 37, 213
размещение объектов по окружности 87 оливковый цвет 309, 331 Олимпиада в Нагано, логотип 271 оптимизация графики 252, 295, 302
баннеров 286
программы-оптимизаторы 254
с диффузией 255
оптические иллюзии 80, 154, 174 оптический центр прямоугольника 96 оранжевый цвет 107, 116, 158, 319, 329, 330 ортогональная разметка 20
в XML 48
в модульном HTML 43 открытые программы см. open source software относительное позиционирование в CSS 235, 240 отступ красной строки 145, 226, 238 Оффицина Санс, гарнитура 133
П.
палитра 62
безопасная 177, 245, 247, 307 влияние на объем графики 255 системная 246 уменьшение 253
панели прокрутки см. полосы прокрутки панорамные страницы 196, 300, 324 панорамные форматы 60 параграфа символ 229, 232 первая страница сайта 190
ссылки на подчиненные страницы 206 перевода строки символ 15 переднеплановость см. активность объектов в
композиции
перекатывание (rollover) 65, 212, 311 с помощью JavaScript 213 с помощью динамического HTML 214 переносимость см. доступность информации переносы 144
плавающее позиционирование в CSS 241 плавный переход цветов см. градиент Платон 74 плоский цвет 117
и фотографические текстуры 120, 155, 164, 165, 275
плотность размещения 89, 156 в логотипах 267 текста 90
«пляшущие» буквы 146 повторение объектов 171 подключаемые модули 25, 68, 295
подстановки
мнемонические 29, 231 числовые 18, 29, 33, 230 подчеркивание 209 в гиперссылках 225 по базовой линии шрифта 94, 325 позиционирование в CSS 240 абсолютное 43, 59, 66, 235, 241 относительное 235, 240 плавающее 241 фиксированное 241 поиск по ключевым словам 38 поисковые системы 38, 182 «вес» заглавия 200 «вес» заголовков 20
ссылки на страницах с результатами 207 статистика словоупотреблений 5 Поллок, Джексон 271 полосы 118, 168, 331 полосы прокрутки 193, 279 горизонтальная 193, 198, 324 на баннерах 285 полужирное начертание 125, 148
выделение знаков препинания 230 поля
вокруг текста 90, 96 оставляемые броузером 194, 250, 264 установка в CSS 240 установка с помощью таблиц 197, 234 установка с помощью фреймов 189, 195 посещенных адресов список 190 почтовый адрес автора сайта 208 правильно структурированные XML-документы 50 Престиж, гарнитура 137 призаголовочная графика 202, 288 принтеры
воспроизведение цветовых границ 248 входной формат 56 печать веб-страниц 193, 197, 224 разрешение 176 пробелы 228
в конце предложений 230 межсловные 238
неразрываемые 29, 226, 229, 238 программы
встраивание в веб-страницу 67
номера версий 229
свободно распространяемые см. open source
software прозрачность 299
для интеграции фотографии в композицию
120, 259, 289
для создания бесшовного фона 262 и анти-алиасинг 249 проклик см. CTR, параметр баннера
прописные буквы см. заглавные буквы пропорции 82
букв 126, 139, 210, 273
влияние размеров объектов 84
золотое сечение 82
кратные 83
принцип ограничения «сверху» 83, 139, 270
прямоугольников 95
человеческого тела 84 пространственные отношения 78 профессиональный дизайн 5
декадентский стиль 122, 296, 325, 328, 332
жесткое позиционирование 91
заголовки 202, 327, )29
использование «чужого творчества» 76, 327
контраст 160, 163
контраст фотографией и плоского цвета 120, 275
материальные текстуры 121, 332
мелкий кегль 138
плоский цвет 117
примеры 2, 323-333
прямоугольники 95
радужные цвета 112
«текстурщина» 122, 294
толстый контур 97, 323, 328
трехмерность 290, 294
хаотическое размещение объектов 87, 146, 156, 260, 331, 332
цвета 103, 108, 111,331
шрифты 127, 135 прямоугольники 92, 94
как маркеры элементов списка 319, 322
компактность 80
контур 96, 323, 328
оптический центр %
пропорции 95
с закругленными углами 99, 154, 164, 323, 328 прямые линии см. линии пуансон 266
пункты перечисления внутритекстовые 229 пункты типографские 126 пурпурный цвет 63
пустое пространство 8), 138, 144, 191, 326 Пушкин, А. С. 55
Р.
радио 184 радиосхемы 94, 331 разделительные линии 93, 323, 326
alt-текст 36
тег HR 93, 203
трехмерные 203 размер
в пропорции 84
влияние на восприятие цвета 109, 174, 251 влияние формы объекта 79, 145 воспринимаемый 78 композиции 79 контрастирование 160, 164 координация с переднеплановостью 83 сопоставимый с размером пиксела 251 размерные линии 94 разметка
увеличение интерлиньяжа 238 расстояние между объектами 85 растровая графика 56, 59 аморфные формы 100 аналогия со звукозаписью 60 искажения 295 форматы 60, 252
растровые эффекты 295, 325
нетекстурируюшие 296
потеря информации 295
текстурирующие 299 регистр букв
в идентификаторах тегов HTML 28
в идентификаторах тегов XML 51 регулярность 82, 118, 260 регулярные выражения 46 «резиновый» дизайн 191, 197
ширина таблицы 239 реклама
анимация 169
баннерная 183, 188, 195, 204, 275
бесплатных услуг 283
дизайн 275, 277, 284
имиджевая 181, 277, 284
лозунги 147, 228, 282, 288
одинаковых по значимости объектов 206
спам 180
Релком, компьютерная сеть 16 речевые броузеры см. звуковые броузеры рисованная графика 289, 327
в навигационной панели 211 роботы поисковых систем см. автоматические
сборщики информации розовый цвет 107 рок-музыка 291 Ротко, Марк 271 рубленые шрифты 124, 134, 316