6 спосабаў аптымізацыі малюнкаў для лепшай прадукцыйнасці Інтэрнэту

6 спосабаў аптымізацыі малюнкаў для лепшай прадукцыйнасці Інтэрнэту
Rick Davis

Людзі - візуальныя істоты, і даследаванні пацвярджаюць гэты факт. Ужо праз тры дні ўзровень захавання тэксту знаходзіцца ў дыяпазоне ўсяго 10%-20%. Але для малюнкаў узровень захавання можа дасягаць 65%. Мозг атрымлівае 90% візуальнай інфармацыі і апрацоўвае яе ў 60 тысяч разоў хутчэй. Без сумневу, візуальныя матэрыялы гуляюць важную ролю ў прыцягненні вэб-сайта.

Аднак патрабуецца нашмат больш, чым проста выбраць некалькі малюнкаў і размясціць іх на сваім сайце. Цяжкія выявы спажываюць вялікую прапускную здольнасць, запавольваючы хуткасць загрузкі старонак. Пошукавыя сістэмы заўважаць павольную працу і пакараюць вас нізкім рэйтынгам.

Наш артыкул пакажа вам шэсць розных спосабаў аптымізацыі відарысаў для павышэння прадукцыйнасці ў Інтэрнэце ў 2021 годзе.

Парады па аптымізацыі відарысаў для павышэння прадукцыйнасці ў Інтэрнэце ў

Дапусцім, вы распрацоўваеце вэб-сайты для некамерцыйныя арганізацыі, і вы любіце выкарыстоўваць шмат малюнкаў, каб прадэманстраваць сваю працу. Донары, спонсары і іншыя зацікаўленыя бакі выкарыстоўваюць такую ​​інфармацыю як аснову для пастаяннай падтрымкі. Аднак, калі вы не аптымізуеце выявы, пацерпіць карыстацкі досвед і ўзаемадзеянне. Самай вялікай праблемай будзе павольная загрузка старонак і час чакання адказаў.

Аптымізацыя выявы адносіцца да любых крокаў, якія вы робіце для памяншэння памеру, фармату або раздзялення файлаў. Вы можаце зрабіць гэта без шкоды для якасці малюнкаў.

Глядзі_таксама: Натхняльныя ідэі чорна-белага дызайну

Давайце праверым некаторыя з вашыхпараметры.

Ілюстрацыя маркетынгавай кампаніі ад Дзімака Даксіны

1. Пачніце з аўдыту аптымізацыі выявы

Аўдыт аптымізацыі выявы дасць рэлевантную інфармацыю аб тым, што вам трэба палепшыць.

Пачніце з правядзення інвентарызацыі малюнкаў, якія ёсць на вашым сайце. Адпаведныя тэсты дазволяць выявіць любыя праблемы, якія вам трэба вырашыць.

Напрыклад, аўдыт можа паказаць, што ў вас занадта шмат малюнкаў. Ён таксама пакажа фарматаванне выявы і дазволіць вам вызначыць далейшы курс дзеянняў. Напрыклад, выдаленне або змяненне фарматаў файлаў можа значна палепшыць хуткасць загрузкі старонкі.

2. Выберыце правільны фармат для малюнкаў

Файлы малюнкаў бываюць розных фарматаў. Гэта тры найбольш распаўсюджаныя тыпы фарматаў малюнкаў для вэб-прыкладанняў, якія вам трэба ведаць:

  • PNG мае перавагу ў тым, што гэта выява вельмі высокай якасці. На жаль, каб дасягнуць гэтага, памер файла вельмі вялікі. Яны добра працуюць для простых малюнкаў і лагатыпаў і дазваляюць сціскаць без страт.
  • Філі JPEG з'яўляюцца найбольш распаўсюджанымі на большасці вэб-сайтаў. Яны выдатна падыходзяць для складаных маляўнічых малюнкаў. Тым не менш, вам трэба быць асцярожным пры сцісканні відарысаў JPEG, бо меншым памерам відарыс можа стаць прычынай страты выразнасці. Некаторыя людзі называюць гэта стратай.
  • GIF працуе для анімацыі, маленькіх значкоў і малюнкаў з нізкім дазволам. Гэта дазваляе сціскаць без страт, але вы можаце выкарыстоўваць толькіда 256 колераў.

Захаваць значкі Андрэаса Шторма

3. Змяняйце памер і сціскайце выявы

Магчыма, вы заўважылі, што выявы загружаюцца патроху. Пройдзе некаторы час, перш чым вы ўбачыце поўную выяву; прыкмета таго, што малюнкі, верагодна, занадта цяжкія. Змяненне памеру або сцісканне вырашыць праблему.

Калі ласка, звярніце ўвагу, што вы не павінны загружаць выявы, перш чым аптымізаваць іх. А для лепшай якасці імкніцеся, каб файлы былі ў дыяпазоне ад 1 да 2 МБ.

Выкарыстоўвайце інструмент кадравання, каб змяніць памер малюнкаў. Гэта дапамагае паменшыць памер файла, што прыводзіць да лепшай хуткасці загрузкі старонкі. У вас ёсць мноства даступных інструментаў.

Сцісканне малюнкаў дапамагае паменшыць памер файла. Але вы можаце сказіць малюнак, калі занадта моцна яго сціснуць. Нізкае сцісканне можа быць ідэальным, калі вы хочаце захаваць якасць выявы; аднак гэта істотна не памяншае памер.

Тыпы сціску

Ёсць дзве канцэпцыі, якія мы ўжо згадвалі вышэй, сцісканне без страт супраць сціску са стратамі.

  • Сцісканне без страт захоўвае якасць выявы, адначасова выдаляючы непатрэбныя метададзеныя.
  • Сцісканне з стратамі памяншае памер файла, пазбаўляючыся некаторых элементаў. Гэта можа пагоршыць якасць малюнка. Аднак вы можаце не заўважыць розніцы. Такім чынам, гэта можа быць выдатным спосабам сціскання малюнкаў.

Правільны рэдактар ​​малюнкаў дапаможа вам вызначыць, якісціск лепш за ўсё падыходзіць вам.

4. Аптымізацыя малюнкаў у першую чаргу для мабільных прылад

Любыя крокі, якія вы робіце, павінны прытрымлівацца стратэгіі аптымізацыі мабільных прылад у першую чаргу, так як Google перайшоў на ранжыраванне ў першую чаргу для мабільных прылад. Выявы павінны выглядаць аднолькава на любой мабільнай прыладзе, як і на любой настольнай прыладзе. Праз такія прылады праходзіць велізарная колькасць інтэрнэт-трафіку.

Калі карыстальнікі не карыстаюцца добрым UX пры выкарыстанні мабільных прылад, вы страціце іх.

Падумайце аб аптымізацыі малюнкаў для мабільных прылад. Калі ён добра выглядае на маленькім экране, ён будзе выглядаць фантастычна і на працоўным стале або ноўтбуку.

Аптымізацыя ASO ад Abbi_Kerimov

5. Імёны файлаў і іх уплыў на SEO

Аптымізацыя выявы таксама патрабуе, каб вы звярнулі ўвагу на тое, як вы называеце файлы. Усе дзеянні, якія вы прымаеце, павінны быць накіраваны на паляпшэнне бачнасці ў пошукавых сістэмах. Калі вы запампоўваеце або робіце здымак, прылада аўтаматычна дасць яму назву файла. Гэта імя звычайна складаецца з выпадковых кодаў або лічбаў. Гэта можа выглядаць прыкладна як 2224444.jpg.

Загрузка выявы як ёсць на ваш вэб-сайт зусім не дапаможа пошукавым сістэмам.

Палегчыце вэб-сканерам пошук вас, прысвоіўшы апісальныя цэтлікі кожнай выяве. Уключыце адпаведныя ключавыя словы, якія даюць інфармацыю аб вашым бізнэсе або сайце.

6. Разгледзьце магчымасць выкарыстання лянівай загрузкі

Лянівая загрузка малюнкаў дакладна адпавядае назве. Заместуся выява загружаецца адразу, яна як бы разгортваецца. Малюнак працягвае загружацца, чым больш інтэрнэт-наведвальнік пракручвае старонку ўніз.

Лянівая загрузка паказвае толькі тое, што актуальна ў гэты момант. У канчатковым выніку вы зэканоміце на прапускной здольнасці, таму што не будзеце выкарыстоўваць непатрэбныя рэсурсы.

Загрузка... ад Dona

Заключныя думкі

Прадукцыйнасць Інтэрнэту з'яўляецца найважнейшым фактарам ранжыравання, які выкарыстоўваюць пошукавыя сістэмы. Google аштрафуе ваш сайт, калі хуткасць загрузкі старонкі нізкая.

Глядзі_таксама: 12 лепшых прыкладаў графічнага дызайну ад Vectornator

Шмат фактараў вызначае хуткасць старонкі, а выкарыстанне выявы займае адну з першых пазіцый. Калі вы не аптымізуеце выявы, ваша вэб-прадукцыйнасць пагоршыцца. Старонкі будуць загружацца павольна, а карыстальніцкі досвед і ўзаемадзеянне не будуць добрымі.

Выберыце правільны фармат выявы. Затым выкарыстоўвайце такія метады, як змяненне памеру і сцісканне, каб паменшыць памер файла. Заплануйце рэгулярныя тэсты старонак і аўдыты сайта, каб праверыць прадукцыйнасць сайта.




Rick Davis
Rick Davis
Рык Дэвіс - дасведчаны графічны дызайнер і візуальны мастак з больш чым 10-гадовым вопытам работы ў індустрыі. Ён працаваў з рознымі кліентамі, ад невялікіх стартапаў да буйных карпарацый, дапамагаючы ім дасягнуць іх дызайнерскіх мэтаў і павысіць іх брэнд з дапамогай эфектыўных і эфектных візуальных эфектаў.Выпускнік Школы візуальных мастацтваў у Нью-Ёрку, Рык захапляецца вывучэннем новых тэндэнцый і тэхналогій дызайну і пастаянна пашырае межы магчымага ў гэтай галіне. Ён мае глыбокія веды ў праграмным забеспячэнні для графічнага дызайну і заўсёды гатовы падзяліцца сваімі ведамі і ідэямі з іншымі.У дадатак да сваёй працы ў якасці дызайнера, Рык таксама з'яўляецца адданым блогерам і займаецца асвятленнем апошніх тэндэнцый і распрацовак у свеце праграмнага забеспячэння для графічнага дызайну. Ён лічыць, што абмен інфармацыяй і ідэямі з'яўляецца ключом да развіцця моцнай і яркай дызайнерскай супольнасці, і заўсёды імкнецца да зносін з іншымі дызайнерамі і крэатыўнікамі ў Інтэрнэце.Незалежна ад таго, распрацоўвае ён новы лагатып для кліента, эксперыментуе з найноўшымі інструментамі і метадамі ў сваёй студыі або піша інфарматыўныя і цікавыя паведамленні ў блогу, Рык заўсёды імкнецца выканаць найлепшую працу і дапамагчы іншым дасягнуць пастаўленых мэт дызайну.