Научитесь изменять размеры веб-изображений для более быстрой загрузки

Веб-изображения занимают большую часть времени загрузки на большинстве веб-страниц. Но если вы оптимизируете свои веб-изображения, у вас будет более быстрая загрузка сайта. Есть много способов оптимизировать веб-страницу. Единственный способ улучшить вашу скорость — сделать вашу графику как можно меньше.

Хорошее практическое правило — стараться, чтобы размер отдельных изображений не превышал 12 КБ, а общий размер вашей веб-страницы, включая все изображения, HTML, CSS и JavaScript, не должен превышать 100 КБ, а оптимально — не более 50 КБ.

Чтобы сделать вашу графику как можно меньше, вам нужно иметь графическое программное обеспечение для редактирования изображений. Вы можете получить графический редактор или использовать онлайн-инструмент, такой как Photoshop Express Editor.

Вот несколько советов по оценке ваших изображений и уменьшению их размера:

Изображение в правильном формате?

В Интернете есть только три формата изображений: GIF, JPG и PNG. И у каждого из них есть определенная цель.

  • GIF—Используйте формат GIF для плоских цветных изображений. Это изображения с несколькими цветами.
  • JPG—Используйте формат JPG для фотографических изображений. Это изображения с миллионами цветов.
  • PNG—Используйте формат PNG, если вам не нужны ваши изображения для показа на мобильных устройствах. Они хороши как для плоских цветных, так и для фотографических изображений. Лучше всего сохранять изображения в формате PNG и JPG или GIF, а затем использовать версию, которая меньше.

Каковы размеры изображения?

Простой способ сделать ваши изображения меньше, сделать это, сделать их меньше. Большинство камер снимают фотографии, которые намного больше, чем может отображать средняя веб-страница. Изменив размеры примерно на 500 x 500 пикселей или меньше, вы создадите изображение меньшего размера.

Изображение обрезано?

Следующее, что вы должны сделать, это убедиться, что изображение обрезано настолько плотно, насколько это возможно. Чем больше вы обрежете изображение, тем меньше оно будет. Обрезка также помогает определить предмет изображения, удаляя посторонние фоны.

Сколько цветов использует ваш GIF?

GIF-изображения представляют собой плоские цветные изображения, и они включают в себя индекс цветов, присутствующих в изображении. Однако индекс GIF может включать больше цветов, чем на самом деле отображается. Сокращая индекс только до цветов на изображении, вы можете уменьшить размер файла.

Какая настройка качества установлена ​​для вашего JPG?

JPG имеют настройку качества от 100% до 0%. Чем меньше значение качества, тем меньше размер файла. Но будь осторожен. Качество влияет на то, как выглядит изображение. Так что выбирайте параметр качества, который не слишком уродлив, сохраняя при этом размер файла низким.

Ссылка на основную публикацию