Подробное описание проекта по запуску современного корпоративного сайта на платформе «1С-Битрикс: Управление сайтом» и решении «Аспро: Корпоративный сайт 3.0» для продвижения брендов промышленного оборудования. Хотите узнать, как мы работаем? Сейчас расскажем, запасайтесь попкорном!
Задача по созданию сайта
В «АБМ» ИТ-интегратор обратились представители компании «Термомеханикс» с запросом на разработку сайта по продаже оборудования для термообработки бренда Deya. Особенность обращения — задачу необходимо было выполнить к началу выставки производственных компаний, на которой планировалось принимать обращения от новых клиентов через сайт.
До выставки оставалось чуть больше двух недель — за этот срок мы должны были запустить полноценный корпоративный сайт с брендированием, наполнением, поисковой оптимизацией и возможностью сбора обращений.
Как сайт будет реализован
В короткий срок реализовать проект можно только на готовом решении, поэтому предложили клиенту заказать сайт на решении «Аспро». В нём уже есть всё необходимое: структура разделов и страниц, функциональность, гибкие настройки, адаптация под фирменный стиль, каталог товаров и услуг, возможность сбора обращений через различные каналы коммуникаций.
В процессе переговоров оказалось, что клиент ранее уже приобретал лицензии на «1С-Битрикс: Управление сайтом» в редакции «Стандарт» и «Аспро: Корпоративный сайт 3.0». Имеющиеся лицензии полностью подходили под задачи проекта, но срок их действия подходил к концу — было согласовано продлить лицензии в процессе работы.
Домен у заказчика также ранее был приобретён, необходимо было порекомендовать сервер с возможностью неограниченного конфигурирования вместо имеющегося хостинга. Мы предложили оптимальный по безопасности и производительности виртуальный сервер сайта «Таймвеб» по тарифу Cloud 50.
Со стороны клиента нам был предоставлен бриф, контент для наполнения каталога и контент для сайта в целом. Что дало нам понимание об объёме работ и уверенность в том, что мы успеем создать сайт в сжатые сроки.
Управление проектом
Управление проектом по созданию сайта мы ведём в нашем «Битрикс24» — заводим проект и задачу с назначением ответственных специалистов, с учётом трудозатрат и фиксацией рабочего процесса. Детализация из таймлайна задачи после выполнения попадает в итоговый отчёт для сдачи-приёмки работ.
Создание сайта в «АБМ» ИТ-интегратор мы выполняем по отработанному годами внутреннему регламенту, который позволяет снизить сроки проведения работ с одновременным повышением их качества. Частные случаи, которые не описаны в регламенте, решаются индивидуально нашими компетентными специалистами, прошедшими обучение и сертификацию. Оперативные вопросы решаются в мессенджере и по телефону, важная и конфиденциальная информация отправляется по электронной почте.
Всё вышеописанное мы подготовили и для данного проекта, а после перешли непосредственно к реализации.
Создание сайта бренда «Deya» на «1С-Битрикс» и «Аспро»
Получение доступов и лицензий
Сначала мы запросили у клиента доступ к панели управления доменом ycdeya.ru и номер имеющегося лицензионного ключа «1С-Битрикс: Управление сайтом», к которому привязан купон лицензии «Аспро: Корпоративный сайт 3.0».
После проверки полученную информацию мы добавили во внутренний реестр с контролем доступа, что гарантирует сохранность данных и своевременное продление лицензий.
Аренда и подготовка сервера Timeweb
Имеющийся у заказчика обычный shared-хостинг (виртуальный хостинг) не подходил под задачи. В таком хостинге один сервер используется несколькими пользователями одновременно и они все вместе пользуются одним и тем же программным обеспечением без возможности его конфигурирования. А без этого снижается производительность и защищённость сайта.
Поэтому был выбран виртуальный сервер для «1С-Битрикс». Кроме вышеперечисленных преимуществ, в Таймвеб имеется удобная панель управления, выгодные тарифы в сравнении с другими провайдерами, обширные возможности и отличная поддержка.
Мы зарегистрировали аккаунт провайдера облачной инфраструктуры Timeweb и оформили заказ виртуального сервера VDS по тарифу Cloud 50 с характеристиками: CPU 2 x 3.3 ГГц, RAM 4 ГБ, NVME 50 ГБ.
Безопасность удалённого подключения была обеспечена использованием шифрования и авторизацией через ssh-ключи. Подключение выполнялось с локальных рабочих мест через интегрированную среду разработки (IDE) Visual Studio Code.
К новому серверу был привязан имеющийся домен через A-запись в DNS. Таким образом всё было подготовлено к установке сайта с конфигурированием сервера.
Настройка сервера и BitrixVM
Конфигурирование сервера начиналось с обновления операционной системы и всех установленных пакетов. После был создан пул управления сервером и настроена служба Push/RTC через NodeJS в виртуальной машине BitrixVM. Запущенное задание на создание SSL-сертификата Let's Encrypt для домена без «www» и с «www» завершилось успешно. Проверка цепочки сертификатов показала, что сертификаты валидны и установлены корректно.
Наличие SSL-сертификата значит, что сайт может работать по защищённому протоколу https, охраняя личные данные пользователей и улучшая его ранжирование в поисковых системах. Если SSL-сертификат не установлен или цепочка сертификатов имеет ошибки, то браузеры выводят уведомление о небезопасности ресурса, либо вовсе блокируют доступ к сайту.
На этом этапе VDS подготовлен для установки платформы и готового решения сайта.
Установка «1С-Битрикс» и «Аспро» с базовой настройкой
В корневую директорию сайта был загружен скрипт bitrixsetup.php и запущен мастер установки платформы «1С-Битрикс: Управление сайтом», а далее и мастер установки готового решения «Аспро: Корпоративный сайт 3.0» с тематикой «Станки и оборудование» и видом «Универсальный». В процессе установки были выполнены базовые настройки и создан пользователь с правами суперадминистратора (с ID=1) для клиента, который является неудаляемым. Для наших специалистов были созданы дополнительные пользователи с правами администратора. Установка платформы и сайта была успешно завершена.
Были выявлены и установлены обновления с предварительным созданием снапшота сервера. Далее были настроены все модули платформы, выполнены проверки платформы «1С-Битрикс» на наличие ошибок (сразу исправлялись) и проверка производительности. Проверка модуля «Проактивная защита» выявила ряд уязвимостей, для устранения которых потребовалось дополнительное конфигурирование веб-служб сервера и платформы «1С-Битрикс».
Настроен почтовый сервер на postfix для отправки писем электронной почты из «1С-Битрикс». Дополнительно для повышения доверия к почтовым отправлениям настроили DNS-записи домена: SPF, DKIM и DMARK.
Также было настроено выполнение агентов cron (планировщик событий), который работает стабильнее и производительнее, чем если бы события выполнялись на хитах.
В файле .htaccess настроили редиректы с «http» на «https» и с «www» на «без www» для склейки зеркал, чтобы дубликаты url индексировались поисковиками как один веб-ресурс, не конкурируя друг с другом. А чтобы страницы с демонстрационной информацией в процессе создания сайта не попали в поисковые системы, сайт был полностью закрыт от индексации в robots.txt.
На этом шаге было всё готово для настройки фирменного стиля, функционала и наполнения.
Настройка фирменного стиля сайта
Фирменный стиль сайта включает настройку цвета, шрифта и логотипа с иконками. У заказчика была запрошена указанная информация — нам предоставили файл логотипа, по которому были определены цвета сайта: основной красный цвет (#e40615) и дополнительный голубой цвет (#00a0e8). Цвета были применены через переменные в специальном файле custom.css.
Под начертание букв в логотипе был подобран шрифт из доступных в «Аспро».
Файл логотипа был отредактирован под потребности по размеру и пропорциям. На основе логотипа были сгенерированы файлы иконок в разных размерах для иконки браузера favicon и файла manifest.json, из которого иконки применяются для мобильных и прочих устройств. Логотип и иконки были добавлены в настройки «Аспро».
Настройка структуры сайта на основе «Аспро»
Работы по наполнению начинались с подготовки файла структуры со всеми страницами в табличном виде. Провели переговоры с заказчиком по структуре на основе файла, было решено использовать следующие страницы и разделы: «Главная страница», «Каталог», «Услуги», «Статьи», «О компании», «Контакты», «Соглашение на обработку персональных данных». А также было определено, откуда и какой контент будет использоваться.
Были скрыты неиспользуемые страницы и разделы (но не удалены), которые изначально входят в состав «Аспро», для всех пользователей в публичной части. При этом у администраторов доступ остался. Аналогично настроены все меню сайта, для администраторов скрытые пункты меню отмечены специальной иконкой. Всё, что было скрыто — отмечено запрещённым для индексации роботами поисковых систем в файле robots.txt. Таким образом, администратор может безопасно готовить скрытые разделы и страницы перед публикацией, не утратив их.
Наполнение сайта
Контент для каталога товаров предоставлен самым первым — с него и начали, наполнив раздел «Каталог». По просьбе заказчика были убраны подразделы в каталоге, чтобы в корневом разделе сразу были выведены товары. Стандартной подобной настройки не было, поэтому мы нашли решение с редиректами в файле .htaccess, исключающими подраздел в url, пример:
# RedirectMatch 302 ^/sections/delete_sections/$ /sections/
RedirectMatch 302 ^/product/multi-purpose-chamber-furnace-line/$ /product/multi-purpose-chamber-furnace-line/linii-khto-na-osnove-universalnykh-kamernykh-pechey-periodicheskogo-deystviya/
За каталогом последовало наполнение раздела «Услуги» — здесь, по согласованию с клиентом, был незначительно скорректирован демонстрационный материал решения «Аспро», который отлично подошёл под сферу деятельности заказчика.
Далее настроили раздел «Статьи» для самостоятельного наполнения клиентом. В качестве примера опубликовали одну статью, которую можно копировать и быстро делать аналогичные публикации.
Наполнены страницы «Контакты» и «О компании», дополнительно на страницы были добавлены конверсионные кнопки «Задать вопрос» и «Позвонить».
В соответствии с Федеральным законом № 152-ФЗ «О персональных данных» была сделана страница «Соглашение на обработку персональных данных».
Анонсирующие блоки с элементами каталога, услуг и блога — были выведены на «Главной странице». В самом верху настроены три адаптивных баннера в слайдере с конверсионными кнопками.
Чтобы заявки приходили в «Битрикс24» клиента, мы заменили стандартные формы обратной связи решения «Аспро» на CRM-формы «Битрикс24», что является штатным функционалом и не требует доработки. Также настроен виджет с онлайн-чатом.
В процессе были решены незначительные визуальные проблемы готового решения, для чего мы создали тикеты в поддержку разработчика «Аспро» и предоставили временный доступ — он всё самостоятельно исправил.
SEO-оптимизация и веб-аналитика
Для всех страниц и разделов были настроены мета-теги:
- title — заголовок страницы, отображается в результатах поиска и в заголовке вкладки браузера.
- description — краткое описание содержания страницы, которое отображается в сниппете поисковой выдачи.
Для статических страниц мета-теги были добавлены фиксированно, для динамических разделов (каталог, услуги, блог) — настроены шаблоны автоматической генерации мета-тегов.
Также настроены теги изображений:
- alt — текстовое описание изображения, которое отображается, когда картинка не может загрузиться. Также используется программами экранного доступа, помогающими людям с нарушением зрения воспринимать информацию.
- title — задаёт всплывающую подсказку, которая появляется, когда пользователь наводит курсор на изображение. Этот текст не заменяет Alt, а дополняет его, предоставляя дополнительную информацию о картинке.
Отдельно в начало страницы динамических разделов добавлено краткое описание, по которому поисковики смогут правильно определить тематику, а пользователь сразу поймёт, о чём данный раздел.
Настроена и сгенерирована карта сайта sitemap.xml, ссылка на которую была указана в настройках индексации сервиса Яндекс.Вебмастер.
Для сбора данных о посещаемости создан и добавлен счётчик веб-аналитики «Яндекс.Метрика». Доступ к счётчику предоставлен заказчику на его адрес электронной почты.
Подготовка к запуску и публикация сайта
Установлены актуальные обновления на сервер и платформу, а также на решения из «Маркетплейс», в том числе на «Аспро».
Проведены стандартные проверки платформы: полное тестирование системы, проверка и оптимизация базы данных, проверка производительности, сканер безопасности и другие.
Далее сайт был открыт для индексации роботами поисковых систем в robots.txt и создана его резервная копия средствами «1С-Битрикс».
Установка сайта на сервер завершена. С этого момента сайт был полностью готов для информирования посетителей и приёмки обращений.
Создание второго сайта «Термомеханикс» по всем брендам
Спустя несколько месяцев от клиента получен запрос на разработку второго сайта по всем брендам для своей компании.
Если на первом сайте фокус сделан на один бренд «Deya» и позиционирование в качестве представителя в России. То на новом акцент должен быть сделан на компании «Термомеханикс» и отдельное внимание должно быть уделено продажам оборудования для термообработки разных производителей.
Кстати, клиент снова участвует в выставке — «Термообработка 2024»! На этот раз к нам обратились заранее, а значит будет больше времени на планомерную работу.
Копирование и установка второго сайта на «Аспро»
«1С-Битрикс» поддерживает многосайтовость — это возможность создавать несколько сайтов на одной лицензии продукта. Все веб-ресурсы имеют разные адреса и публичную часть, но при этом одну административную панель и базу данных. «Аспро: Корпоративный сайт 3.0» также может использоваться для нескольких сайтов. Что в итоге составляет существенную выгоду на лицензиях.
В виртуальной машине BitrixVM был создан второй сайт с ссылкой на ядро Bitrix первого сайта (тип ядра: link). Во второй сайт также было установлено решение «Аспро: Корпоративный сайт 3.0» через мастер. Файлы сайта (за исключением ядра) были заменены файлами первого сайта. Таким образом мы получили практически полную копию первого сайта.
Для брендирования второго сайта компании «Термомеханикс» были настроены: логотип и иконки для браузера, шрифт и цвета элементов интерфейса. Настроено применение разного оформления для каждого сайта через css-стили, при том, что решение «Аспро» у обоих единое.
Наполнение контентом корпоративного сайта на «Аспро»
Было проведено обсуждение и согласование структуры с заказчиком — что оставляем, а что скрываем до востребованности.
На новом сайте «Статьи» были скрыты, взамен настроен и наполнен раздел «Новости». В раздел «О компании» добавлен и наполнен подраздел «Бренды». На детальные страницы для каждого из брендов добавлены текстовые описания.
С первого сайта был скопирован контент в разделы «Услуги» и «Контакты», после чего была выполнена их настройка для корректного отображения.
В «Оборудование» были добавлены категории и товары, блок с оборудованием был выведен на «Главной» странице вместе с блоком «Бренды» и промо-баннером выставки с отдельной CRM-формой.
Были настроены и выведены CRM-формы из «Битрикс24» взамен штатных форм «Аспро». Скрыли лишние пункты меню для всех, кроме администраторов, настроили отображение нужных пунктов меню.
В подвале выведена ссылка на версию для слабовидящих, а в верхнем меню добавлена кнопка включения тёмной темы.
Поисковая оптимизация сайта SEO
После добавления контента были выполнены последние штрихи для настройки второго сайта и поисковой оптимизации (SEO) — большинство из них те же самые, что и для первого:
- Создан и установлен новый счётчик «Яндекс.Метрики».
- Открыты все разделы для индексирования в robots.txt.
- Настроены мета-теги.
- Для динамических разделов настроена автоматическая генерация мета-тегов в инфоблоках по заготовленным шаблонам.
- Второй корпоративный сайт «1С-Битрикс» переведён с временного домена на основной.
- Настроены обязательные редиректы: «http» → «https», «www» → «без www».
- Настроили и сгенерировали карту второго сайта в sitemap.xml.
- Добавили второй сайт и его карту sitemap.xml в «Яндекс.Вебмастер» и Google Search Console для ускорения индексации.
Перед участием в выставке сайт сайт был тщательно проверен, в том числе его мобильная версия. Все выявленные незначительные недочёты в оформлении устранены.
Подготовка сайта к эксплуатации
В завершение работ проведено обновление сервера с предварительным созданием снапшота для возможности быстрого восстановления, если что-то пойдёт не по плану. Выполнен переход с MySQL 5.7 на MySQL 8.0. Установлены обновления на платформу «1С-Битрикс» и на установленные решения из Маркетплейс.
Выполнено обслуживание сервера, созданы новые SSL-сертификаты для основного домена. Удалены временные поддомены из настроек платформы и конфигурации сервера. В платформе включено композитное кэширование для ускорения загрузки статического контента. В конце был удалён снапшот и сделана резервная копия проекта.
Таким образом все работы были завершены — сайт поставщика оборудования создан «под ключ», с наполнением уникальным контентом, брендированием, индивидуальными настройками, поисковой оптимизацией и тестированием.
Заказать сайт на готовом решении в «АБМ» ИТ-интегратор
В «АБМ» ИТ-интегратор были успешно и оперативно созданы 2 корпоративных сайта на платформе «1С-Битрикс: Управление сайтом» и решении «Аспро: Корпоративный сайт 3.0» для поставки промышленного оборудования. Использование технологии многосайтовости обеспечило легкую управляемость из единой административной панели и значительную экономию ресурсов на поддержке.
Оба сайта продвигают бренд нашего заказчика, знакомят его потенциальных клиентов с ассортиментом товаров и услуг, генерируют заказы и укрепляют репутацию компании на рынке промышленного оборудования.
Если вас заинтересовал наш опыт — заполните форму обратной связи и мы вас проконсультируем по лучшим вариантам создания корпоративного сайта для продажи оборудования и сервиса!
|
Оформите заявку на сайте, мы свяжемся с вами в ближайшее время и ответим на все интересующие вопросы.
|
Задать вопрос
|
