среда, 27 июня 2012 г.

Требования к изображениям для Web-страниц

Вопросы:
  • Добавление на страницу изображений.
  • Обзор типов файлов иллюстраций. 
  • Форматы JPEG, GIF, PNG и др. 
Вставка в html-документ осуществляется за счёт тега <img>.

Атрибуты тега <img>

src - указывает путь к файлу, который может быть как относительным (отсчитывается от местоположения текущего документа) или абсолютным( пример: http://rvach.blogspot.com/images/image.png)
lowsrc -  путь к файлу худшего качества, который загружается перед загрузкой полноразмерной картинки
alt и title - адьтернативный текст для картинки, используется в кач-ве всплывающей подсказки и поисковыми системами при индексации документов
border - толщина рамки вокруг изображения
hspace и vspace - горизонтальный и вертикальный отступ от изображения до текста
height - высота изображения
width - ширина изображения
align - определяет выравнивание и способ обтекания текста (middle, top, left)

Форматы изображений

Стандартными форматы файлов для Интернета являются JPEG (JPG), GIF и PNG. Именно они выбраны в связи с высокой степенью сжатия изображений. Вместе с тем, каждый из форматов имеет свои особенности, достоинства и недостатки, что и обусловливает сферу их применения. 

JPEG - Joint Photographic Experts Group. Файлы, содержащие данные JPEG, обычно имеют расширения (суффиксы) .jpeg, .jfif, .jpg, .JPG, или .JPE. Однако из них .jpg является самым популярным на всех платформах.
Формат JPEG Самый «молодой» формат. Позволяет сохранять полноцветные изображения с количеством цветов до 16,7 миллионов. Использует сжатие с потерями информации, за счет чего размер файла значительно уменьшается без видимой потери качества изображения. Поддерживает прогрессивную развертку, когда изображение появляется вначале с плохим качеством, и в процессе загрузки постепенно улучшается, чтобы до полной загрузки изображения уже можно было приблизительно понять суть рисунка и решить, продолжать ли скачивание. Лучше всего JPEG подходит для хранения фотографий и других изображений, содержащих большое количество цветов, плавные цветовые переходы и мелкие разноцветные детали.

GIF - Graphics Interchange Format. Формат GIF Поддерживает не более 256 цветов, поэтому на фотографии с плавными переходами и едва уловимыми оттенками цвета после преобразования в формат GIF все будет гораздо хуже – она приобретет неестественный вид. GIF использует формат сжатия LZW. Таким образом, хорошо сжимаются изображения, строки которых имеют повторяющиеся участки. В особенности изображения, в которых много пикселей одного цвета по горизонтали. Сжатие происходит без потери качества. Поддерживает чересстрочную развертку для того, чтобы еще до полной загрузки изображения уже можно было приблизительно понять суть рисунка и решить, продолжать ли его скачивание. Поддерживает прозрачность фона изображения. Это удобно в том случае, когда изображение будет помещено на Web-странице поверх фонового рисунка (обоев страницы). Имеет возможность сохранения в одном файле нескольких изображений, что находит свое применение при изготовлении анимированных картинок. Ограничен к использованию лицензионными правилами. Формат GIF незаменим для изображений с большими однородными областями, текстовых картинок, логотипов, иллюстраций с четкими краями, а также для анимированные рисунков.

PNG - Portable Network Graphic (PNG) – формат растровых графических файлов, аналогичный формату GIF, но более современный (1995 г.) и не имеет лицензионных ограничений. Также, кроме прозрачности поддерживает полупрозрачные пикселы за счет α-канала с 256 градациями серого.