Печатная версия страницы и выгрузка коммерческого предложения

Снабженец нашёл нужную позицию в вашем каталоге, нажал «печать», чтобы отнести распечатку руководителю на согласование, — и получил четыре листа, на которых половину места занимает меню, шапка с баннером, боковая колонка с акциями и кнопка «наверх». Сама таблица с характеристиками съехала и обрезалась по правому краю. Цену не видно. Он поворчал, сделал снимок экрана, вставил в документ и отправил дальше — уже не вашу страницу, а картинку. А мог бы получить аккуратный лист, где сверху ваш логотип и телефон, посередине позиция с ценой, а внизу контакты. Разница между этими двумя исходами — один небольшой файл со стилями печати, который делается за час и который почти никто не делает.

Кому и зачем печатают страницы сайта

Кажется, что в наше время никто ничего не печатает. На практике печатают, и довольно много — просто не те, кого обычно представляют себе владельцы сайтов.

Снабженцы и закупщики. Распечатывают карточки товаров и прайсы для согласования внутри компании. Часто согласование идёт на бумаге просто потому, что так заведено.

Проектировщики и инженеры. Печатают технические характеристики, чтобы приложить к расчётам или взять на объект.

Люди, принимающие решение не в одиночку. Распечатал страницу услуги — обсудил с супругой, с партнёром, с руководителем.

Монтажники и мастера. Распечатывают инструкции, схемы, порядок работ и берут с собой.

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

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

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

Что не так с печатью по умолчанию

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

Шапка сайта с меню и баннером занимает треть первого листа. Иногда её ещё и повторяет на каждом.

Боковые колонки, блоки акций, подборки «похожие товары», кнопки и формы — всё это печатается и съедает место.

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

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

Изображения либо не помещаются, либо занимают целый лист.

Ссылки печатаются как подчёркнутый текст, и непонятно, куда они вели.

Нет контактов. Человек, который через неделю нашёл распечатку на столе, не знает, куда звонить.

Нет цены в понятном виде, если она подгружается скриптом.

Итог: четыре листа вместо одного, половина нужной информации потеряна, а имени вашей компании на бумаге нет вообще.

Что должно быть на печатной версии

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

Шапка документа: логотип, название компании, телефон, адрес сайта. Компактно, одной строкой или небольшим блоком.

Заголовок страницы — название товара или услуги.

Основное содержимое: описание, характеристики, состав работ, цена, сроки. Всё, что относится к делу.

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

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

Чего быть не должно: меню, боковых колонок, форм, кнопок, всплывающих окон, блоков «читайте также», ссылок на социальные сети, баннеров, счётчиков, онлайн-консультанта.

Технические детали, которые определяют результат

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

Ширина. Содержимое должно перестраиваться под ширину листа. Фиксированные значения в точках экрана нужно заменять на относительные.

Таблицы. Главная боль. Широкая таблица характеристик на листе не помещается. Варианты: уменьшить шрифт, убрать лишние колонки, повернуть таблицу в две колонки «параметр — значение», а для очень широких — разрешить печать в альбомной ориентации.

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

Фоны и цвета. Всё, что было белым текстом на цветном фоне, должно стать чёрным текстом. Иначе исчезнет.

Ссылки. Полезный приём: при печати рядом со ссылкой автоматически выводится её адрес. Для документов, которые пересылают, это удобно.

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

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

Кнопка «печать» и кнопка «сохранить»

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

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

Отдельный вопрос — выгрузка в документ. Для многих сценариев это полезнее печати: человек хочет не распечатать, а получить файл, который можно переслать. Здесь есть два подхода.

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

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

Коммерческое предложение из корзины

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

Что это даёт. Клиент получает документ, с которым идёт согласовывать бюджет, — и в этом документе ваше имя, ваши цены и ваши контакты. Менеджер не тратит час на составление предложения вручную. Обращение приходит с уже собранным составом, и разговор начинается не с «что вам нужно», а с обсуждения условий.

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

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

Что ещё полезно печатать

Кроме карточек товаров и страниц услуг, есть материалы, которые распечатывают регулярно, и им стоит уделить внимание отдельно.

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

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

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

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

Список выполненных объектов. Для подрядных компаний это часть материалов к переговорам.

Как это связано с продвижением «3 в 1»

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

Первая точка — поиск и сайт. Человек нашёл вас, распечатал страницу, отнёс руководителю. Если на листе нет вашего названия и телефона, руководитель видит безымянную бумажку и ищет поставщика заново. Если есть — вы участвуете в обсуждении, на котором вас нет. Кроме того, адрес страницы, напечатанный в подвале, — это возможность вернуться на сайт; без него человек будет искать заново и может найти конкурента.

Вторая точка — Яндекс.Справочник, карточка в Яндекс Картах и Яндекс Бизнесе. Контакты в печатной версии должны совпадать с контактами в карточке. Расхождение — обычная и дорогая ошибка: человек звонит по номеру с распечатки полугодовой давности, а номер отключён. Единый источник контактов на сайте, из которого они подставляются и в шапку, и в подвал, и в печатную версию, эту проблему снимает.

Третья точка — 2ГИС. То же самое. Плюс полезная мелочь: в печатном подвале имеет смысл указывать не только телефон, но и то, что компанию можно найти в картах и в 2ГИС, — часть людей предпочтёт открыть карточку и посмотреть отзывы, и это тоже путь к обращению.

И общий принцип: обращения, пришедшие с распечатки, выглядят как «звонок неизвестно откуда». Чтобы их учитывать, полезно указывать в печатной версии отдельный номер или хотя бы спрашивать у звонящих, откуда они узнали. Иначе этот канал остаётся невидимым, а он у некоторых компаний даёт заметную долю заявок.

Частые ошибки

Настроить печать только для главной страницы. Печатают как раз не её, а карточки товаров и страницы услуг.

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

Спрятать цену. Если цена подгружается скриптом после загрузки страницы, при печати её может не оказаться. Проверяется только реальным предпросмотром.

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

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

Не проверить на настоящем принтере. Предпросмотр в браузере и реальная печать иногда расходятся, особенно по полям и по цветам.

С чего начать

Откройте предпросмотр печати на пяти типовых страницах своего сайта прямо сейчас. Скорее всего, вы увидите ровно то, что описано в начале.

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

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

Если вы хотите, чтобы страницы вашего сайта нормально печатались и превращались в документы с вашим оформлением, или вам нужна выгрузка предложения из корзины — специалисты компании «Сайты Профессионально» бесплатно посмотрят, как сейчас печатаются ваши страницы, и предложат решение под ваш сценарий работы с клиентами. Мы занимаемся разработкой, сопровождением и продвижением сайтов более девятнадцати лет и хорошо знаем, как устроены продажи, где решение принимается не одним человеком. Разбор бесплатный и ни к чему не обязывает.