Обновление шаблона 1C Битрикс для сайта по производству станков с ЧПУ

Содержание:

Клиент

Компания СК Роутер представляет продукцию отечественного завода по производству фрезерно-гравировальных станков с ЧПУ по металлу, дереву, пластику, камню и другим разнообразным материалам.

Исходные данные

Оказываемые услуги

• Техподдержка сайта
• SEO-продвижение

Проблема проекта

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

Справочная информация:
SEO — работы, направленные на улучшение удобства сайта для пользователей и увеличение его посещаемости.

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

Справочная информация:
— Header (шапка сайта) — это верхняя часть веб-страницы, которая облегчает навигацию и является первым элементом, привлекающим внимание пользователя.
— Footer (подвал сайта) — это нижняя часть веб-страницы, служащая для логического завершения, улучшения навигации и размещения ссылок на дополнительные страницы.
— Юзабилити — это показатель того, насколько легко и удобно пользователю взаимодействовать с интерфейсом сайта.

Решение проблем

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

Кроме того, своевременное обновление ядра сайта, шаблонов и обновление версии php является отличной профилактикой вирусов.

Справочная информация:
— Шаблон сайта на 1С-Битрикс — это заранее подготовленный макет для заполнения фотографиями, контентом и другими элементами.
— Ядро сайта Bitrix — это системная часть, которая обеспечивает работу пользовательской части.
— PHP — это скриптовый язык программирования, используемый при разработке сайтов. С его помощью можно отправлять формы, работать с базами данных, использовать сессии, cookies и многое другое. Возможности использования языка в проекте зависят от версии PHP, установленной на сайте или сервере.

Этапы обновления шаблона

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

Справочная информация:
Бэкап сайта — это резервная копия всех файлов сайта (контента и базы данных).

Мы обновили шаблон на тестовой версии сайта, но столкнулись с проблемой кодировки. Вопрос решили с технической поддержкой битрикса и сменили кодировку сайта на наиболее распространенную UTF-8. Ранее кодировка была WINDOWS-1251. Выбор кодировки — индивидуальное решение для каждого сайта, но UTF-8 используют намного чаще — ее поддерживают все популярные браузеры и распознают поисковики, а еще ее удобнее использовать для сайтов на разных языках. Конкретно в нашей ситуации смена кодировки была критичной для обновления шаблона.

3. После смены кодировки мы обновили шаблон и начали исправление ошибок в работе сайта. Первоначально разработчик, следуя регламенту, проверяет:
• работу форм обратной связи;
• загрузку всех страниц;
• внешний вид блоков, кнопок, всплывающих окон;
• наличие и работоспособность необходимых модулей, плагинов, интеграций;  
• корректность кода;
• корректный адаптив на различных устройствах и браузерах.

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

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

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

Так как над сайтом активно работает seo-специалист, то после завершения работ обновления он также проверит сайт и при необходимости даст рекомендации по доработке.