Ултимате Гуиде то Веб Оптимизатион (савети и најбоље праксе)

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

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

Поделили смо ствари у 3 одвојене секције ради боље читљивости - респективно оптимизација на страни сервера, оптимизација имовине (која укључује веб компоненте као што су ЦСС, Јавасцрипт, слике, итд.) и платформа, где ћемо се фокусирати ВордПресс оптимизација. У последњем делу, стављамо пар линкова које смо сматрали корисним. Комплетна листа после скока.

Оптимизација: на страни сервера

1. Изаберите пристојан Веб Хост

   Ваш веб хостинг рачун нема директну везу са оптимизацијама које ћете обавити, али смо закључили да је одабир правог веб хостинг рачуна толико важан да смо одлучили да вам га скренемо пажњу. Хостинг рачун је основа вашег веб сајта / блога где су безбедност, приступачност (цПанел, ФТП, ССХ), стабилност сервера, цене и подршка клијентима сви играју важне улоге. Морате бити сигурни да сте у добрим рукама.

   Препоручена литература: Како одабрати Веб Хост од стране викиХов је одличан чланак који вам даје кораке и савете које бисте требали знати прије куповине било којег веб хостинг рачуна.

2. Хост Ассетс Сепаратели

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

   Препоручено читање: Максимизирање паралелних преузимања у Царпоол Лане.

3. Компресија са ГЗип-ом

   Укратко, садржај путује од стране сервера до стране клијента (вицет верса) кад год је ХТТП захтев направљен. Компримирање садржаја за слање знатно смањује вријеме потребно за обраду сваког захтјева.

   ГЗип је један од најбољих начина да то урадите и да се разликује у зависности од типа сервера које користите. На пример, Апацхе 1.3 усес мод_зип, Апацхе 2.к користи мод_дефлате и ево како то радите Нгинк. Ево неких заиста добрих чланака који ће вас упознати са компресијама на страни сервера:

   • Убрзајте веб сајт тако што ћете омогућити Апацхе компресију датотека
   • Цомпресс Веб Оутпут користећи мод_гзип и Апацхе
   • Како да оптимизујете Ваш сајт са ГЗИП компресијом
   • Компресија на страни сервера за АСП

4. Минимизе Редирецтс

   Вебмастери стално преусмеравају УРЛ адресу (било да је у питању ЈаваСцрипт или МЕТА преусмеравање). Понекад је сврха да се корисници са старе странице упореде са новом, или да само усмеравају кориснике на исправну страницу. Свако преусмеравање креира додатни ХТТП захтев и РТТ (повратно време). Што више преусмјеравања имате, спорији корисник ће доћи до одредишне странице.

   Препоручено читање: Авоид Редирецтс Гоогле Цоде даје добар преглед о томе. У чланку се такође препоручују неки практични начини да се смањи преусмеравање како би се повећала брзина сервирања.

5. Редуце ДНС Лоокупс

   Према Иахоо! Девелопер Нетворк Блог, Потребно је око 20-120 милисекунди за ДНС (систем назива домена) да разреши ИП адресу за одређено име хоста или име домена и претраживач не може ништа да уради док се процес не заврши правилно.

   Аутхор Стеве Соудерс сугерисали су да раздвајање ових компоненти на најмање два, али не више од четири имена хостова смањује ДНС претраге и дозвољава паралелне преузимања у високом степену. Опширније на чланак.

Оптимизација: Средства (ЦСС, Јавасцриптс, Имагес)

1. Споји више Јавасцриптс у један

   Људи у раказ.нл дели информације о томе како можете комбиновати више Јавасцрипт-а као што су:

    хттп://ввв.цреатипе.нл/јавасцрипт/прототипе.јс хттп://ввв.цреатипе.нл/јавасцрипт/буилдер.јс хттп://ввв.цреатипе.нл/јавасцрипт/еффецтс.јс хттп: // ввв .цреатипе.нл / јавасцрипт / драгдроп.јс хттп://ввв.цреатипе.нл/јавасцрипт/слидер.јс 

   У једну датотеку променом УРЛ-а на:

    хттп://ввв.цреатипе.нл/јавасцрипт/прототипе.јс,буилдер.јс,еффецтс.јс,драгдроп.јс,слидер.јс 

   манипулишући .хтаццесс и користећи ПХП. Кликните овде да прочитате више.

2. Компримирајте ЈаваСцрипт и ЦСС

   Минифи је ПХП5 апликација која може комбинирати више ЦСС и Јавасцрипт датотека, компримирати њихов садржај (тј. уклонити непотребне размаке / коментаре) и послужити резултате с ХТТП кодирањем (гзип / дефлате) и заглављима која омогућују оптимално клијентско кеширање.

   

   Компримирајте их онлине!Постоје и неке веб услуге које вам омогућују да ручно компримирате ваше Јавасцриптс и ЦСС датотеке на мрежи. Ево неколико које знамо:

   • цомпрессор.ебиене (Јавасцрипт, ЦСС)
   • јавасцриптцомпрессор.цом (Јавасцрипт)
   • јсцомпресс.цом (Јавасцрипт)
   • ЦлеанЦСС (ЦСС)
   • ЦСС Оптимизер (ЦСС)

3. Цустомизе Хеадер Екпири / Цацхинг

   Цредит: хттпватцх

   Коришћењем прилагођеног заглавља за истека, ваше веб компоненте као што су слике, статичке датотеке, ЦСС, Јавасцрипт су прескочиле непотребан ХТТП захтев када исти корисник поново учита страницу по други пут. То смањује потребну пропусност и дефинитивно помаже брже послуживање странице.

   Препоручена читања:

   • Иахоо! Девелопер Нетворк Блог - Додајте заглавље истиче
   • Како додати добре истиче заглавља за слике у Апацхеу 1.3
   • ХТТП Цацхинг
   • Приручник за кеширање за веб ауторе и вебмастере

4. Оптерећење имовине

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

   • Имагес: Флицкр, Смугмуг, Плаћени хостови *
   • Јавасцриптс: Гоогле Ајак библиотека, Гоогле Апп Енгине, плаћени хостови *
   • Веб Формс: ВуФоо, ФормСтацк
   • РСС: Гоогле Феедбурнер
   • Анкете и анкете: СурвеиМонкеи, ПоллДадди

   * Плаћени домаћини - Плаћене услуге увијек имају бољу поузданост и стабилност. Ако ваш сајт стално тражи средства, морате бити сигурни да су у добрим рукама. Препоручујемо Амазон С3 и Цлоуд Фронт.

5. Руковање веб сликама

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

   • Оптимизуј ПНГ сликеЉуди у Смасхинг Магазину описују неке паметне технике које вам могу помоћи да оптимизујете ваше ПНГ слике.
   • Оптимизација за Веб - Ствари које требате знати (формати) Сазнајте више о ЈПЕГ-у, ГИФ-у, ПНГ-у и начину на који бисте требали спремати слике за веб.
   • Дон'т Сцале ИмагесУвек вежбајте уметање видтх и хеигхт за сваку слику. Такође, немојте смањивати слику само зато што вам је потребна мања верзија на Вебу. На пример: Немојте примењивати силуете 200 × 200 пк слику на 50 × 50 пиксела за ваш сајт променом видтх и хеигхт. Уместо тога, добијте 50 × 50 пк.

   Оптимизација помоћу Веб услуга и алата. Добра вест је да не морате бити Пхотосхоп експерт за оптимизацију слика. Постоји много веб сервиса и алата који ће вам помоћи да обавите посао.

   • Смусх.итВероватно један од најефикаснијих онлине алатки за оптимизацију слика. Постоји чак и ВордПресс плугин за њега!
   • ЈПЕГ & ПНГ СтрипперВиндовс алатка за скидање / чишћење / уклањање непотребних метаподатака (јунк) из ЈПГ / ЈПЕГ / ЈФИФ и ПНГ датотека.
   • Онлине Имаге ОптимизерОмогућава вам да лако оптимизујете своје ГИФ-ове, анимиране ГИФ-ове, јпгс и пнгс, тако да се учитавају што је брже могуће на вашој веб-локацији, помоћу програма Динамиц Дриве
   • СуперГИФНаправите све мање ГИФ слике и анимације.
   • Ево још.

6. Хандлинг ЦСС

   Модерни сајтови користе ЦСС као основу стила, као и изглед и осећај. Не само ЦСС даје велику флексибилност промјенама, него је и мањи у смислу потребних кодова. Међутим, ако су лоше кодиране, то би могло бити обрнуто. Ево неких контролних листа, односно водича за вас како бисте били сигурни да су ваши ЦСС исправно оптимизовани:

   • Чување ваших елемената деци у складу са потомствомКако сачувати ознаку помоћу ЦСС селектора.
   • Држите ЦСС краткоКада дају исти стил, кодови су бољи што су краћи. Ево једног Кратки водич за ЦСС вероватно ће вам требати.
   • Користите ЦСС СпритеЦСС Сприте техника смањује ХТТП захтев сваки пут када се страница учитава комбиновањем неколико (или свих) слика заједно на једној датотеци слике и контролише њен излаз са ЦСС позиција у позадини аттрибуте. Ево неколико корисних водича и техника за креирање ЦСС Спритес-а:
     • Онлине ЦСС Сприте Генератор
     • Бест Онлине анд Оффлине ЦСС Спритес Генератор
   • Коришћење сваке декларације само једномКада желите да оптимизујете ЦСС датотеке, једна од најмоћнијих мера коју можете да користите је да користите сваку декларацију само једном.
   • Смањите количину ЦСС датотекаРазлог је једноставан, што више ЦСС датотека имате више ХТТП захтјева које ћете морати направити када се веб страница тражи. На пример, уместо да имате више ЦСС датотека као што су следеће:

     Можете их комбиновати у један ЦСС:

   Препоручена читања:

   • Корисни алати за проверу, чишћење и оптимизацију ЦСС датотекеНеки од корисних алата које можете користити за оптимизацију ЦСС кода, чак и ако немате потпуно знање о ЦСС кодирању.
   • 7 принципа чистог и оптимизованог ЦСС кодаОптимизација није само минимизирање величине датотеке - она ​​је такође и организована, без гужве и ефикасна.
   • Најбоље праксе за оптимизацију ЦСС-аРазмотрите овај чланак више као академску вежбу, а не као савјете за оптимизацију у стварном животу.

Оптимизација за ВордПресс

С времена на време надгледамо, меримо и анализирамо перформансе нашег ВордПресс блога. Ако сајт ради споро, морамо знати зашто. Ево неких основних измена које смо урадили и схватили да ће значајно повећати брзину вашег ВордПресс блога.

1. Цацхе Иоур Ворпресс Блог

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

2. Деактивирајте и избришите неискоришћене додатке

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

3. Уклоните непотребне ПХП ознаке

   Ако погледате изворне кодове своје теме, наћи ћете много ознака као што су ове:

   Они могу бити прилично замијењени текстуалним садржајем који не узрокује оптерећење послужитељу. Проверити Мицхаел Мартин'с 13 Ознаке за брисање из вашег ВордПресс Блог

Препоручена читања:

• 3 Најлакши начин да убрзате ВордПрессЏон Позадзидес дели како његов блог једри глатко кроз Дигг саобраћајни шиљак.
• 13 Греат ВордПресс Спеед Типс & Трицкс за МАКС Перформанце Ево неколико ствари које можете испробати ако установите да ваша ВордПресс страница не функционише тако добро као што је то због великог саобраћаја или скривених питања о којима не знате.
• 40 ВордПресс савети за оптимизацијуСавети за оптимизацију у слајдовима. 40 напојница за 40 минута.

На крају, али не мање важно…

Ево неколико корисних веб сервиса и алата који вам пружају ширу перспективу и бољу анализу која ће вам помоћи у веб оптимизацији.

• Иахоо! ИСлов

  ИСлов анализира веб странице и предлаже начине за побољшање њихових перформанси на основу скупа правила за веб странице високих перформанси. То вам даје добру идеју шта треба да се уради да би се веб сајт брже учитао.

  (Потребан је Фиребуг)

  

• ПагеСпеед

  Слично Иахоо! ИСлов, Гоогле Брзина странице је опен-соурце Фиребуг додатак за процену перформанси сајта и како их побољшати. (Потребан је Фиребуг)

  

• Пингдом Тоолс

  Пингдом Тоолс узмите комплетно оптерећење свог веб сајта, укључујући све објекте (слике, ЦСС, ЈаваСцрипт, РСС, Фласх и оквире / ифрамеове) и приказује општу статистику о учитаној страници, као што је укупан број објеката, укупно време учитавања и величина укључујући све објеката.

  

Препоручена читања:Ево још савета и алата који вреди проверити.

• Гоогле Веб Оптимизер
• 15 Алати који ће вам помоћи да развијете брже веб странице
• 15+ савета за убрзавање вашег сајта и оптимизацију кода!