Как да се минимизират HTML, CSS и JavaScript, използвайки Autoptimize Plugin

Google и други търсачки дават стойност на вашия уебсайт, ако той се зарежда толкова бързо. Тъй като никой от зрителите няма много пациенти, които да чакат дълго, за да прегледат съдържанието ви, и просто имате 1,5 секунди, за да привлечете вниманието им. Ако на сайта ви отнема много време, обикновено губите зрителите си. Така че, това е от съществено значение за ускоряване на вашия уебсайт. Има няколко начина да оптимизирате сайта си. Но една от най-важните части е да Минимизирайте HTML, CSS и JavaScript.


Ако някога сте правили тест за скорост Google PageSpeed или GTmetrix, вероятно виждате тази опция.

Всеки уебсайт се зарежда с много файлове, съдържащи HTML, CSS и JavaScript. И по-голямата част от файловете включват много място, коментари, блокиране на разделители и т.н. И така, значително отнема допълнително време, за да се зареди правилно.

Това зависи и от качеството на темата. Например, премиум качество винаги по-добро от безплатна тема. Премиум темите са добре кодирани и изградени от висококвалифицирани разработчици. Но всички теми не са еднакви и имат различен тип функции. И така, от Минимизирането тези HTML, CSS и JavaScript файл, можете стратегически да увеличите скоростта на вашия сайт и да направите посетителите си щастливи.

Какво е Minify и защо е полезно?

Минимизиране е език за програмиране, който премахва всички ненужни символи от изходния код, без да променя неговата функционалност. Тези ненужни знаци обикновено съдържат „бели символи за интервал, нови символи на линия, коментари, и блок разделители ”. 

Преди Minify и след Minify

Те се използват за добавяне на четимост на кода, но не се изисква за неговото изпълнение. По този начин се намалява количеството код, което трябва да се прехвърли през мрежата и се запазва вашата честотна лента. Така че от минимизиране на HTML, CSS и JavaScript, можете лесно да премахнете тези ненужни символи от вашия сайт и значително нараства скоростта на вашия сайт. 

Как да се минимизират HTML, CSS и JavaScript

Има два начина да Minify HTML, CSS & JavaScript. Или можете да направите, като редактирате кода на вашата тема, или можете да използвате приставка за WordPress, наречена Autoptimize. В тази статия ще ви покажем и двата процеса Как да се минимизират HTML, CSS и JavaScript.

За да знаете точния HTML, CSS или JavaScript файл, който причинява проблема, трябва да го проверите на всеки инструмент за тестване на скоростта на сайта, като Google PageSpeed ​​инструмент или GTmetrix. Тъй като не всичките ви файлове съдържат този тип ненужни символи.

След като проверите резултата на вашия сайт, ще го получите. Ето една снимка по-долу от моя сайт, която разглежда коригиране на CSS и JavaScript.

Скриване на Css, JavaScript

Той определя качеството на вашата тема. Така че, няма да се притеснявате, ако видите, че и двете се казват на Minify и е по-добре да получите тема Premium.

Има някои онлайн инструменти, чрез които можете да Minify HTML, CSS и JavaScript код. 

Преди да направите каквато и да е промяна, направете резервно копие на този файл.

# 1 Минимизиране на кода:

Инструмент за кодиране на кода

Минимизиране на кода е инструмент за всичко в едно. Той може да минимизира вашите JavaScript, CSS и HTML кодове. Всичко, което трябва да копирате HTML или CSS или JavaScript код и да го поставите тук. След това кликнете върху омаловажавам Вариант. Този инструмент автоматично Минимизира кода ви. След това копирайте Minified кода в този файл.

Можете също така да минимизирате своя CSS и JavaScript код като HTML код с този инструмент.

№2 Willpeavy:

Willpeavy

Уилпеви е друг чудесен инструмент Минимизиране на HTML кодове. Този инструмент работи по същия начин, както прави minify код. Той минимизира HTML и всички CSS или JS, включени във вашата маркировка. За да използвате този инструмент, просто трябва да копирате кода си тук и да кликнете върху Minify.

Усъвършенстване с помощта на автоматично оптимизиране на приставката

Autoptimize

Ако не сте запознати с такова кодиране, тогава е по-добре да използвате плъгин и се препоръчва за начинаещи. Така че идва тук Автоматизирайте приставката за WordPress потребители.

Автоматизира оптимизира всички скриптове и стилови кодове и ги прави по-малки, които се зареждат толкова бързо. Той минимизира всички HTML, CSS & Самият Javascript код и прави вашата страница наистина лека. С Minification този плъгин добавя изтичащи заглавки и премества стилове към главата на страницата и може да премества скриптове в долния колонтитул.

Автоматизирайте настройките за препоръчване

Можете лесно да правите всички неща от настройките на плъгините. След активиране на този плъгин, отидете на Настройки> Autoptimize.  Кликнете върху бутона „Покажи разширени настройки“.

В HTML отметнете „Оптимизиране на HTML код“ и „Запазване на HTML коментари“ за по-бърза производителност.

Автоматизирайте HTML опциите

В JavaScript Разрешете „Оптимизиране на JavaScript код“. Можете също така да разрешите „Принудително JavaScript в“ да зарежда JS рано и да намали вероятността от JS грешки. В случай, че вашият JS разбие скриптове, тогава можете да активирате „Добавяне на опит за улов“.
Автоматизирайте опциите на JavaScript

в CSS раздел, активирайте „Оптимизиране на CSS код“, „Също така да се агрегира вграден CSS“. Можете също така да активирате „Inline and Defer CSS“, ако сте изменили CSS. Изпробвайте този инструмент, за да минимизирате вашия CSS и да го поставите в полето.

Автоматизирайте CSS опциите

Въведете своето CDN URL адрес в полето „CDN Base URL“. Например „//cdn.example.com/“.

И последно, активирайте „Запазване на агрегиран скрипт / css като статичен файл“. Но се уверете, че вашият уеб сървър може правилно да се справи с компресията и изтичането.

Автоматизирайте опциите за CDN

След като смесите кода си, не забравяйте да проверите отново скоростта на сайта си. След това го сравнете с онези минали резултати. Ако вашият сайт получава някакъв проблем или не се показва правилно, можете да опитате да изчистите скривалище

заключение

Минимизиране на HTML, CSS и JS е от полза за вашия сайт. Той премахва ненужните знаци на кода ви и ги прави по-малки, които са удобни за браузъра. По този начин можете да подобрите скоростта на зареждане на сайта си.

Ако този урок помага за минимизиране на HTML, CSS и JavaScript, моля, споделете тази статия за Facebook, кикотене, Google+.

Свързани статии,

  • Как да използваме кеширането на браузър на WordPress
  • Как да оптимизирате базата данни на WordPress, използвайки WP-Sweep
  • 7 най-добрият оптимизатор на изображения за WordPress 2017
  • Как лесно да активирате Gzip компресия в WordPress за по-бързо зареждане
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map