Учебно-методическое пособие. Казань: Изд- во
.5. Оптимизация изображения для размещения в сети Интернет
жүктеу/скачать 2.72 Mb. Pdf көрінісі
|
- Бұл бет үшін навигация:
- Параметры JPEG 1 2 3 Рис.3.11. Диалоговое окно Параметры JPEG
| 2
.5. Оптимизация изображения для размещения в сети Интернет Файлы, содержащие изображения на страницах WWW, для пересылки по электронной почте или даже в документах Word или презентациях, размещенных в сети Интернет должны быть небольшими по размеру. И в тоже время эти файлы должны быть приемлемого качества. Оптимизация - процесс выбора такого формата файла, размеры и цветовые параметры которого позволяют в максимально возможной степени сохранить качество изображения, но при этом обеспечить высокую скорость загрузки его по сети. Кроме соответствующего выбора размера изображения, надо прежде всего определиться в каком формате лучше всего будет сохранить нужное изображение (см. главу 1.6, пункты 1.6.4, 1.6.5.). Затем, чтобы сохранить хорошее качество изображения в процессе оптимизации надо применять или наоборот отключать некоторые приемы улучшения качества, такие, как сглаживание. Функция сглаживания смешивает границы объекта с фоном. Смешивание достигается путем добавления вдоль границы объекта точек с постепенно уменьшающимся уровнем непрозрачности. При компоновке изображений в программе Photoshop сглаживание помогает смягчить резкие переходы от одной фигуры к другой. Если не использовать функцию сглаживания, изображение будет выглядеть более четко, так как граничные пикселы не будут смешаны с фоном. Если выделить некоторую область при включенной опции сглаживания, то вместе с объектом выделятся и точки фона, расположенные рядом с границей изображения. Если скопировать и вставить такую область в изображение, расположив ее на однотонном фоне, то станет видна окантовка из присоединенных точек. Чтобы этого не случилось, прежде чем выделять область, нужно снять флажок Сглаживание (Anti- aliased) на панели опций инструментов выделения, Лассо (Lasso) или Волшебная палочка (Magic Wand). Также можно воспользоваться опцией Matte (Кайма) указывает, каким образом будут интерпретироваться частично прозрачные точки (те точки, которые появляются при сглаживании) в форматах GIF и JPEG. Средства управления каймой и сглаживанием позволяют удалить нежелательные ореолы вокруг изображений Если мы работаем с фотографией и выбрали формат JPEG, то при сохранении в этом формате (например, командой Файл – Сохранить как в диалоговом окне Сохранить как при выборе в поле Тип файлов JPEG(*.JPG;*JPEG;*.JPE) – кнопка Сохранить) в диалоговом окне Параметры JPEG требуется указать параметры качества (см. рис.3.10) из следующего списка низкое (качество 3); среднее (качество 5); высокое (качество 8); наилучшее (качество 12). Вместо этого выбора можно воспользоваться ползунком 1. Для фотографий наименьшее приемлемое – среднее (качество 7). При включенном флажке Просмотр (2 на рис.2.10.) в окне изображения отображаются все изменения, которые происходят вследствие оптимизации. Также динамика оптимизации отражается в панели Размер (3 на рис.2.10.), где выводится размер файла в килобайтах и время загрузки файла в секундах при указанной рядом справа скорости загрузки информации из сети. Например, при размере изображения 45,43К и доступе в Интернет через модем со скоростью 56,6 Кбит/с оно загрузится за 8,02 секунд. 33 Но наиболее удобно оптимизировать изображения форматов JPG и GIF с помощью выбора Файл - Сохранить для Web (Save for Web) в диалоговом окне Save For Web . Данной командой можно оптимизировать не только одну фотографию или рисунок, но и выполнить процесс формирования html-документа (макета) вместе с оптимизацией фрагментов изображения на основе обработки последнего инструментом Раскройка (разделении на фрагменты). Это обычно делается при подготовке дизайна для размещения сайта в сети Интернет. Рассмотрим на примере процесс оптимизации в последнем окне одного изображения lilia.jpg (см. рис. 2.11). В данном окне есть возможность выбора количества панелей для визуальной оценки изображения с помощью вкладок 1, а точнее Original (вывод в одной панели исходного изображения), Optimized (вывод в одной панели оптимизированного изображения), 2-UP (вывод в двух панелях исходного и оптимизированного изображения), 4-UP (вывод в четырех панелях исходного и трех вариантов оптимизированного изображения), Выбрав опцию 4-Up (4 варианта), можно предварительно просмотреть несколько версий изображения с различной степенью сжатия и принять решение о наиболее приемлемой степени уплотнения, сопоставив размер файла с качеством Рис.2.10. Диалоговое окно Параметры JPEG 1 2 3 Рис.3.11. Диалоговое окно Параметры JPEG 1 2 3 34 изображения. Кроме того, в этом окне расположены таблица цветов Color Table 2 и средства управления форматом 3, каймой Matte 4, качеством изображения Quality 5, добавления эффекта размывания Blur 9 и др. Также имеется меню Preview (Предварительный просмотр) 6 и кнопка Preview in [browser] 7 (Предварительный просмотр в [браузер]). Файлы в формате JPEG также могут быть оптимизированы с использованием формата Progressive 8 JPEG, поддерживаемого браузерами Nestcape Navigator и Internet Explorer (версия 4.0 и выше). При загрузке на Web-страницу картинки в таком формате детализация изображения увеличивается постепенно. Из рис. 2.11 видно, что было выбрано качество 49 при размере файла 11,61К для изображения lilia.jpg. Нажатие кнопки Save откроет диалоговое окно Save Optimized As, в котором через выбор из списка в поле Тип файла (Только изображения (*.gif), HTML и изображения (*.html), Только HTML (*.html)) имеется возможность сохранить не только изображение, но и html-код размещения этого изображения в web-документе, а также задать местоположение и название сохраненных файлов. Для файла в формате GIF определяющим понятием является понятие глубины цвета. Это понятие определяется количеством цветов, используемых в изображении. При уменьшении глубины цвета уменьшается количество цветов, что приводит к уменьшению размера файла и ускорению его загрузки по сети. С уменьшением количества цветов границы областей изображения могут стать ступенчатыми, а цвета - более скучными, но при этом получается файл меньшего размера. Данные о зависимости количества цветов и глубины цвета приведены в табл. 2.1. |