Самоучитель по WEB-графике

Книга посвящена компьютерной графике. Однако не всей. Мы рассматриваем методы и средства создания и обработки изображений, предназначенные преимущественно для вывода на монитор компьютера и публикации в Интернете. Специальные вопросы предпечатной подготовки (например, цветоделение) и создание трехмерной графики здесь не рассматриваются. Это, конечно, не означает, что вы не сможете распечатать свою картину на принтере. Просто все предпечатные изыски мы оставляем без особого внимания. Подготовка буклетов, рекламных плакатов, обложек и шикарных иллюстраций книг на высоком уровне требует особых знаний, навыков и опыта, которыми обладают специалисты верстки.
Из всех программных средств работы с графикой мы выбрали Adobe Photoshop и Macromedia Flash, а также Dynamic HTML. Photoshop является признанным лидером обработки растровых (точечных) изображений, a Flash — широко известный редактор векторной графики, ориентированный на создание анимации, которая может сопровождаться звуком. Файлы, создаваемые Flash, компактны и могут встраиваться в Web-страницы. Другими словами, векторную графику и серьезную анимацию, которые удается вставить в Web-страницу. можно подготовить в Flash. Динамический HTML (HyperText Markup Language — язык разметки гипертекста) обеспечивает создание несущей конструкции Web-сайта. Это основное средство Web-дизайна имеет свои инструменты для работы с графикой. Корректировать сканированные изображения и делать коллажи лучше всего в Photoshop, а рисовать на «чистом листе бумаге» — в Flash. И то, и другое обычно требуется в Web-дизайне.

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

Цвет
Любое графическое изображение можно представить как некоторую композицию разноокрашенных областей. Поэтому основная информация о картинке есть информация о цвете. Цвет — это свойство видимых предметов, непосредственно воспринимаемое глазом. Поэтому, на первый взгляд, и говорить-то не о чем. Однако при смешении красок в банке или на палитре художника, а также при выводе изображения на монитор или принтер или, наоборот, при сканировании картинок постоянно возникают вопросы о цвете и цветопередаче (переносе изображений с одного носителя на другой или с одного устройства вывода на другое).

Коррекция изображений
Изображение кроме цветов характеризуется и другими параметрами, такими как разрешение, яркость, контрастность, гамма-коррекция и резкость. Наверняка вы слышали о них, по крайней мере, настраивали яркость и контрастность своего телевизора. В этой главе мы рассмотрим их подробно. Сначала мы уясним собственно понятие этих параметров, а затем обратимся к инструментам их настройки в графических редакторах. Предпочтение, конечно, будет отдано Adobe Photoshop.

Форматы файлов


Подобно тому, как обычный художник должен знать химические и физические свойства красок и холста, дизайнер компьютерной графики должен разбираться в форматах файлов, в которых сохраняется графическая информация. Новички, как правило, очень неразборчивы в выборе формата файла при сохранении изображений. Главная их цель — сохранить результаты своего творчества любой ценой. В итоге неэкономно расходуется дисковое пространство, а Web-страницы загружаются в браузер невыносимо долго. Однако немного знаний и внимания к предмету могут коренным образом все изменить к лучшему. Одна и та же картинка может занимать и 5 Мбайт, и 10 Кбайт — разница в объеме может достигать сотен и даже тысяч раз!

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

Сканеры и сканирование
Исходный материал для создания графических композиций можно найти в уже существующих графических файлах. Однако при этом следует помнить, что некоторые из них являются предметом защиты авторских прав и, следовательно, их нельзя свободно копировать. Можно также создавать свои произведения «с чистого листа», используя средства рисования графических редакторов. Но тогда нужны как художественные способности, так и навыки рисования с помощью компьютера. Есть еще один эффективный способ создания компьютерной графики. Он основан на использовании сканеров или цифровых фотокамер. Хорошие фотокамеры довольно дороги, а сканеры успешно завоевывают рынок товаров массового потребления и вполне доступны.

Инструментарий Photoshop
Сначала необходимо договориться, что все изложение основывается преимущественно на версии графического редактора Adobe Photoshop 6.0, некоторые особенности Photoshop 7.0 мы оговорим специально. Существенные изменения в Photoshop произошли при переходе от версии 4 к 5. В последующих версиях вводились некоторые усовершенствования, но концепция оставалась практически неизменной. Так что, если вы хорошо знакомы с версией 5.0, то перейти к следующей версии для вас не составит особого труда.

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

Рисование в Flash
Таким образом, в этой главе мы рассматриваем Flash просто как векторный редактор для создания и изменения векторных изображений. Техника работы с векторными изображениями отличается от способов работы с растровыми картинками. Вместе с тем, в Flash вы имеете возможность импортировать в свою векторную графическую композицию растровые изображения. При этом их можно масштабировать, осуществлять геометрические преобразования как целого объекта, но нельзя корректировать цвет пикселов. Иначе говоря, растровое изображение в векторном редакторе представляется как некий единый объект, хотя средствами Flash можно попытаться разделить его на отдельные части. Анализ изображения с целью коррекции цвета, контрастности, выделения фрагментов и т. п. производится совсем другими средствами — растровыми редакторами, например, Photoshop. При работе в векторном редакторе вы должны уяснить прежде всего, что все изображения или их фрагменты представляют собой объекты графической композиции. Каждый объект можно модифицировать, т. е. изменить.

Анимация во Flash
Результаты работы Flash (файлы, анимации, Web-страницы) принято называть мультфильмами, клипами, видеофрагментами, роликами и анимациями (общий термин — movie). Обычно клипами называют мультфильмы, входящие в состав других мультфильмов. Процесс создания мультфильма состоит в следующем. Сначала создается исходный или так называемый авторский файл с расширением fla. Этот файл можно редактировать и просматривать в среде программы Flash. Затем он преобразуется в SWF-файл, который уже можно просмотреть в Flash-проигрывателе и Web-браузере. Кроме того, можно экспортировать результаты вашей работы в файлы других широко распространенных форматов: MOV, анимационный GIF, JPEG и ряд других.

Элементы языков HTML И Javascript
Обе задачи сводятся в конечном счете к размещению картинок из графических файлов в HTML-документе. Этот документ пишется на специальном языке HTML (HyperText Markup Language, Язык разметки гипертекста). При этом неважно, какими средствами вы пользовались для его создания (обычный текстовый редактор, Microsoft FrontPage, Macromedia Dream Weaver и т. п.). HTML-документ хранится в обычном текстовом файле. Расширение htm или html этого файла указывает лишь на то, что в нем содержатся тэги (инструкции, команды) HTML-кода. Щелчок кнопкой мыши на имени этого файла в Проводнике Windows открывает его в Web-браузере, установленном на вашем компьютере (например, в Internet Explorer). Браузер загружает HTML-документ вместе с другими файлами, необходимыми для формирования и функционирования Web-страницы.

Горячие клавиши Photoshop
Горячие клавиши (hotkey) редактора растровой графики Photoshop призваны ускорить работу с изображением. Большинство таких клавиш (или комбинаций клавиш) заменяют собой команды меню. Запомнить все эти клавиши, естественно, невозможно. В качестве подсказок многие из них указаны рядом с соответствующей командой меню. Целесообразнее всего применять такие горячие клавиши в случаях наиболее часто употребляемых команд меню.

Загружайте поменьше дополнительных модулей
Если вы готовы избавиться от ненужных дополнительных модулей (plug-ins) для Photoshop, занимающих ценные системные ресурсы, наберите тильду (~) и пробел перед именем фильтра или модуля Import/Export (Импорт/Экспорт) в папке Plug-Ins на жестком диске. Во время запуска Photoshop будет игнорировать помеченные тильдой файлы, что приведет к повышению производительности и сделает более компактными меню Filter (Фильтр) и Import/Export (Импорт/Экспорт).

Тэги HTML
Cуществует более 70-и свойств, предназначенных для применения в каскадных таблицах стилей Dynamic HTML. Их можно условно разделить на несколько групп. Начнем со сводной информации о единицах измерения, используемых для определения значений свойств.

Справочник по Javascript
Для управления программой в JavaScript есть два способа. Первый включает в себя условные выражения, которые в зависимости от условия выполняют либо одну часть программы, либо другую. Второй способ — использование циклов.

Справочник по Actionscript
В данном разделе собраны сведения о действиях (операциях), которые включены в список Basic Actions (Основные действия) панели действий.

Уроки верстки

Добро пожаловать в Adobe® InDesign® CS2. InDesign - мощное программное средство, предназначенное как для разработки, так и для производства печатной продукции. Оно характеризуется точностью, высоким уровнем управляемости и простотой интеграции с другим программным обеспечением компании Adobe, ориентированным на работу с графикой. С помощью InDesign можно выпускать полноцветную полиграфическую продукцию профессионального качества на высокопроизводительных станках цветной печати, распечатывать документы на разнообразных выводных устройствах, таких как настольные принтеры, и создавать файлы в различных форматах, например, PDF или HTML.
Писатели, художники, дизайнеры и издатели как никогда прежде могут расширить свою аудиторию и использовать для этого беспрецедентное разнообразие информационных носителей. Именно на многообразие форм данных ориентирована концепция сетевого издательства компании Adobe (Adobe Network Publishing), реализуемая с помощью средств создания визуально насыщенного содержимого, которое доступно везде, в любое время и на любом устройстве. Программа InDesign поддерживает данный подход благодаря полной интеграции с приложениями Adobe Photoshop8, Adobe Illustrator® и Adobe GoLive®. В книге «Adobe InDesign CS2. Официальный учебный курс» описываются новые функции, технологии и методы, поддерживающие новые веяния в издательской сфере.

Введение
Вы начнете обзор программы с открытия частично готового документа. Вы добавите заключительные изменения в данную 6-страничную статью о народном искусстве Мексики для воображаемого туристического журнала. Прежде чем запустить программу Adobe InDesign, следует восстановить настройки по умолчанию, если это не было сделано ранее. Восстановление настроек по умолчанию гарантирует, что инструменты и палитры будут действовать в точном соответствии с описанием данного урока. После того как вы освоите программу InDesign, этот шаг уже не надо будет выполнять.

Беглый взгляд на рабочее пространство
Чтобы оптимально использовать все возможности по рисованию, верстке и редактированию в программе Adobe InDesign, следует изучить способы перемещения в рабочем пространстве программы. Рабочее пространство состоит из окна документа, монтажного стола, панели инструментов и плавающих палитр. Исходные файлы и окончательные варианты примеров находятся в папке ID_01 внутри папки Lessons.

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

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

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

Настройка междустрочного интервала
Средства программы Adobe InDesign обеспечивают точное управление шрифтом и форматированием документа. Можно легко изменять шрифт и стили его начертания, устанавливать режимы выравнивания, добавлять табуляторы и отступы, а также применять к тексту разные цвета и обводки

Определение требований к печати
Палитра Swatches (Образцы цвета) используется для применения, изменения и сохранения цветов, оттенков и градиентов в документе. Имеется возможность создавать и применять основные и шишечные цвета, включая цвета CMYK, RGB и LAB. Также можно применять оттенки и смешанные градиенты к фреймам, границам и к тексту.

---

---