• Битрикс как установить модуль компрессия. Принципы увеличения скорости загрузки страниц. Бесплатная установка бесплатного модуля «Битрикс» из архива

    Эта заметка не будет касаться напрямую возможностей Битрикс. Я приведу несколько базовых принципов увеличения скорости работы сайта.1. Необходимо уменьшить количество HTTP-запросов.

    Сайт это не только html-страница, но и картинки, javascript-файлы, файлы стилей. Если мы уменьшим количество этих файлов, то мы увеличим скорость загрузки страницы.

    • файлы стилей можно объединить в один файл
    • файлы javascript также можно объединить в один файл
    • как бы это не звучало странно, но картинки также можно объединить в один файл, называемый css-спрайтом.

    По первому пункту все уже сделано в последних версиях движка 1С-Битрикс. Вы можете включить эти галки в настройке главного модуля.

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

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

    Для реализации третьего пункта необходимо сразу же делать верстку на основе одной картинки. О технологии создания CSS-спрайтов написано немало статей.

    2. Все CSS-файлы необходимо размещать в начале страницы

    Если вы пользуетесь стандартным подходом Битрикс к интеграции верстки в дизайн, то так у вас и будет.

    3. Минимизация кода CSS-файлов и JS-файлов, уменьшение размеров картинок, GZIP-сжатие страницы.

    Для минимизации кода CSS-файла нужно всего лишь поставить галку «Создавать сжатую копию объединенного файла CSS», для минимизации кода javascript-файлов есть специальные решения вроде http://yuilibrary.com/download/yuicompressor/ .

    Для того, чтобы включить GZIP-сжатие в Битрикс достаточно установить модуль Компрессия из стандартной поставки Битрикс.

    4. Используйте Google Libraries для загрузки больших javascript-библиотек

    Хотя бы по мере возможности. Jquery точно стоит подключать таким образом.



    //

    5. Обязательно используйте кеш браузера.

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

    // код файла.htaccess

    Header append Cache-Control "public" FileETag MTime Size ExpiresActive On ExpiresDefault "access plus 0 minutes" ExpiresByType image/ico "access plus 1 years" ExpiresByType text/css "access plus 1 years" ExpiresByType text/javascript "access plus 1 years" ExpiresByType image/gif "access plus 1 years" ExpiresByType image/jpg "access plus 1 years" ExpiresByType image/jpeg "access plus 1 years" ExpiresByType image/bmp "access plus 1 years" ExpiresByType image/png "access plus 1 years"

    На этом я закончу свой краткий обзор основных принципов увеличения скорости загрузки страниц.

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

    На системе 1С-Битрикс работают различные по сложности сайты: новостные ресурсы, визитки, социальные сети, интернет-магазины и тому подобные. Однако со временем страницы сайтов загружаются всё медленнее.

    Проблема в оптимизации изображений Битрикс, которая не производится средствами самой CMS, решается сторонними средствами. Для того чтобы картинки меньше занимали место и загружались быстрее, необходимо использовать плагин для оптимизации изображений в Битрикс. Этим плагином является решение OptiPic.

    Оптимизация изображений сайта на Битрикс через OptiPic позволяет ускорить загрузку сайта в 2–3 раза. Практика уже показала, что ресурсы действительно загружаются быстрее, что отмечают и сами пользователи. Особенно это критично для интернет-магазинов и каталогов, ведь покупатели могут не дождаться загрузки страницы и уйти на ресурс конкурентов.

    Сжатие изображений в Битрикс

    OptiPic - плагин для сжатия изображений Битрикс построен на алгоритме, который выявляет технические данные в файле изображения и удаляет их. Эти данные не влияют на качество и вид картинки, но тем не менее влияют на её размер. В некоторых случаях технические данные занимают до 90% размера файла.

    Поэтому для сжатия картинок в Битрикс применяется OptiPic. Средний показатель уменьшения размера картинок составляет 70%. К тому же достаточно один раз настроить плагин и в дальнейшем он будет работать как с картинками, которые уже загружены на сервер, так и с изображениями, добавляемыми на сайт.

    Сжатие изображений сайта на Битрикс проходит в фоновом режиме и не требует больших вычислительных мощностей. Для посетителей ресурса не будет ничего происходить, кроме ускорения загрузки страниц. Администраторы же смогут увидеть, как со временем работы плагина освобождается место на жёстком диске сервера за счёт снижения размера картинок.

    Оптимизация картинок в Битрикс больше не потребует ручного вмешательства администратора. Настройте OptiPic и все необходимые операции будут проводиться автоматически.

    Что такое сжатие изображений

    Оптимизация картинок является специальной обработкой графического файла с целью минимизировать его размер без потери визуального качества.

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

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

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

    Что даст оптимизации изображений для вашего сайта
    • Экономия места на диске.
    • Ускорение загрузки страниц.
    • Увеличение конверсии.
    • Более качественное ранжирование сайта при поисковой выдаче.

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

    Преимущества сервиса OptiPic
    • Отсутствуют ежемесячные платежи.
    • Полная автоматизация.
    • Предоставление бесплатной помощи при подключении.
    • Интернет-адрес (URL) сжатых картинок не изменяется, они и дальше будут храниться у Вас на сайте.
    • Для подключения и использования сервиса не нужно иметь специальных навыков в программировании или администрировании.
    • В системе отсутствуют ограничения на размер изображений.
    • Техподдержка на русском языке.
    Каким образом оптимизация изображений может ускорить сайт?

    Страница любого сайта чаще всего состоит из:

    • изображений;
    • html-кода (текстовое содержание, верстка, разметка);
    • видео;
    • javascript-скриптов с логикой, выполняющихся со стороны браузера;
    • файлов-css со стилями страницы.

    Такой пункт как изображения, занимает на страницах сайта большую часть всего объема и является самой «тяжелой» частью страниц. Уменьшение (оптимизация) изображений бесспорно позволит существенно сделать более быстрой загрузку любого интернет-ресурса.

    Соответственно, если изменить (в меньшую сторону) объем изображений, все страницы сайта начнут грузиться значительно быстрее.

    Сжатие картинок на сайте даст возможность уменьшить их объем до 75-98%, не теряя при этом свое визуальное качество.

    Как подключить OptiPic к 1С-Битрикс для сжатия изображений? Зарегистрируйтесь и добавьте свой сайт в личный кабинет

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

    Скачайте и установите модуль на свой сайт

    После добавления сайта в систему перейдите на закладку Скачать модуль.

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

    • сайт
      • config.php
      • help.php
      • index.php

    А на сайте после этого должны быть доступной такая страница http://your-domain..php .

    Выберите тариф и пополните счет

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

    После того, как первая индексация завершится, система покажет какой объем изображений (сколько гигабайт?) было обнаружено на вашем сайте. Сделать это можно на вкладке Индекс сжатия и статистика.

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

    Сегодня узнаем как грамотно оформлять header.php в Битрикс , как правильно подключать.css и.js в header.php , как правильно подключать jQuery в Битрикс и как включить сжатие.css и.js файлов в Битрикс .

    Это очень острая и актуальная проблема на сегодняшний день. Самые частые обращения по модулям связаны с ошибками в скриптах, когда неправильно подключена jQuery в header.php , и очень часто подключено несколько jQuery, но должна быть подключена на всех страницах сайта только одна библиотека jQuery и самой первой среди всех скриптов шаблона сайта.

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

    Итак, как грамотно должен быть оформлен файл header.php шаблона сайта в Битрикс:

  • Перед не должно быть никаких пробелов и переносов
  • Кодировка страницы задается перед
  • После заголовка перечисляются все мета-теги
  • После мета-тегов подключаются.css стили сайта
  • И только после подключения.css стилей подключаются все.js скрипты
  • Комментарии к IE по возможности лучше опустить в самый конец перед закрывающим тегом
  • Пример header.php для HTML 5 DOCTYPE