Photoshop for WEB
Все больше людей обращаются к Всемирной паутине. Некоторые ищут необходимые для работы научные данные, другие — результаты футбольных матчей, электронные варианты художественных книг или рефераты. Спектр представленной в Интернете информации очень широк. Однако в большинстве случаев доступ ко всему многообразию ресурсов осуществляется одним и тем же образом — через web-сайт, на котором представлены какие-либо сведения.Число пользователей Интернета постоянно растет, и многие из них уже не хотят довольствоваться аскетичным оформлением первых сайтов, появившихся в научных центрах и военных организациях. Тогда основную ценность представляло их содержание — информация, а до оформления многим просто не было дела. Теперь все по-другому — пользователей так много, что относительно небольшая их часть ищет научные или технические сведения о технологиях или фундаментальных исследованиях. Большинство людей путешествуют по Сети в поисках товаров для дома, ради общения с друзьями или просто рассматривают красивые картинки. Им важно не столько содержание сайта, хотя и оно не потеряло своего значения, сколько его оформление — внешний вид. Хорошо оформленный сайт привлекает пользователя, даже если его содержание далеко от идеала, а вот для сайта, оформленного неряшливо, приобрести известность может оказаться непросто. Информация и ее представление аудитории стали неотделимы друг от друга. Особенно это касается рекламы и корпоративных сайтов компаний, которые, как правило, ориентированы на продвижение товаров.
Введение
Большинство людей путешествуют по Сети в поисках товаров для дома, ради общения с друзьями или просто рассматривают красивые картинки. Им важно не столько содержание сайта, хотя и оно не потеряло своего значения, сколько его оформление — внешний вид. Хорошо оформленный сайт привлекает пользователя, даже если его содержание далеко от идеала, а вот для сайта, оформленного неряшливо, приобрести известность может оказаться непросто. Информация и ее представление аудитории стали неотделимы друг от друга. Особенно это касается рекламы и корпоративных сайтов компаний, которые, как правило, ориентированы на продвижение товаров.
Форматы исходных и промежуточных изображений
Начиная работу над новой web-страницей, вам придется прежде всего решить, какие графические элементы будут на ней использоваться и откуда эти элементы можно получить. Многие из них, например кнопки или маркеры списков, можно нарисовать самостоятельно, используя графический редактор. В некоторых случаях можно обойтись вообще без графики, воспользовавшись, например, таблицами с цветным фоном и различными начертаниями шрифтов.
Форматы web-графики
В этом разделе книги мы подробно рассмотрим три формата изображений, используемых в настоящее время для сохранения графического оформления web-страниц и для его доставки на компьютер пользователя. Это форматы GIF, JPEG и PNG.
Цветовые режимы и модели
После знакомства с форматами файлов, применяемых в web-дизайне, можно перейти к рассмотрению тонкостей подготовки графического оформления web-страниц. Работая с Adobe PhotoShop, вы, наверное, не раз обращали внимание на то, что и заголовке окна документа, кроме его имени, отображаются различные дополнительные символы.
Сканирование и коррекция изображений
Первая проблема, с которой вы столкнетесь, приступив к работе над оформлением web-страницы, — подбор графического материала. Некоторые элементы вы решите нарисовать самостоятельно, но многое придется искать и добывать да различных источников. Это касается в первую очередь различных схем, чертежей и фотографий. Схемы и чертежи часто выполняются в различных спе-циализированных программах и, следовательно, имеются в электронном виде.
Выделение фрагментов изображения
Очень часто при работе с графикой возникает необходимость выделить какую-либо часть изображения. Это может быть нужно для выборочного применения команды или фильтра, перемещения или удаления объектов, рисования в ограниченной области и многого другого. В этом уроке мы рассмотрим способы создания выделений различной формы, а также методы выделения фрагментов изображений.
Подготовка графических элементов web-страниц
Основными графическими элементами web-сайта являются заголовки, кнопки, маркеры списков и текстуры. Они позволяют придать странице приятный внешний вид и сделать ее удобной для использования. В этом уроке мы рассмотрим основы подготовки этих элементов с использованием Adobe PhotoShop.
Подготовка макета web-страницы в Adobe PhotoShop
Для подготовки web-страницы надо решить две задачи — разработать внешний вид (оформление) и написать HTML-код, реализующий его. В обязанности web-дизайнера часто входит только первая задача — разработка и реализация идеи оформления страницы, отвечающей требованиям заказчика. Подготовка описания страницы на языке HTML во многих фирмах, занимающихся разработкой сайтов, возлагается на плечи специалистов в области web-программирования
Сохранение файлов в форматах GIF и JPEG
Использование форматов GIF и JPEG обусловлено тем, что web-специфика заставляет считаться с таким основополагающим критерием, как размер файла. Все изображения, которые встречаются на web-страницах, упрощенно можно разделить на две группы: фотографии и логотипы. Фотография — многоцветное изображение с непрерывным фоном, логотип — высококонтрастное изображение с текстом, содержащее ограниченное количество цветов.
Подготовка и оптимизация изображений
Программа Adobe ImageReady дополняет Adobe PhotoShop, начиная с версии 5. Она включает в себя не только большинство инструментов редактирования изображений, имеющихся в PhotoShop, но также средства подготовки и оптимизации web-графики. Кроме того, ImageReady позволяет создавать динамические изображения: анимированные графические ссылки и кнопки. В этом уроке мы рассмотрим вопросы подготовки изображений непосредственно в Adobe ImageReady и их оптимизации.
Создание анимированных изображений
Под анимированным изображением в ImageReady понимается последовательность изображений или кадров, каждый из которых отображается на экране определенный промежуток времени, что создает иллюзию движения. Создание анимации, работа с кадрами и их обработка, просмотр и оптимизация анимированных изображений — вот круг вопросов, рассматриваемых в этом уроке.
Карты-изображения в ImageReady
Карта-изображение позволяет сделать или его часть гиперссылкой на текст, другую картинку, мультимедиа-файл или web-страницу. В этом урок,е мы рассмотрим создание карт-изображений, их применение, специфические настройки, просмотр и другие связанные с ними вопросы.
Подготовка анимированных кнопок
Анимированной кнопкой называется область изображения, изменяющая свой вид при выполнении какого-либо действия с помощью мыши. Для определения активной области используется фрагмент нарезки или карта-изображение. Работой с анимированными кнопками управляет соответствующая панель
Экспорт изображений
К экспорту изображений в ImageReady можно отнести несколько групп команд. В первую очередь, это, конечно, команда File Export Original... (Файл Экспорт Оригинала...), затем File Save (Файл Сохранить), File t Save As... (Файл Сохранить как...), File Save Optimized (Файл Сохранить оптимизированное) и File Save Optimized As... (Файл Сохранить оптимизированное как), несомненно, Edit Copy HTML Code (Правка Копировать код HTML) и, наконец, команды Edit Cut (Правка Вырезать) и Edit Сору (Правка Копировать)
Дополнительные возможности ImageReady
К дополнительным возможностям можно отнести просмотр изображений в браузере, переход в другие графические и HTML-редакторы и создание текстур. В этом уроке подробно рассматриваются следующие вопросы: как выбрать браузер для просмотра и что получится в результате выполнения соответствующей команды, как перейти в другое приложение, как и из чего создать подходящую текстуру для фона web-страницы.
Краткий обзор возможностей HTML
Вы уже ознакомились с возможностями и функциями Adobe PhotoShop, которые позволят вам разработать и подготовить к дальнейшему использованию графическое оформление web-сайта. Но сама по себе графика еще не является web-страницей. Для того чтобы страница могла быть представлена пользователям Интернета, она должна быть описана на специальном языке, позволяющем задать нужную структуру документа. Этот язык называется HTML — Hypertext Markup Language — язык разметки гипертекста. При помощи этого языка задается текст, помещаемый на сайте, ссылки на другие документы, расположение Изображений и многое другое.
Структура HTML-документа и форматирование текста
Для того чтобы разработанное вами оформление сайта могло быть представлено на web-странице, то есть чтобы его можно было описать средствами HTML, вы должны уже на этапе подготовки макета учесть особенности верстки страни цы в окне браузера. Сделать это можно, только владея хотя бы основами языка HTML. Поэтому этот и несколько следующих уроков посвящены описанию языка HTML.
Использование списков и таблиц
Если вам нужно представить, например, иерархический список персонала фирмы или узлов какой-либо системы, то в этом случае разбивки текста на абзацы может оказаться недостаточно. К счастью, в состав элементов HTML включены специальные теги, позволяющие формировать иерархические структуры, они так и называются — списки.
Использование изображений
Графические изображения, помещаемые на web-страницу, позволяют сделать ее более наглядной и привлекательной для пользователя. Изображения могут использоваться для вывода на экран графиков, схем или чертежей, представления товаров в электронных магазинах и просто для улучшения внешнего вида сайта.
Ресурсы Интернета и ссылки на них
В Интернете существует множество сайтов. Они различаются оформлением, содержанием, группами пользователей, на которых эти сайты ориентированы, но все они объединены в единую систему, по которой вы можете перемещаться. Для того чтобы обратиться к тому или иному сайту или странице, вы можете задать ее адрес. Но иногда это неудобно или невозможно — адреса бывают достаточно длинными, и набирать их каждый раз было бы слишком утомительно. Да и запоминать полный адрес страницы (его длина может достигать 255 символов) захочется далеко не всем.
Использование фреймов
Очень часто перед разработчиком web-страницы встает задача обеспечить одновременное нахождение на экране нескольких документов. Чаще всего требуется постоянно держать перед пользователем навигационную панель сайта или же какую-либо информацию (например, для сравнения биржевых котировок в различных торговых системах). Разумеется, можно открыть сразу несколько окон браузера, но постоянно переключаться между ними или выстраивать их на экране так, чтобы они не перекрывались, оказывается утомительной задачей.
Размещение web-страниц в Интернете и их реклама
После того как вы подготовите дизайн нового сайта и будут завершены работы по верстке HTML-документов, надо загрузить готовый проект на сервер. Это необходимо для того, чтобы вашу информацию смогли получить заинтересованные пользователи Сети.
WEB Анимация
Существует значительное количество программных продуктов, позволяющих реализовать те или иные методы анимации. В данной книге рассматриваются только наиболее распространенные из них, как простые, так и значительно более сложные, обладающие различными наборами возможностей. Не претендуя на полноту обзора существующих программных продуктов, автор, однако, старался обратить внимание на их отличительные особенности и соответствие современным требованиям.Ориентируясь на читателей, которым уже известны понятия векторной и растровой графики, умеющих работать в операционной системе Windows и устанавливать в ней приложения, а также работать с их справочными системами, автор старался создать достаточно компактный курс, позволяющий познакомиться с основами анимации и возможностями различных программ. Это даст возможность читатель в дальнейшем грамотно выбрать подходящий программный продукт в соответствии с задачей, стоящей перед ним, добиваясь требуемого результата с минимумом усилий и затрат.
Введение
Ориентируясь на читателей, которым уже известны понятия векторной и растровой графики, умеющих работать в операционной системе Windows и устанавливать в ней приложения, а также работать с их справочными системами, автор старался создать достаточно компактный курс, позволяющий познакомиться с основами анимации и возможностями различных программ. Это даст возможность читатель в дальнейшем грамотно выбрать подходящий программный продукт в соответствии с задачей, стоящей перед ним, добиваясь требуемого результата с минимумом усилий и затрат.
Особенности GIF-анимации
Компьютерная анимация состоит из последовательного ряда рисунков (кадров), быстро сменяющих друг друга. Если каждый из рисунков незначительно отличается от предыдущего и последующего, то при их воспроизведении создается иллюзия движения. Раньше художники-мультипликаторы рисовали каждый кадр вручную, но теперь появилась возможность автоматизировать этот процесс с помощью компьютеров. Основной характеристикой анимации является число кадров, использованных для ее создания.
Интерфейс Animation Shop 3
Окно Animation Shop содержит следующие основные элементы, предназначенные для выполнения определенных функций. Строка Title Bar (Заголовок окна) является стандартной и включает значок Animation Shop, название приложения и имя файла активной анимации, а также стандартные кнопки Windows для управления окном. Ниже расположена Menu Bar (Строка меню) с заголовками раскрывающихся меню команд.
Интерфейс Adobe ImageReady 3.0
Это не только строки заголовка и меню, а также целый комплект инструментов и палитр для создания и редактирования различных объектов, в том числе слоев и масок. К командам меню могут быть добавлены новые команды и фильтры, разработанные третьими фирмами и представленные в виде дополнительных (plug-in) модулей. Палитра инструментов (Tools) позволяет создавать, редактировать и просматривать изображение, а также выделять его области.
Интерфейс Macromedia Flash 5
При открытии окна приложения Flash 5 на экране появляются следующие элементы интерфейса: Stage (рабочий стол) — область для компоновки отдельных кадров, создания композиции из графических элементов или импортированных точечных изображений и просмотра результатов анимации; Timeline (ось времени) — окно, содержащее список отдельных слоев с расположенными на них графическими объектами и их распределением во времени (на оси времени отмечен каждый кадр фильма);
Интерфейс Corel R.A.V.E. 2.0
Центральное положение занимает окно с рабочей областью (Stage), предназначенной для создания композиции каждого отдельного кадра и просмотра результатов анимации. Вокруг окна кроме строки меню и стандартной панели инструментов расположены также: панель свойств (Property bar) — плавающая панель, элементы которой задают параметры текущего выбранного инструмента;
Интерфейс After Effects 4
После запуска программы открывается ее рабочее окно, в котором размещены: окно Project (окно проекта, по умолчанию озаглавленное UNTITLED. АЕР), палитры —Tools (палитра инструментов), Info (информационная палитра), Time Controls и Audio (совмещенные палитры управления воспроизведением и звуком). Работа начинается с импорта в проект исходного материала, называемого заготовками (footage).
Заключение
Поистине необъятное поле деятельности открывается перед аниматорами, когда они создают не плоские, а трехмерные сцены в одной из программ ЗВ-моделирования. Будучи по своему характеру близкой к кукольной мультипликации, анимация в этих программных средствах, тем не менее, обеспечивает гораздо более широкие возможности и для управления героями, и для использования различных эффектов освещения, и для организации движения съемочной камеры. Однако результирующие файлы таких сцен имеют значительный размер, что не позволяет широко использовать их на Web-страницах.
Основы тележурналистики и телерепортажа
Определение репортажа. Событийный (новостной) репортаж. Информационный (проблемный) и аналитический репортажи. Тема. Подводка ведущего. Текст. Основные принципы подготовки текста. Структура и композиция телерепортажа. Временные обстоятельства. Указание источников информации и цитирование. Числительные и имена собственные. Аббревиатуры. Закадровый текст. Stand up и синхрон в репортаже. Рэпэраунд. Интершум. Использование интершума как выразительного средства. Съемки интервью (синхрона) с помощью переводчика. Подготовка сюжета. Организация съемок Аккредитация. Взаимодействие корреспондента и оператораОсновы фотографии
Все современные компактные цветовые фотоаппараты, с одной стороны, очень простые, а с другой — невероятно сложные. Если вы фотографируете с использованием одного из "автоматических" режимов, работа с цифровым фотоаппаратом окажется довольно простой, а качество получаемых фотографий при этом будет достаточно высоким. Однако многие современные модели цифровых фотоаппаратов обладают целым рядом сложных возможностей, которые вам обязательно следует изучить, чтобы работать более эффективно: часто благодаря именно этим возможностям вы и получаете отменные фотографии! Умение использовать специальные возможности фотоаппарата позволит вам значительно повысить качество получаемых фотографий.Как вы фотографируете сейчас? Используете ли вы один их автоматических режимов? Известно ли вам назначение различных специальных возможностей своего фотоаппарата? Действительно ли вы понимаете взаимосвязь между такими характеристиками, как значение чувствительности по ISO, относительное отверстие диафрагмы и скорость затвора? Изменяете ли вы режимы съемки при фотографировании одного и того же объекта? Используете ли разные режимы измерения экспозиции, изменяете ли точки фокусировки, применяете ли фиксацию экспозиции? Если нет, то непременно будете удивлены, насколько возрастет ваш профессиональный уровень после того, как вы овладеете всеми пятьюдесятью приемами, описанными в настоящей книге.
Несколько слов о фотографиях
В отличие от большинства книг по фотографии, изданных в последнее время, настоящее издание адресовано исключительно владельцам компактных цифровых фотоаппаратов. В данной книге не содержится информации о пленочных и цифровых зеркальных фотоаппаратах. Мы не привязывались к определенной марке или даже модели циф-ровнх фотоаппаратов — книга посвящена всем моделям компактных цифровых фотоаппаратов.
Сделайте несколько снимков
После первого знакомства с руководством пользователя сделайте несколько снимков. Сфотографируйте объекты, расположенные поблизости: собаку или кошку, сидящую в дальнем углу комнаты, людей, прогуливающихся по тротуару, который виден из окна. и т.д. Попробуйте задать несколько комбинаций параметров съемки.
Съемка в помещении
Независимо от того, живете вы в небольшой квартире или огромном доме, в сельской местности или на двадцатом этаже высотного дома, вы всегда найдете, что снимать. Преимущество съемки в помещении состоит в том, что вы оказываетесь близко к своему компьютеру. Это означает, что вы можете сфотографировать, потом загрузить фотографии в компьютер, оценить их, снова сфотографировать и вновь оценить.
Знакомство с гистограммой
Как правило, цифровые фотоаппараты, поддерживающие использование гистограмм, также поддерживают функцию "предупреждения о ярких оттенках". Это очень удобная функция. При просмотре полученного изображения на ЖК-экране все яркие части изображения, которые оказались просто белыми, мерцают.
Ответьте на некоторые вопросы
Этой характеристике следует придать наибольшее значение. В конце концов, использование штативной головки, которая постоянно шатается, является просто бесполезным. Однако нам приходится расплачиваться за устойчивость не только деньгами, но и массой. Тип. Одно из первых решений, касающихся выбора штативной головки, связано с тем, что вы должны четко определить: штативная головка какого именно типа вам необходима.
Планирование снимка
Начните с того, что просто поговорите с человеком, портрет которого вам необходимо получить. Обязательно поинтересуйтесь, как именно будет использоваться портрет, Затем продумайте вопрос освещения. Благодаря этому вы сможете правильно подобрать источники света и материалы для оформления помещения.
Выбор места съемки
Если вы планируете фотографировать на улице, выберите режим приоритета диафрагмы и задайте максимальное значение относительного отверстия диафрагмы. В зависимости от условии освещения максимальное значение относительного отверстия диафрагмы обеспечит максимальную скорость затвора, что позволит получить четкую фотографию даже в том случае, если ваш любимец будет двигаться во время съемки.
Выбор дня и времени для съемки
Облака могут казаться очень глубокими и располагаться прямо над линией горизонта, полностью скрывая солнце во время рассвета или заката. Лучшее время для съемки "восхода солнца" — минут за пятнадцать до восхода или часа два спустя заката.
Алгоритмы cжатия изображений
В основную программу курса входит широкий круг вопросов: от графических примитивов до построения фотореалистичных изображения.В этом пособии детально рассматриваются алгоритмы сжатия изображений. При этом изложены классические, давно известные алгоритмы, такие как групповое кодирование, LZW сжатие, кодирование по Хаффману. Рассмотрен в рамках курса и сравнительно недавно появившийся алгоритм JPEG.
Отдельное внимание уделено новым алгоритмам, таким как рекурсивное сжатие и фрактальное сжатие изображений. Рассмотрены вопросы корректного сравнения алгоритмов компрессии изображений и вопросы построения мер оценки потерь качества изображения.
Общие положения алгоритмов сжатия изображений
Изображения (как и видео) занимают намного больше места в памяти, чем текст. Так, скромная, не очень качественная иллюстрация на обложке книги размером 500x800 точек, занимает 1.2 Мб — столько же, сколько художественная книга из 400 страниц (60 знаков в строке, 42 строки на странице). В качестве примера можно рассмотреть также, сколько тысяч страниц текста мы сможем поместить на CD-ROM, и как мало там поместится качественных несжатых фотографий. Эта особенность изображений определяет актуальность алгоритмов архивации графики.
Color Management System
На вопрос: "Что такое цвет?" — чаще всего отвечают: "Цвет — это длина волны", "Цвет — это свойство поверхности", "Цвет — это спектральный состав электромагнитного излучения". Ответы эти неточны или, как минимум, неполны. Рассмотрим их подробнее. "Цвет — это длина волны" — но электромагнитное излучение с длиной волны, к примеру, 675 нМ в зависимости от интенсивности воспринимается либо как красно-коричневый, либо как алый цвет. "Цвет — это свойство поверхности" — но серые стены домов, освещенные закатным солнцем, кажутся нам оранжевыми. "Цвет — это спектральный состав электромагнитного излучения" - но электромагнитное излучение различного спектрального состава может восприниматься как один и тот же цвет.
