Ускорение загрузки сайта на Blogger

В сегодняшний век высоких скоростей никто не хочет ждать. Как говорит Google, что более 50% мобильных пользователей закрывают страницу если она не загрузилась за 3 секунды. Да и сам поисковик стал понижать рейтинг сайта если скорость его загрузки менее трех секунд. Поэтому, очень важно иметь быстрый сайт.

Скорость загрузки можете посмотреть на странице 

PageSpeed Insights

. Просто вставьте адрес своего сайта в специальное поле и нажмите "Анализировать". И посмотрите на качество своего ресурса.

Если все хорошо, то делать ничего не нужно. А вот если показатели оставляют желать лучшего, то вам нужно сайт ускорять. 

Что нужно сделать, чтобы повысить скорость загрузки сайта на Blogger? 

Чтобы сайт заработал быстрее, необходимо выполнить ряд рекомендаций: 

1. Используйте новые темы, они намного быстрее старых шаблонов.

2. Разгрузите макет сайта от лишних элементов:

• Удалите все лишние виджиты/гаджеты от которых нет пользы: все украшения, ненужные информеры и пр.

• Очистите шаблон от мусора, лишних ссылок.

3. Сократите количество сообщений на главной странице. Чем меньше статей, тем лучше. Оптимально, это 5 - 7 постов.

4. Оптимизируйте картинки - не обработанные изображения очень много весят и сильно замедляют загрузку сайта. Уменьшите их объем и конвертируйте в более современные форматы.

5. Настройте отложенную загрузку скрытых изображений, чтобы картинки загружались по мере прокрутки страницы. 

Для этого в шаблоне найдите закрывающийся тег </body> и выше него вставьте код:

 <script type='text/javascript'> //<![CDATA[ // Lazy Load 

(function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container:window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"",effect:"fadeIn",threshold:"0"})}); 

//]]> 

</script> 

6. Настройте отложенную загрузку рекламных объявлений AdSense, что бы рекламные блоки появлялись после загрузки страницы. 

Для этого в коде шаблона найдите строку </body> и над ней вставьте код: 

 <script type='text/javascript'>

//<![CDATA[

// Lazy Load AdSense

var lazyadsense=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===lazyadsense||0!=document.body.scrollTop&&!1===lazyadsense)&&(!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyadsense=!0)},!0);

//]]>

</script>

После чего, найдите код (или подобное) и удалите его:

<script async='async' src='//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'/>

7. Переместите всплывающее окно об  использовании файлов cookie в низ сайта.

 Для этого находим в шаблоне строку ]]></b:skin> и над ней вставляем код:

/* Custom Cookies Info Light */
.cookie-choices-info{background-color:rgba(255,255,255,.99)!important;line-height:normal!important;top:initial!important;bottom:0!important;font-family:inherit!important;box-shadow:0 0 10px rgba(0,0,0,0.2);-webkit-transform:translateZ(0)}
.cookie-choices-info .cookie-choices-text{font-size:14px!important;color:#222!important}
.cookie-choices-info .cookie-choices-button{color:#fff!important;margin-left:5px!important;padding:3px 6px!important;background:#3fbdf3!important;border-radius:2px;transition:all .6s linear}
.cookie-choices-info .cookie-choices-button:nth-child(2){background:#f68c2e!important;transition:all .6s linear}
.cookie-choices-info .cookie-choices-button:hover,.cookie-choices-info .cookie-choices-button:nth-child(2):hover{background:#999!important;transition:all .1s linear}

После того, как все эти семь пунктов будут выполнены, ваш сайт значительно ускорится, а следовательно его рейтинг возрастет в глазах поисковиков.

Рекомендуем