Улучшение скорости сайта: все, что вам нужно знать

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

Но реальность не всегда удобна - скорость сайта становится все более и более важной, а объем внимания интернет-пользователей определенно не увеличивается.

Возможно, что еще более важно, Google обращает внимание на эту конкретную проблему, и что 8-секундное время загрузки влияет на ваш рейтинг, нравится вам это или нет.

Все больше и больше владельцев сайтов начинают понимать, что скорость сайта является частью любой хорошей стратегии SEO. Так что надевайте свои учебные шапки, давайте копать.

Насколько это действительно важно?

Позвольте мне остановить вас прямо здесь.

Это не одна из тех вещей, от которых можно просто отмахнуться и сказать: «Это только для перфекционистов» или «У меня недостаточно трафика, чтобы это имело значение».

Скорость сайта важна для каждого веб-сайта по разным причинам. Было бы мудро не отмахиваться от них.

Прежде всего, подумайте о своих посетителях и их привычках просмотра. Несколько фактов:

Изображение предоставлено Kissmetrics

Как будто этого было недостаточно, чтобы убедить вас, я продолжу и дам вам знать, что Google тоже заботится — и это должно быть разумным, верно?

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

На самом деле, это совсем не новости — Google объявил еще в 2010 году, что скорость сайта действительно является фактором ранжирования, поэтому вы можете поспорить, что это не изменилось, учитывая, что это снова и снова подтверждается данными третьих лиц.

Как измерить скорость сайта

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

Вам доступно множество инструментов, и все они бесплатны для использования.

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

Наконец (и это большое предостережение), пожалуйста, имейте в виду, что счет определенно не единственное, что здесь имеет значение. Оценка — это эталон, который также будет варьироваться в зависимости от различных инструментов — не существует универсальной метрики для оценки скорости страницы.

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

Суть в том, что баллы являются ориентиром — не ставьте произвольную цель и не пытайтесь достичь определенного числа. Если вы выберете этот подход, вы можете быстро пойти на ненужные жертвы и сократить полезные ресурсы со своего сайта, чтобы достичь этого эталона.

Просто держите разум открытым, и все будет хорошо. Инструменты, которые я бы рекомендовал использовать:

Статистика Google PageSpeed

У Google, конечно же, есть свой инструмент, и именно с него вы должны начать свое путешествие.

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

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

GTmetrix

Этот инструмент легко мой фаворит.

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

Как видите, у людей из IGN явно есть над чем работать. При этом у них уже есть значительная лояльная аудитория (возможно, они экспериментировали и обнаружили, что их обратный трафик не зависит от ужасного времени загрузки).

В любом случае, здорово, что вы можете создать бесплатную учетную запись на GTmetrix и запускать ежедневный отчет на своей странице. Затем вы можете просмотреть прогресс с течением времени или сравнить любые два (или более) отчета, чтобы увидеть, какие элементы вы улучшили, и каков их совокупный эффект с точки зрения производительности.

Веб-страницаТест

Несмотря на супер устаревший вид, этот инструмент по-прежнему полезен. Я бы сказал, что это где-то между GTmetrix и Google PageSpeed ​​Insights с точки зрения полезности.

Он также предоставляет каскадную диаграмму и несколько разных оценок. Используя отчеты, вы получите очень конкретные и детализированные данные о том, что нужно улучшить и в чем заключаются ваши проблемы.

Одна действительно приятная (и уникальная) функция заключается в возможности отображать баллы как при первом, так и при повторном просмотре. Они различаются в зависимости от настройки кэширования и некоторых других факторов. Определенно полезная информация.

Тест скорости сайта Pingdom

Pingdom — еще одно сильное предложение, и у него самая «красивая» презентация среди всех инструментов.

У них есть платная версия, которая предлагает больше функций и привилегий, но я никогда не пробовал ее, поэтому не могу дать рекомендацию или оценить ее истинную ценность или потенциал.

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

Как улучшить скорость вашего сайта

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

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

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

Оптимизируйте свои изображения

Картинка стоит тысячи слов или, с точки зрения размера файла, 100 000 слов.

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

К счастью, оптимизация изображений проста и может выполняться массово с помощью плагинов.

Если вы используете WordPress, просто скачайте EWWW Image Optimizer и массово редактируйте все свои загрузки. Это займет у вас всего несколько кликов, и вы можете уйти, пока он делает тяжелую работу.

Вы будете поражены тем, сколько улучшений вы увидите только от оптимизации изображений.

Выбор темы

Если вы используете тему для своего веб-сайта на такой платформе, как WordPress, вам не понравится то, что я скажу дальше.

Хотя это может не быть проблемой для вас, некоторые темы плохо оптимизированы для скорости. Это полностью зависит от вашей конкретной темы.

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

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

Удалите ненужные плагины

Когда я помогаю клиентам оптимизировать их сайты, первое, что я делаю (после оптимизации изображений), — это смотрю, какие плагины у них установлены и активны.

Меня часто удивляет то, что я нахожу — тонны бесполезных косметических плагинов, дублирование отслеживания Google Analytics. Вы называете это.

Внимательно посмотрите на свой список плагинов — все, что вы не используете активно, должно быть удалено.

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

Размер страницы

Слишком много больших изображений, видео или слишком много ненужных строк кода в ваших файлах .htaccess или JavaScript могут способствовать замедлению работы сайта.

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

Кроме того, что касается встроенных видео, это часто большие файлы, включающие более одного ресурса JavaScript.

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

GZip-сжатие

Gzip — это приложение, которое уменьшает размер любого ресурса размером более 150 байт. Мы говорим о CSS, JavaScript, HTML и т. д.

В Интернете доступно множество документации о том, как начать использовать это, и это определенно повлияет на скорость вашей страницы.

Минимизировать и объединить CSS и JS

Это может быть немного сложно, и вам нужно быть продвинутым пользователем, чтобы разобраться во всем этом - я сам не понимаю всего этого, чтобы дать вам подробный совет.

Но я могу вам сказать, что есть плагины, которые могут помочь в этом, если вы используете WordPress.

• BWPMinify — отличный и удобный плагин, который может быть именно тем, что вы ищете. Он может внести ряд улучшений, не требуя дополнительных знаний пользователя.
• Автооптимизация — еще один способ, который может оказаться полезным.

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

... в том, что все?

Хах, пожелаешь.

Я знаю, что все это может быть трудно переварить, если вы не особенно знакомы с предметом, но это становится легче.

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

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