Компресиране и преоразмеряване на снимките на моят сайт

Компресиране и преоразмеряване на снимките на моят сайт

Тагове: Продуктивност

Никой не обича бавни сайтове. Това може да се дължи на много причини, но най-често за това са виновни снимките на сайта. Снимките са вторият по-големина ресурс на Вашият уеб сайт, които трябва да бъдат компресирани и оптимизирани. За да проверите кои са най-големите и тежки ресурси на Вашият уеб сайт , можете да ползвате LightHouse в браузъра Chrome или PageSpeed Insights на Гугъл.  Други инструменти с които можете да проверите скоростта на зареждането на Вашият уеб сайт са: 

Имате предвид че в зависимост от местоположението на сайта и сървъра, които проверя скоростта на зареждане, може да получите значително различни резултати. Например за уеб сайт, които се намира на сървър в София, се проверява от сървър в Австралия, оценката няма да бъде много добра. 

Скоростта на зареждане на Вашият уеб сайт също се използва при класирането на резултатите в Гугъл. Колкото по-бавно се зарежда Вашият уеб сайт толкова по-голяма вероятността потребителя да напусне сайта. Добра практика е да не качвате много големи снимки (например 4МБ снимка).  

Оптимизиране на снимките можете да направите когато те заемат място не по-голямо от техните размери на страницата. Например ако имате слайдшоу на сайта си , не слагайте огромни снимки (например 4000 x 3000 пиксела).

Онлайн инструменти за компресиране на снимки

1. Google Squoosh - много лесен за ползване , натиснете иконката снимка или влачете и пуснете снимката върху цикламения кръг. 


В долния десен ъгъл са настройките за компресия. Тук можете да видите, че дори при настройки по подразбиране, ще постигнете голяма компресия.

Можете да промените качеството "Quality", за по-голяма компресия. За максимална компресия можете да изберете различни формати от падащото меню (под заглавието "Compress"). 

Преоразмеряване на снимки с  Google Squoosh

Можете да преоразмерите снимка като натиснете плъзгащия бутон "Resize". След това в полето "Width" въведете необходимата ширина и в "Height" височина. Имайте предвид че когато запазването съотношението на снимката е активно "Maintain aspect ratio", съответно височина или ширината ще се обновят автоматично. Ако желаете да промените както ширината, така и височината трябва да махнете отметката за  запазване на съотношението на снимката "Maintain aspect ratio".

В зависимост от изображението, за снимки можете да изберете WebP. За графики е препоръчително GIF. За снимките с прозрачност е добре да се използва PNG. С формата WebP и компресия 60% , можахме да постигнем компресия от 71% до 21КБ , като оригиналната снимка е 77КБ. За да свалите компресираната снимка, след като сте избрали настройките за компресия на снимката, натиснете долу в дясно синия бутон със стрелка на долу.

2. TinyPNG - чудесен за компресия на PNG снимки. Можете да компресирате до 20 снимки едновременно като всяка снимка може да бъде максимално 5МБ. Натиснете или влачете снимките до оградения правоъгълник с пунктирана линия. Когато приключи компресията ще имате възможност да свалите всички снимки наведнъж или да ги запазите в DropBox.

 

3. ShrinkMe - друг безплатен онлайн инструмент за компресия на снимките с минималистичен дизайн. Натиснете или влачете снимките до оградения правоъгълник с пунктирана линия. След завършване на компресията, натиснете бутона "Save", за да свалите вашите снимки.

Има много различни инструменти за компресиране на снимки с различни цели. Ние предоставяме няколко, които са най-лесни за използване.


00