Як аптымізаваць выявы, малюнкі, фатаграфіі?

  1. Аптымізацыя памеру малюнка
  2. Праграма для аптымізацыі малюнкаў
  3. Аптымізацыя малюнак для пошукавых сістэм

Мы ўжо казалі пра тое, што   CSS стылі   і   скрыпты JavaScript пажадана сціскаць   перад даданнем на сайт

Мы ўжо казалі пра тое, што CSS стылі і скрыпты JavaScript пажадана сціскаць перад даданнем на сайт. У сціснутым выглядзе яны менш важаць, а адпаведна меншая вага прыйдзецца перадаваць карыстальніку. Тая ж сітуацыя і з малюнкамі. Калі Ваша выява, загружанае на старонку, будзе мець вялікую вагу, то не чакайце што яна хутка загрузіцца. Менавіта таму неабходна аптымізаваць і сціскаць выявы перад даданнем на сайт. Ніжэй мы разгледзім якім жа чынам можна аптымізаваць карцінкі для сайта.

Аптымізацыя памеру малюнка

Памер загружанага Вамі выявы вельмі рэдка будзе супадаць з памерам, у якім ён будзе паказаны канчатковаму карыстальніку. Напрыклад, выявы на маім сайце, якія дадаюцца ў артыкул, сродкамі CSS або HTML сціскаюцца да 512 пікселяў у шырыню. Пры гэтым захоўваецца прапорцыя шырыні на вышыню. У артыкуле карыстальнік бачыць малюнак у 512 пікселяў у шырыню. Калі ж выява мае ў шырыню меней 512 пікселяў, то выява будзе паказана ў арыгінальным памеры. Усё быццам бы схоплена. Але мы лішні раз напружваем сервер і прымушаем яго сціскаць малюнак. Калі перад загрузкай мы зменім шырыню карцінкі да 512 пікселяў, захаваўшы пры гэтым прапорцыі, то мы пазбавім сервер неабходнасці напружвацца з гэтай нагоды. У выніку старонка будзе адкрывацца хутчэй, чаго мы і дамагаемся.

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

Для таго каб паменшыць памер малюнка выдатна падыдзе праграма Microsoft Paint, якая ёсць ва ўсіх, хто выкарыстоўвае аперацыйную сістэму Windows. Адкрыўшы малюнак у дадзеным рэдактары, націсніце кнопку Змяніць памер. Адказам на дадзенае дзеянне будзе наступнае акно:

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

Праграма для аптымізацыі малюнкаў

Ёсць два метаду сціску малюнкаў:

  1. Сціск з стратамі
  2. Сціск без страт

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

Вам неабходна з дапамогай мышкі перанесці арыгінальнае малюнак у левае акно. Адразу ж пасля гэтага Вы ўбачыце аптымізаваным малюнак у правам акне. Пры гэтым, над кожным акном будзе паказаны памер малюнка, так што Вы лёгка зможаце пракантраляваць узровень сціску. Ніякіх іншых рухаў цела ня трэба. Адзінае што можа Вас зацікавіць, то гэта паўзунок Якасць (Quality). Перасоўваючы яго бліжэй да нуля Вы будзеце памяншаць якасць малюнка, але пры гэтым мацней сціскаць малюнак. Я рэкамендую пакінуць гэтую наладу на 80 працэнтах, якія ўстаноўлены па змаўчанні. У дадзеным рэжыме аптымізацыя малюнкаў адбываецца найбольш адэкватным і прыдатным для нашых патрэб чынам. Застаецца толькі захаваць аптымізаваным малюнак і заліць на сайт.

Аптымізацыя малюнак для пошукавых сістэм

Аптымізацыя памеру малюнка і яго сціск зробяць Ваш сайт хутчэй, а ў пошукавай выдачы вышэй. І ўсё гэта можна прарабіць без ніякіх страт. Акрамя гэтага, пад аптымізацыяй малюнкаў разумеецца прапісванне тэгаў ALT і TITLE ўнутры тэга IMG, у якім падключаецца малюнак. Так тэг ALT павінен змяшчаць альтэрнатыўны тэкст, які будзе выводзіцца пры праблем з адлюстраваннем карцінкі, а гэта значыць што змесціва гэтага тэга павінна нядрэнна перадаваць сутнасць карцінкі. А вось у тэгу TITILE лепш за ўсё спажыць ключавое слова, па якім аптымізавана ўся артыкул і старонка сайта. Поспехаў Вам з аптымізацыяй малюнкаў.