В каком качестве подключать изображения на сайт?

Добрый день.

Быстренько пробегусь с самого начала: сделал landing page, разметил его гридами, наладил адаптивность.
Когда все было готово, начал подключать в гридовские блоки изображения. И очень заметно как сайт начал подвисать. Из-за того, что подключил 5 изображений в очень высоком качестве и разрешении.

Собственно, вопрос: в каких форматах, в каких расширения сохранять изображения, чтобы они сильно не загружали?
  • Вопрос задан
  • 255 просмотров
Пригласить эксперта
Ответы на вопрос 3
lukoie
@lukoie
1 для полноцвета - jpg, но не png и наоборот
2 компрессия jpg тоже решает. Стандартных 65% может вполне хватать. Сравнивайте с 80% визуально.
3 сохранение в фотошопе в "save for web" дает лучше результат чем просто сохранение
4 картинки делайте 1в1 в пикселях как оно будет на сайте. 2х для ретины, Только если это для полноэкранных картинок или на полную ширину окна то ставьте фуллшд разрешение.
5 если сайт хостится не на ссд а на хдд, то тоже может дать результат вынесение изображений в сидиэн облако.
Ответ написан
@McBernar
https://tinypng.com — оптимизация PNG.
До 70% без заметной потери качества. Я прогоняю дважды.

Изображения в 2х от нужного размера. Нужно 100 — берите 200.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы