Компьютерная графика - Книга

2.5 Форматы файлов изображений 2.5.2 Форматы web-графики 2.6 Adobe Photoshop и web-графика 2.6.4 Подготовка графических элементов web-страниц 2.6.5 Подготовка макета web-страницы в Adobe PHOTOSHOPВекторная графика описывает изображения с использованием прямых и изогнутых линий, называемых векторами, а также параметров, описывающих цвета и расположение. Например, изображение древесного листа описывается точками, через которые проходит линия, создавая тем самым контур листа. При редактировании элементов векторной графики Вы изменяете параметры прямых и изогнутых линий, описывающих форму этих элементов. Вы можете переносить элементы, менять их размер, форму и цвет, но это не отразится на качестве их визуального представления. Векторное представление заключается в описании элементов изображения математическими кривыми с указанием их цветов и заполняемости (вспомните, круг и окружность - разные фигуры).Растровая графика описывает изображения с использованием цветных точек, называемых пикселями, расположенных на сетке. Например, изображение древесного листа описывается конкретным расположением и цветом каждой точки сетки, что создает изображение примерно также, как в мозаике. Растровая графика зависит от разрешения, поскольку информация, описывающая изображение, прикреплена к сетке определенного размера. Изображение представляется в виде большого количества точек - чем их больше, тем визуально качественнее изображение и больше размер файла. Т.е. одна и даже картинка может быть представлена с лучшим или худшим качеством в соответствии с количеством точек на единицу длины - разрешением (обычно, точек на дюйм - dpi или пикселей на дюйм - ppi).В настоящее время создано множество пакетов иллюстративной графики, которые содержат простые в применении, развитые и мощные инструментальные средства векторной графики, предназначенной как для подготовки материалов к печати, так и для создания страниц в интернете. Если вчерашние пакеты векторной графики позволяли только помещать растровое изображение в ваш файл, то с помощью современных программ можно встраивать представленные в растровой форме изображения, изменять их размеры и даже накладывать специальные эффекты и маски. Файл векторной графики неизмеримо меньше растрового файла для такого же изображения и это позволяет увеличивать масштаб фрагментов изображения до 25 тыс. процентов. Пакет Expression 1.0 фирмы Fractal Design позволяет строить контуры из других сложных векторных графических изображений, предоставляя в распоряжение пользователя бесконечное разнообразие визуальных возможностей, недостижимое с помощью других программ. Чтобы подготовить чертежи для небольших строительных проектов, например реконструкции этапа дома или модернизации кухни, можно воспользоваться пакетами Planix и Draftix фирмы SOFTDESK (), Visual Home фирмы Books That Work (www.btw.com) или 3D Home Architect, Edition 2 фирмы Broderbund Software ().Adobe Illustrator работает в среде Windows 95, но в нем используются диалоговые окна в стиле Windows 3.1 и короткие имена файлов. По функциональным возможностям Illustrator сегодня настолько уступает пакету CORELDRAW, не говоря уже о Macromedia FREEHAND 7, что мы не стали бы рекомендовать этот пакет для профессиональных художников-графиков, до тех пор пока Adobe не выпустит его существенно модернизированную версию. Ветеран векторной графики - пакет Illustrator - когда-то представлял собой выдающееся достижение в этой области и послужил моделью, которая легла в основу всех представленных в данном обзоре программ. Например, Macromedia FREEHAND лучше выполняет импортирование файлов EPS и AI и при этом обеспечивает высокую точность цветопередачи в формате CMYK, которой всегда отличался Illustrator. Canvas 5 располагает средствами редактирования растровых изображений на уровне пикселов, а его рабочая область достигает почти 140 м2, в то время как для Illustrator эта область составляет всего 0,2 м2.Micrografx Designer 7 - приятная в применении, хоть и не крупная программа, легко справившаяся с большинством тестов, - также заслуживает особого упоминания благодаря своим превосходным средствам для технических иллюстраций. Средство экструзии придало изображению нашей гитары глубину и особую освещенность; стандартные средства наклона и поворота позволили расположить эти гитары в трехмерном пространстве. Диалоговое окно форматирования объекта содержит непривычно крупные пиктограммы и области выбора образцов внутренней закраски, стиля линий и заполнений, текста и таких характеристик объекта, как имя, размер и расположение. К сожалению, иногда диалоговое окно форматирования объекта не показывало нашего заполнения объекта, что приводило к неправильному использованию заполнения, принимаемого по умолчанию, при изменениях шрифта. Хотя мы могли редактировать невидимую направляющую и текст при этом изменял свое расположение, он не "реагировал" на изменения видимых очертаний объекта.Поскольку FREEHAND всегда отображает цвета так же, как они будут выглядеть при печати

СОДЕРЖАНИЕ

ВВЕДЕНИЕ

I. ГЛАВА

1. КОМПЬЮТЕРНАЯ ГРАФИКА

1.1 Векторная графика

1.2 Растровая графика

1.3 Программы векторной графики

1.4 Corel Draw 8-12

1.5 Adobe Illustrator

1.6 Micrografx Designer

1.7 Macromedia FREEHAND

1.8 Corel Xara

1.9 Canvas

1.10 Fractal Design Expression

1.11 Сравнения характеристик программ

1.12 Форматы файлов компьютерной графики

1.13 Основной принцип построения графических объектов

1.14 Применение векторной графики

1.15 Векторная графика в интернете

II. ГЛАВА

2. ЭЛЕКТРОННЫЙ УЧЕБНИК ПО РАСТРОВОЙ ГРАФИКЕ (PHOTOSHOP)

2.1 Руководство электронного учебника по Растровой графике (PHOTOSHOP)

2.2 Титульный лист

2.3 Содержание

2.5 Форматы файлов изображений

2.5.1 Форматы исходных и промежуточных изображений

2.5.2 Форматы web-графики

2.6 Adobe Photoshop и web-графика

2.6.1 Цветовые режимы и модели

2.6.2 Сканирование и коррекция изображений

2.6.3 Выделение фрагментов изображения

2.6.4 Подготовка графических элементов web-страниц

2.6.5 Подготовка макета web-страницы в Adobe PHOTOSHOP

2.6.6 Сохранение файлов в форматах GIF и JPEG

2.7 Adobe Imageready

2.7.1 Подготовка и оптимизация изображений

2.7.2 Создание анимированных изображений

2.7.3 Карты-изображения в IMAGEREADY

2.7.4 Подготовка анимированных кнопок

2.7.5 Экспорт изображений

2.7.6 Дополнительные возможности IMAGEREADY

2.8 Построение Web-Страниц

2.8.1 Краткий обзор возможностей HTML

2.8.2 Структура HTML-документа и форматирование текста

2.8.3 Использование списков и таблиц

2.8.4 Использование изображений

2.8.5 Ресурсы Интернета и ссылки на них

2.8.6 Использование фреймов

2.8.7 Размещение web-страниц в Интернете и их реклама

Листинг программы

ВВЕДЕНИЕ

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

Совокупность таких “векторов” и есть векторное изображения.

С развитием компьютерной техники и технологий появилось множество способов постройки графических объектов. Но для начала, определимся с термином "графический объект". Это либо само графическое изображение или его часть. В зависимости от видов компьютерной графики под этим термином понимаются как и пиксели или спрайты (в растровой графике), так и векторные объекты, такие как круг, квадрат, линия, кривая и т.д. (в векторной графике).

Для дальнейшего рассмотрения проблемы постройки объектов с помощью векторной графики, необходимо уяснить разницу между двумя основными видами компьютерной графики - растровой и векторной.

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

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

Так как возросла роль оформления web-страниц, то потребовались люди, обладающие достаточными знаниями и навыками для его разработки. Если раньше оформление (дизайн) сайта разрабатывали те же люди, которые писали все необходимое программное обеспечение и HTML-код, то теперь на должность web-дизайнера нанимают отдельного человека, от которого часто не требуется владение языками программирования - он должен уметь рисовать. Для того чтобы нарисовать хороший сайт (часто эскизы сайта именно рисуются в виде одной картинки), надо уверенно владеть пакетами графических программ. Именно с их помощью осуществляется подготовка графических элементов, размещаемых на сайте. Существует множество графических редакторов, но лидирующее положение среди них занимает Adobe PHOTOSHOP - наиболее известный пакет для обработки растровой графики, распространенный как на PC, так и на компьютерах Macintosh.

Эта работа посвящена изучению особенностей применения Adobe PHOTOSHOP версии 7.0 для разработки графического оформления сайта. Работа, в первую очередь предназначена тем, кто только начал осваивать премудрости и тонкости web-дизайна, но уже имеет основные навыки работы с этой программой. Впрочем, если вы пользуетесь более ранними версиями PHOTOSHOP, то также можете обратиться к этой книге - основные приемы работают во всех версиях этого графического пакета.

Работа состоит из четырех частей: · «Форматы файлов изображений» - для того чтобы готовить графические элементы web-страниц, надо иметь представление об используемых для их хранения форматах файлов. В этой части книги вы ознакомитесь с основными форматами web-графики (GIF, JPEG и PNG), а также с форматами, применяемыми на промежуточных этапах разработки (в том числе и с форматом PSD - собственным форматом Adobe PHOTOSHOP);

· «Adobe PHOTOSHOP и web-графика» - в этой части вы сможете найти описание основных приемов работы с изображениями, используемых в web-дизайне. Вы научитесь корректировать отсканированные или отснятые фотокамерой изображения, выделять фрагменты картинок, готовить собственные графические элементы и, наконец, собирать из отдельных картинок законченный макет страницы. Также вы научитесь сохранять изображения в форматах, используемых во Всемирной паутине;

· «Adobe IMAGEREADY» - совместно с Adobe PHOTOSHOP поставляется программа Adobe IMAGEREADY, ориентированная специально на подготовку графики для web-страниц. С ее помощью не очень удобно рисовать, но зато можно с легкостью сохранять файлы в различных форматах, оптимизировать степень сжатия, готовить анимацию и карты-изображения. Эта часть посвящена изучению основных возможностей IMAGEREADY;

· «Построение web-страниц» - чтобы подготовить хороший макет страницы, мало просто уметь рисовать. Надо знать, какие технологии будут использованы на последующих этапах подготовки сайта и в чем заключаются их особенности. Это поможет разработать макет, пригодный для превращения в web-страницу. В данной части книги рассматриваются основы языка HTML, используемого для описания структуры web-страниц. Вы также научитесь регистрировать сайт на бесплатном сервере (они хорошо подходят для тренировки дизайнеров) и загружать на сайт подготовленные файлы страниц.

Советуем вам почаще обращаться к компьютеру и проверять полученные знания на практике. Это позволит вам быстрее освоить описанные в книге приемы и, может быть, найти собственные пути решения поставленной задачи. В любом случае, как следует освоить рисование, в том числе и на компьютере, можно только путем проб и ошибок.