6 начини да ги оптимизирате сликите за подобри веб перформанси

6 начини да ги оптимизирате сликите за подобри веб перформанси
Rick Davis

Луѓето се визуелни суштества, а истражувањата го поддржуваат тој факт. По само три дена, стапките на задржување на текстот се во опсег од само 10%-20%. Но, за сликите, стапките на задржување може да бидат високи до 65%. Мозокот прима 90% од визуелните информации и ги обработува 60.000 пати побрзо. Без сомнение, визуелните слики играат клучна улога во ангажманот на веб-локацијата.

Сепак, потребно е многу повеќе отколку само да изберете некои слики и да ги поставите околу вашата страница. Тешките слики трошат многу пропусен опсег, забавувајќи ја брзината на вчитување страници. Пребарувачите ќе ги забележат бавните перформанси и ќе ве казнат со низок ранг.

Нашата статија ќе ви покаже шест различни начини за оптимизирање слики за подобри веб перформанси во 2021 година.

Совети за оптимизација на слики за подобри веб перформанси во

Да речеме дека дизајнирате веб-локации за непрофитни организации и сакате да користите многу слики за да ја прикажете својата работа. Донаторите, спонзорите и другите засегнати страни ги користат таквите информации како основа за континуирана поддршка. Меѓутоа, ако не ги оптимизирате сликите, корисничкото искуство и ангажманот ќе страдаат. Најголемиот проблем ќе биде бавното вчитување на страниците и одговорите за истекување.

Оптимизацијата на сликата се однесува на сите чекори што ги преземате за да ја намалите големината, форматот или резолуцијата на датотеките. Можете да го направите ова без да го загрозите квалитетот на сликите.

Ајде да провериме некои од вашитеопции.

Илустрација на маркетинг кампања од Димак Даксина

1. Започнете со ревизија за оптимизација на слики

Ревизијата за оптимизација на слики ќе обезбеди релевантни информации за тоа каде треба да се подобрите.

Започнете со правење попис на сликите што ги имате на вашата страница. Релевантните тестови ќе ги дијагностицираат сите проблеми што треба да ги решите.

На пример, ревизијата може да покаже дека имате премногу слики. Исто така, ќе го прикаже форматирањето на вашата слика и ќе ви овозможи да го одредите следниот начин на дејствување. На пример, отстранувањето или менувањето на форматите на датотеките може значително да ја подобри брзината на вчитување на страницата.

2. Изберете го вистинскиот формат за сликите

Датотеките со слики доаѓаат во различни формати. Ова се трите најчести типови на формати на слики за веб-апликации што треба да ги знаете:

  • PNG има предност што е слика со многу висок квалитет. За жал, за да се постигне ова, големината на датотеката е многу голема. Тие работат добро за едноставни слики и логоа и овозможуваат компресија без загуби.
  • JPEG-овите се најчести на повеќето веб-локации. Тие се одлични за сложени, шарени слики. Сепак, ќе треба да бидете внимателни кога ги компресирате JPEG сликите бидејќи може да резултира со губење на јасност, колку сликата станува помала. Некои луѓе го нарекуваат ова како со загуби.
  • GIF работи за анимации, мали икони и слики со ниска резолуција. Овозможува компресија без загуби, но можете да користите самодо 256 бои.

Зачувај икони од Андреас Сторм

Исто така види: Скршете го Интернетот: Зголемената популарност на уметноста со грешки

3. Променете ја големината и компресирајте ги сликите

Можеби сте забележале дека сликите изгледаат како да се вчитуваат малку по малку. Ќе помине некое време пред да ја видите целосната слика; знак дека сликите се веројатно премногу тешки. Промената на големината или компресирањето ќе го реши проблемот.

Ве молиме имајте предвид дека не треба да поставувате слики пред да ги оптимизирате. И за најдобар квалитет, целјте датотеките да бидат во опсег од 1 до 2 MB.

Користете ја алатката за сечење за да ја промените големината на сликите. Тоа помага да се намали големината на датотеката, што резултира со подобра брзина на вчитување на страницата. Имате тони алатки достапни за ваша употреба.

Компресирањето слики помага да се намали големината на датотеката. Но, можете да ја искривите сликата ако ја компресирате премногу. Ниската компресија може да биде идеална ако сакате да го задржите квалитетот на сликата; сепак, не ја намалува значително големината.

Видови компресии

Постојат два концепта што веќе ги споменавме погоре, компресија без загуби наспроти загуби.

  • Компресијата без загуби го одржува квалитетот на сликата додека ги отстранува непотребните метаподатоци.
  • Компресијата со загуби ја намалува големината на датотеката со ослободување од некои од елементите. Може да го загрози квалитетот на сликата. Сепак, можеби нема да ја забележите разликата. Значи, сепак може да биде одличен начин за компресија на слики.

Вистинскиот уредувач на слики ќе ви помогне да одредите којкомпресија работи најдобро за вас.

4. Оптимизација на слика на прво место на мобилен

Сите чекори што ги преземате мора да ја следат стратегијата за оптимизација за мобилни телефони, бидејќи Google се префрли на првото рангирање на мобилните. Сликите треба да изгледаат исто на кој било мобилен уред како и на кој било десктоп уред. Огромна количина на интернет сообраќај доаѓа преку такви уреди.

Ако корисниците не се ангажирани со добар UX кога користат мобилни уреди, ќе ги изгубите.

Размислете за оптимизирање на сликите за мобилни пред се. Ако изгледа добро на малиот екран, ќе изгледа фантастично на десктоп или лаптоп.

ASO оптимизација од Abbi_Kerimov

5. Имињата на датотеките и нивното влијание врз SEO

Оптимизацијата на сликата исто така бара да обрнете внимание на тоа како ги именувате датотеките. Сите активности што ги преземате треба да имаат за цел да ја подобрат видливоста на пребарувачите. Кога поставувате или фотографирате, уредот автоматски ќе му даде име на датотека. Ова име обично се состои од случаен код или броеви. Можеби изгледа нешто како 2224444.jpg.

Прикачувањето на сликата како што е на вашата веб-локација воопшто нема да им помогне на пребарувачите.

Олеснете им на веб-роботите да ве најдат со доделување описни етикети на секоја слика. Вклучете релевантни клучни зборови кои даваат информации за вашиот бизнис или страница.

6. Размислете за користење на мрзливо вчитување

Мрзливото вчитување на сликите е токму како што сугерира името. Наместоцелата слика се вчитува одеднаш, некако се расплетува. Сликата продолжува да се вчитува колку повеќе онлајн посетителот се движи надолу по страницата.

Мрзливото вчитување го открива само она што е релевантно во тој момент. Ќе заштедите на пропусниот опсег бидејќи нема да користите непотребни ресурси.

Исто така види: Тимот зад режимот на скица за автоматско следење на 4.6

Вчитувам... од Дона

Завршни мисли

Веб перформансите се критичен фактор за рангирање што го користат пребарувачите. Google ќе го казни вашиот сајт ако брзината на вчитување на страницата е мала.

Многу фактори ја одредуваат брзината на страницата, а наредбите за употреба на сликата на една од првите позиции. Ако не ги оптимизирате сликите, вашите веб перформанси ќе страдаат. Страниците полека ќе се вчитуваат, а корисничкото искуство и ангажманот нема да бидат добри.

Изберете го вистинскиот формат на слика. Следно, користете техники како промена на големината и компресирање за да ја намалите големината на датотеката. Закажете редовни тестови на страници и ревизии на страницата за да ја проверите работата на страницата.




Rick Davis
Rick Davis
Рик Дејвис е искусен графички дизајнер и визуелен уметник со повеќе од 10 години искуство во индустријата. Тој има работено со различни клиенти, од мали стартапи до големи корпорации, помагајќи им да ги постигнат своите дизајнерски цели и да го подигнат својот бренд преку ефективни и влијателни визуелни слики.Дипломиран на Факултетот за визуелни уметности во Њујорк, Рик е страстен за истражување на новите дизајнерски трендови и технологии и постојано ги поместува границите на она што е можно на терен. Тој има длабока експертиза во софтверот за графички дизајн и секогаш е желен да го сподели своето знаење и увид со другите.Покрај неговата работа како дизајнер, Рик е и посветен блогер и е посветен на покривање на најновите трендови и случувања во светот на софтверот за графички дизајн. Тој верува дека споделувањето информации и идеи е клучно за поттикнување силна и енергична заедница за дизајн и секогаш е нестрплив да се поврзе со други дизајнери и креативци онлајн.Без разлика дали дизајнира ново лого за клиент, експериментира со најновите алатки и техники во неговото студио или пишува информативни и привлечни објави на блогот, Рик секогаш е посветен да ја испорача најдобрата можна работа и да им помага на другите да ги постигнат своите дизајнерски цели.