В– · Оптимизиране на изображенията в мрежата ‡ ’гЂђ Без загуба на качество

❗ Това е процес, който може да бъде малко скучен (ако се извършва ръчно), но е важно да го направите, за да избегнете това се влияе от скоростта на зареждане на вашия уебсайт.

Ето съдържанието с всичко, което ще видите в статията 👇👇 .

Съдържание

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

Тук ви оставям цялата публикация, обобщена във видео.

📺 Видео урок

✅ Как да преоразмерите уеб изображенията до идеалния размер

Първата стъпка за оптимизиране на изображенията е да ги преоразмерите.

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

Не качвайте снимките си в «Full HD» с извинението, че «- Това е, за да изглежда добре».

Не създавате банка изображения с вашите посещения за изтегляне.

Практически случай:

Ако искам да поставя изображение в страничната лента на моя блог, първо трябва да разбера колко широка е страничната лента.

Да предположим, че страничната лента има ширина 250 px.

Това означава, че дори да кача по-голямо изображение, то ще бъде с ширина 250 px, така че губя останалото и единственото нещо, което мога да направя, е да увелича размера на страницата.

За разберете какви размери да използвате Препоръчвам да използвате «Element Inspector» на Chrome. Във видеото ви показвам как се прави.

След като знаете размерите, можете да ги преоразмерите с програми като Paint, Photoshop или Gimp. Във видеото обяснявам как да го направя с Photoshop.

🔹 Инструменти за масово преоразмеряване на изображения

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

За да преоразмерявате изображенията масивно, препоръчвам някои от тези инструменти.

JPEG Resizer 2.1

загуба

JPEG Resizer 2.1 е безплатна програма за Windows, която не изисква инсталация. Просто трябва да го стартирате.

Позволява ви да преоразмерявате изображенията според:

  • Най-дългата страна: коригирайте най-дългата страна според размера, който посочвате, тя ще запази пропорциите, без да се изкривява.
  • Задава максимален размер за ширина или височина.
  • Задава точен размер за ширина и височина.
  • Или намалете изображението с процент.

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

Снимки в насипен размер

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

Преоразмерете изображенията в мрежата с Photoshop

Следвай тези стъпки:

Отворете снимката, която искате да компресирате, и отидете на «Файл» -> «Запазване за мрежата»:

Ще видите следния прозорец.

Тук можете да направите няколко неща:

  • Променете размерите на изображението. Препоръчвам да направите това, преди да го запазите за мрежата.
  • Изберете формата: jpeg, png или gif.
  • Регулирайте качеството на изображението.

Препоръчвам да запазите изображенията в JPEG форматВ с качество приблизително 70 и за изображения, които се нуждаят от прозрачност тъй като логата използват PNG формат.

🔨 Инструменти за оптимизиране на изображенията онлайн

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