Сайтостроение

Создание сайта

Раскрутка сайта

Заработок на сайте

...еще о сайтостроении

HTML. Работа с графикой. Изменение размеров изображения

Если графическое изображение хранится в файле и имеет расширение другое, чем gif или jpg, то вам нужно будет выполнить преобразование нестандартного формата изображения в необходимый. Для этого следует воспользоваться услугами одной из многочисленных программ редактирования графики, к примеру, Adobe Photoshop либо Corel PhotoPaint. Графические изображения GIF, что расшифровывается как Graphics Interchange Format, способны содержать 256 цветов и применяются, как правило, для отображения рисунков. В дополнение, этот формат обладает возможностями поддержки анимации и прозрачности. Графические изображения JPEG (JPG), что означает Joint Photographic Experts Group - имеет в своем распоряжении более 16 млн. цветов. Подобный формат применяется для хранения фотографий либо крупных графических изображений. Чаще всего, в процессе конвертации файла в нужный формат .gif или .jpg его размер существенно уменьшается, что содействует увеличению скорости загрузки графического файла.

Задание нужных размеров картинки, при помощи атрибутов HEIGHT и WIDTH, дает возможность браузеру загружать графического файл с ускоренной быстротой. Так как браузер не тратит лишнее время на дополнительные вычисления. Для того, чтобы задать размер графического изображения, этот размер, для начала, надо знать. Определить размер можно, фактически, в любом графическом редакторе. Когда вы пользуетесь приличным html-редактором, то он автоматически показывает размер графического изображения в тексте веб-страницы при выборе нужного графического файла. Еще одним очевидным плюсом задания размеров "ручками" есть тот факт, что пользователи, «вырубившие» в своих браузерах сервис обработки графики, посмотрят ваше творение именно в таком виде, в каком оно задумывалось, потому что области страницы, в которых предусматривается размещение графики определенных размеров, останутся нетронутыми.

Задавая размеры графического изображения, существует возможность увеличить его размеры. Следовательно, можно получить большое графическое изображение, не увеличивая «вес» графического файла и времени, необходимого для его загрузки. Задавая размеры графического изображения, указывайте требуемые значения в пикселях либо процентах относительно существующих габаритов окна браузера. Необходимо подчеркнуть, что не нужно злоупотреблять увеличением размеров, потому что в этом случае картинка получается "зернистой" и ухудшает свое качество. Если значение требуемых размеров задавать в пикселях, нужно применять оба атрибута WIDTH, HEIGHT. Для того, чтобы избежать искажений, надо соблюдать пропорцию. Когда значения задаются в процентах относительно величины окна браузера, достаточно ввести любое значение (высоту или ширину), - все остальное браузер построит автоматически.

Аналогичным методом можно уменьшать графическое изображение. Но здесь существует очевидный недостаток. Время, требуемое для загрузки изображения, остается таким же. То есть картинка загружается до своего первоначального объема, просто она остается в тех рамках, которые вы задаете атрибутами WIDTH, HEIGHT. Следовательно, чтобы уменьшить размеры графического изображения, надо воспользоваться возможностями одной из программ редактирования графических изображений, к примеру, Adobe Photoshop либо Corel PhotoPaint. После окончания редактирования я вам советую создать новый файл и сохранить в нем все внесенные перемены.

Приведем пример с HTML-кодами:

В завершение следует отметить, что обрезка картинки дает возможность удалить ненужные части графического изображения. После обрезки картинки объем файла уменьшается, и соответственно уменьшится время загрузки этого файла.