Для оптимизации страниц для печати использую @media print в CSS. В нем скрываю элементы, которые не нужны при печати (навигация, футеры, боковые панели), изменяю стили для улучшения читаемости (размер шрифта, интервалы), убираю фоновые изображения и тени. Также добавляю разбиение на страницы с помощью break-before, break-after и управляю ориентацией с помощью @page. Могу использовать специальные классы, например .no-print, для быстрого скрытия элементов.
Вот примеры:
css
css
css
css
Для более сложной кастомизации или добавления информации (например, номера страниц, колонтитулы) можно использовать директиву @page.
Также стоит учитывать, что некоторые специфичные стили (например, position: fixed) могут вести себя непредсказуемо при печати и требовать отдельных правил для @media print.
Важно протестировать результат печати в разных браузерах.