Реклама

Сжимаем изображение

Сжимаем изображение

Доброго времени суток посетители моего блога Красбакс.ру. Решил написать статью об оптимизации блога или сайта с помощью оптимизации картинок. Так как многих раздражает очень медленная загрузка проекта.  При чём дело может не обстоять в кодах. И так начнём с примеров.

Вы к примеру загружаете картинку на свой проект и не задумываетесь о том что нагрузка идёт на сервер где распаложен ваш ресурс. Вы как ни в чём не бывало грузите например формат png который занимает много места. Если этот файл превратить в jpg и избавить немного качества?

Этот этап нужен как ни когда. Первым делом открываем фотошоп и вгружаем свой файл картинки. Далее вам нужно изменить немного формат. Смотрите на скриншоте и вы поймёте как. Кстати данный урок создан с фотошоп 5 и да не забывайте поменять размер изображения на тот размер который вам необходим.

Сжимаем изображение

Я не стану загружать оригинал картинки на страницу так как вешает оно много. Кстати размер у неё такой:  1024×768  и вешает она 199 кб. Изменил я его на немного другой 400×300 вес начал составлять всего 54.1 кб.

Вы можете сохранить и в другом качестве но это влияет на качество картинки. Стандартно при сохранении стоит 8. Как вы видите изображение будет вешать 54.1 кб.

1

При желании можете ещё добавить немного коррекции.

Сохраняйте материал и не спешите сразу его публиковать. Вам ещё нужно уменьшить размер картинки.

Переходим на сервис: https://kraken.io и выбираем следующую кнопку

4

После перехода выберете нужный пункт вставки изображения для работы сервиса.

5

Мы загрузили наши изображения и смотрим результат который получился

Сжимаем изображение

Мы получаем: Оригинал был: 54.16 кб Сервис убрал из этих лишних 34.58 кб и получается у нас остаётся 19.58 кб! Кракен сжал аж на 36.16%!!! Качество кстати не изменяется.

01

Теперь вы сможете многократно ускорить ваш проект с помощью этого сервиса. На одну фотографию уходит в среднем 30 секунд. И кстати чтобы не открывать и потом сохранять по одной фотографии вы можете на сервисе накопить пачку и сохранить в zip архиве.

Если у вас есть вопросы по данной методике спрашивайте не стесняйтесь =).

+1
Пин
Рассказать друзьям
Поделится в ОК
Отправить

12 Комментарии

  1. Кракен жутко портит картинки; особенно если вы скармливаете ему PNG-шки! Сам жму утилитой Color Quantizer — там хоть как-то процесс контролировать можно и переключатели цветовых пространств есть.

    • Не замечал там искажения картинок. Кракен один из лучших оптимизаторов изображений.

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

  3. Я сжимаю картинки вот здесь: pixlr.com/editor/ И размер меняю тоже здесь. Аватаном пользуюсь только для текста на картинку.

  4. Доброго вечера суток!! я прочитал данную статью!!! всё понял!! подскажите как мне быть с видео файломи!! так как я щас гружу ина сайт видее и оно вешает очень много как мне сделать чтоб уменьшить размер!!!и возможно ли вобще такое??? а на щёт картинок спасибо как буду грузить зайду к вам ещё разок=)

  5. С фотошопом я не очень дружу. Или, если уж быть совсем честной- совсем не дружу. Сжимаю картинки при помощи Microsoft Office Picture Manager или сервиса Avatan. По сути, результат получается тот же, только все гораздо проще.

    Нет, ну если придираться, то с Avatan получается гораздо лучше и четче.

  6. Спасибо огромное пост, как раз актуален , а то у меня на хостинге всего 100 мб. осталось!
    Как говорится «Люто Плюсую»

  7. Действительно эффективный способ для оптимизации интернет проекта. Я к примеру смогла уменьшить время ответа блога на 0.30 сек! Всем советую воспользоваться этим способом если множество изображений увас.

    Кстати, привет Rencontrez!
    У вас как получилось так ускорить ваш блог? Неужели всё это из-за зжатия изображений?

Оставить комментарий

Ваш электронный адрес не будет опубликован.


*