Зар не волите слике?

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

И знате шта? Оспособљени смо да одговоримо на слике. Зато је уграђивање слика у ваш садржај моћно средство за оглашавање вашег блога.

Али, ако нисте пажљиви, слике могу чинити преко половине (или више) укупне величине ваше веб странице. Пре само неколико година, просечна величина веб странице била је 600–700К. Сада је просек 2МБ и повећава се сваке године.

То је огромно!

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

Већина нас, међутим, оставља оптимизацију слика као накнадну мисао и радије би уживали у забавним стварима као што је прављење епског поста или умрежавање са другим блогерима у вашој ниши.

Али, надувавање странице значи да утиче на брзину учитавања ваше странице. Можда не мислите да је ово велика ствар ако сте на брзој вези, али многи ваши посетиоци нису. Такође, Гоогле не воли споро учитавање страница и то може негативно да утиче на ваш СЕО.

Зашто треба да оптимизујете слике

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

Студије показују да до 40% посетиоци кликну на дугме за повратак ако је сајту потребно дуже од три секунде да се учита.

Знам, три секунде заиста нису тако дуго, али када сте на мобилној вези и чекате да се сајт учита, секунда може изгледати као заувек.

А пошто је много ваших посетилаца можда на споријим мобилним везама, постаје јасно – морате да смањите величину странице. А већ знамо шта је највећи преступник надувавања величине странице – то су ваше слике.

Непотребно велике слике такође заузимају простор на вашем налогу за хостинг. Иако неки од вас можда имају хостинг са „неограниченим“ простором за складиштење, многи провајдери премиум хостинга ограничавају вас на око 10 ГБ простора за складиштење на плановима нижег нивоа. Ово може брзо да се попуни, посебно ако хостујете више сајтова са великим бројем слика на истом налогу.

Па, како можете да утврдите да ли ваше слике успоравају ваш сајт? Тестирајте брзину свог сајта помоћу Гоогле ПагеСпеед Инсигхтс-а.

Ако Гоогле пријави неоптимизоване слике као проблем, ево шта треба да знате да бисте га решили.

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

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

Хајде да детаљније погледамо сваку од ових области.

Тип датотеке

Слике на вебу се обично чувају у ПНГ или ЈПЕГ формату датотеке – или ГИФ за анимацију. Ко не воли те урнебесне анимиране ГИФ-ове који лебде по мрежи!

Сада је технички у реду ако сачувате своје слике у било ком формату – претраживач вашег посетиоца неће имати проблема да прикаже вашу веб страницу – али за најбољи квалитет и оптимизацију, придржавајте се следећих правила:

• ЈПЕГ – користите за фотографије и дизајне на којима су представљени људи, места или ствари
• ПНГ – најбоље за графику , логотипи, дизајни са тешким текстом, снимке екрана и када су вам потребне слике са провидном позадином
• ГИФ – ако вам је потребна анимација, у супротном користите ПНГ

Па, зашто постоје различити формати ?

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

ЈПЕГ се традиционално користи за чување фотографија. Неки од података о слици се бацају како би се направила драстично мања величина датотеке, али пошто фотографије садрже широк избор боја и природних варијација, губитак квалитета јеобично неприметно људском оку.

Касније ћемо детаљније говорити о компресији, али за сада ако се сећате само две ствари, запамтите: ЈПЕГ за фотографије и ПНГ за текст/графику.

Димензије слике

Да ли сте икада учитали веб страницу и приметили да је за преузимање мале слике (можда снимак главе, на пример) потребно ф-о-р-е-в-е-р? На пример, тако споро да можете видети како сваки ред улази? Размишљате у себи, како тако малој слици може потрајати толико дуго за преузимање?

А када се то догоди великој слици у заглављу, то је још горе јер може зауставити учитавање целе странице.

Разлог зашто се ово дешава је тај што блогер није правилно променио величину и оптимизовао своју слику, а у случају нашег примера са снимком главе, можда је отпремио ЈПЕГ пуне резолуције директно са своје ДСЛР камере.

А то је огромна датотека!

Видите, веб претраживач (обично) ће смањити слику у односу на њене оригиналне димензије тако да се лепо уклопи на своје место на веб страници. Оно што изгледа као мала слика на екрану може заиста бити огромна фотографија од 10 мегапиксела, коју прегледач смањује у реалном времену.

Сада ће неке платформе за веб објављивање аутоматски креирати више варијација ваше слике пуне резолуције у различитим величине, али ако не, требало би да унапред промените величину слика у уређивачу слика као што је Пхотосхоп, Лигхтроом, Пиклр – или чак МС Паинт. То може значити разликуизмеђу 50К датотеке и 5МБ датотеке.

ВордПресс, на пример, ће аутоматски креирати три (или више, у зависности од ваше теме) копије ваше отпремљене слике – све са различитим димензијама – које можете да користите у постовима на блогу, уместо да увек користите слику у пуној величини.

Ако имате навику да отпремате огромне слике слика и желите да уштедите простор на свом налогу за хостовање, ВордПресс додатак Имсанити вам чува леђа.

Промењује величину и замењује оригиналну слику нечим лакшим за управљање, па чак и ако уметнете слику у пуној величини у пост, то неће бити тако лоше.

Када се активира, Имсанити такође може да претражује ваше постојеће слике и да им промени величину у складу са тим.

Послуживање ваших слика

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

Већина блогера приказује своје слике директно са свог хостинг налога и то је обично у реду, али ако заиста желите да извучете сваки део учинка из ваш сајт, а затим хостовање ваших слика на мрежи за испоруку садржаја (ЦДН) може да направи велику разлику.

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

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

Чаробњак за блоговање користи Суцури (обухвата заштитни зид за безбедност као и ЦДН), али постоје и други добављачи квалитета попут Амазоновог Цлоудфронт-а или КеиЦДН-а. Чак и популарни ЦлоудФларе, који није стриктно ЦДН, нуди ЦДН бесплатно и лако га је подесити у већини дељених хостинг пакета.

Компресија слике

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

Већина алата за уређивање слика као што су Висме или Пхотосхоп ће сачувати датотеке користећи ЈПЕГ компресију са губитком јер има најбоља смањења величине датотеке. Дакле, иако је квалитет слике благо смањен, коришћење компресије слике са губицима смањује огромне слике на величине погодне за веб.

Сигуран сам да би многи који користе Пхотосхоп могли да виде његову функцију Сачувај за Веб као главни и крајњи део оптимизације слике. Чак и онлајн алати за уређивање слика као што су ПицМонкеи или Висме такође оптимизују ваше слике.

Али да ли сте знали да постоје алатке које могу да преузму вашу „оптимизовану“ слику из Пхотосхоп-а или других алата за уређивање, да је згусну и компримују за још 40% (или више),и још увек изгледају скоро идентичне људском оку?

Ево неколико бесплатних и плаћених алатки које ће вам помоћи да своје слике сведете на статус прилагођене вебу.

Алатке за радну површину

ИмагеАлпха / ИмагеОптим

За кориснике Мац-а, ИмагеОптим је бесплатна алатка за радну површину коју користим сваки дан да оптимизујем ПНГ слике – углавном снимке екрана – пре него што их отпремим. Ови алати су лаки за коришћење, само превлачите и испуштате своје датотеке, али морате да правите једну по једну слику.

Професионални савет : За техно-упућене постоји ИмагеОптим– ЦЛИ, где можете да оптимизујете целу фасциклу са сликама одједном.

ИмагеАлпха је ПНГ компресор са губицима и може да учини чуда на смањивању ПНГ датотека док ИмагеОптим обавља напредну компресију без губитака (са опцијом са губицима) – и уклања непотребне метаподатке из ПНГ, ЈПЕГ и ГИФ датотека.

За моје ПНГ слике, прво сам их покренуо кроз ИмагеАлпха:

Овде је смањио моју слику екрана са 103К на 28К.

Потом сам га покренуо кроз ИмагеОптим и уштедео додатних 10%.

ЈПЕГмини

За моје ЈПЕГ датотеке, оптимизујем их помоћу десктоп ЈПЕГмини апликације, доступне и за Мац и за Виндовс.

Лите верзија вам омогућава да бесплатно оптимизујете до 20 слика дневно и кошта 19,99 УСД да бисте уклонили ограничење.

Професионални савет : Напредни корисници који желе да интегришу ЈПЕГмини у Пхотосхоп или Лигхтроом путем додатка могу купити Про верзију за99,99 УСД.

Онлине / Цлоуд / СааС алатке

ТиниПНГ

Ако тражите висококвалитетни алат за компресију слика на мрежи, ТиниПНГ (оптимизује ЈПЕГ датотеке такође упркос имену) је веб апликација која вам омогућава да превучете до 20 слика од 5 МБ или мањих у прегледач и да их оптимизујете одједном.

Они такође имају АПИ за програмере и праве ВордПресс Доступан додатак који може аутоматски да оптимизује ваше слике након отпремања.

ТиниПНГ вам даје 500 бесплатних оптимизација слика месечно, а након тога наплаћује од 0,002–0,009 УСД по слици, у зависности од обима.

Сада 500 слика месечно може звучати много, али када узмете у обзир чињеницу да ВордПресс често прави три до пет варијација сваке слике у различитим величинама, 500 слика не изгледа као толико за плодног блогера. Срећом, цена по слици је повољна.

ЕВВВ Имаге Оптимизер

Ако нисте спремни да потрошите новац и не желите да се мучите са оптимизацијом ваше слике ручно, бесплатни додатак ЕВВВ Имаге Оптимизер за ВордПресс може аутоматски да оптимизује ваше отпремљене слике.

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

Напомена: За комплетан преглед, погледајтенаш пост о алаткама за компресију слика.

Завршавање

Пошто неки људи предвиђају да ће се просечна величина веб странице приближити 3МБ до 2017. године, сада је време да почнете да оптимизујете своје слике.

Запамтите, неће сви ваши посетиоци бити на брзим везама, а надуваност страница и споро време учитавања могу потенцијално да утичу на ваше рангирање на Гоогле-у. Да бисмо вам помогли да олакшате оптерећење, да тако кажем, стекните навику да оптимизујете своје слике данас.

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

Следеће, искористите предности модерне компресије слика помоћу десктоп апликација као што је ЈПЕГмини или алатки у облаку као што су ТиниПНГ или Кракен – интегришите их у ВордПресс помоћу додатка ако је могуће.

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

Повезано читање: 7 начина да смањите Величина ПДФ датотека.