Блог фрилансера - сайты под ключ

Ускоряем загрузку

Просмотров: 6007Комментарии: 0
ВебмастеруПолезное

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

Не секрет что скорость генерации страницы и скорость её открытия в браузере клиента зависит в первую очередь от того на какой CMS работает блог или сайт. Поэтому очень важно при выборе движка знать такие, казалось бы, мелочи. Сейчас я не буду заострять внимание на выборе конкретной CMS, надеюсь что в одной из следующих статей на эту тему я конкретно распишу все достоинства и недостатки разных движков и рекомендации по улучшению. Сейчас лиш скажу что не следует выбирать движок ориентируясь только на его популярность, которая зачастую всего лиш говорит о том что раньше этот движок действительно был хорош (это камень в огород поклонников WordPress). Но ведь прогресс не стоит на месте, всё совершенствуется и развивается.

Во вторую очередь скорость загрузки страниц зависит от веса самой страницы. А вес этот определяет во первых контент который мы на эту страницу добавили. Поэтому совет номер один - не нужно добавлять очень обьёмные тексты на одну страницу. Лучше разбивать содержание на несколько страниц по 4000-5000 знаков максимум. У многих современных CMS есть функции разбивки текста постранично. Совет номер два - графика! Если в тексте присутствует много иллюстраций, нужно оптимизировать их размер. Есть много графических редакторов которые уменьшают вес графики практически без ухудшения качества. Идеальный вариант - размещать в теле статьей миниатюры, при клике на которые в отдельном окне откроется полноразмерная картинка.

Скорость загрузки страницы зависит ещё и от количества подключаемых к ней файлов стилей CSS и их обьёма. Идеальный вариант - использовать в шаблоне темы оформления дизайна один файл стилей. Кроме того сам файл стилей можно оптимизировать уменьшив обьём файла. Причём можно это сделать вручную используя программу Notepad++ или подобный редактор. Хотя некоторые советуют использовать для этого специальные программы которые сжимают фалы на автопилоте, я всё же предпочитаю делать это своими руками. Если открыть стандартный файл css шаблона то мы увидим примерно следующее

body {
 font: 75%/150% "Trebuchet MS", Tahoma, Arial;
 color: #333333;
 background: #FFFFFF url(images/main-bg.gif);
 margin: 0px;
 padding: 0px 0px 30px;
}
a {
 color: #CC6600;
 text-decoration: none;
}
a:visited {
 color: #CC6633;
 text-decoration: none;
}
a:hover {
 color: #FF6600;
 text-decoration: underline;
}
img {
 border: none;
}
p {
 padding: 0px 0px 15px;
 margin: 0px;
}

Это лиш маленький кусочек кода, весь файл стилей из которого я привёл этот фрагмент имеет размер 22.5 кб. И нам нужно привести эти строчки кода к такому виду
body {font: 75%/150% "Trebuchet MS", Tahoma, Arial; color: #333333; background: #FFFFFF url(images/main-bg.gif); margin: 0px; padding: 0px 0px 30px;}
a {color: #CC6600; text-decoration: none;}
a:visited {color: #CC6633; text-decoration: none;}
a:hover {color: #FF6600; text-decoration: underline;}
img {border: none;}
p {padding: 0px 0px 15px; margin: 0px;}

Видите насколько компактнее стал код? Я просто вытянул в одну строчку код относящийся к определённому тегу и удалил пустые строки. После оптимизации кода таким способом (потратил на это 4 минуты), размер файла уменьшился до 16.8 кб. Хотя это и мизер по сравнению с общим весом страницы, но если такой же метод применить и к коду самого шаблона, то общий результат будет заметен больше. На некоторых CMS страдающих большим количеством кода в шаблонах оформления и большими по обьёму файлами стилей, мне удавалось уменьшить время загрузки страниц на 0.1-03 сек. Как говориться - из копеек собирается рубль, так и здесь - из долей секунд собирается намного более быстрая загрузка страниц.

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

Оставьте комментарий!

grin LOL cheese smile wink smirk rolleyes confused surprised big surprise tongue laugh tongue rolleye tongue wink raspberry blank stare long face ohh grrr gulp oh oh downer red face sick shut eye hmmm mad angry zipper kiss shock cool smile cool smirk cool grin cool hmm cool mad cool cheese vampire snake excaim question


Комментарий будет опубликован после проверки

     

  

(обязательно)