Ссылка на документ делается обычным элементом <a>: сначала загрузите файл в доступную папку сайта, затем укажите его адрес в href. До публикации выберите ожидаемое действие: открыть документ в браузере или предложить скачивание. Для приватных и персональных документов публичная ссылка не подходит, там нужен защищённый доступ.
Открытие и скачивание: какой вариант выбрать
Если документ нужно быстро прочитать, используйте обычную ссылку. Браузер сам решит, показать поддерживаемый формат или передать его приложению. Если человеку нужна локальная копия, можно добавить атрибут download, но MDN предупреждает, что он надёжно работает для адресов того же источника, а итоговое поведение зависит от браузера и заголовков сервера.
- Обычная ссылка подходит для инструкции, меню, отчёта и другого материала, который читают сразу.
- Скачивание подходит для шаблона, бланка или файла, который нужно заполнить локально.
- Страница с кратким описанием подходит, если перед открытием нужно объяснить версию, автора и условия использования.
- Закрытая выдача подходит для договора, персональных данных и материалов только для клиентов.
Правило выбора: публичная ссылка сообщает адрес любому, кто её получил. Если сам адрес должен оставаться секретом, не маскируйте его кнопкой, а настройте авторизацию и проверку прав на сервере.
Как подготовить файл и постоянный адрес
Для чтения обычно удобен PDF: он сохраняет макет и открывается во многих браузерах. Исходный DOCX оставляйте только когда посетителю действительно нужно редактирование. Если вы превращаете страницу в документ, сначала проверьте способы сохранить сайт в PDF, чтобы в файл не попали обрезанные блоки и служебные элементы.
- Дайте файлу понятное имя латиницей без пробелов, например
guide-registration.pdf. - Создайте на сайте отдельную папку, например
/files/, и не смешивайте документы с изображениями интерфейса. - Загрузите файл и запишите его конечный адрес:
/files/guide-registration.pdf. - Откройте этот адрес напрямую в новой вкладке до добавления кнопки.
- Добавьте ссылку в нужное место и повторите проверку из приватного окна браузера.
Относительный адрес с начальным слешем привязан к вашему домену и не ломается при переходе между страницами сайта. Если документ находится на другом сервисе, используйте полный адрес и отдельно проверьте правила доступа этого сервиса. Гайд по ссылкам между страницами объясняет разницу между относительными и полными адресами.
Теория понятна, дальше нужен ваш сайт, а не пример из статьи. На бесплатном вебинаре страницу собирают с нуля и сразу публикуют в интернете.
Собрать свой сайтКод для просмотра документа
Для обычного открытия достаточно ссылки с описательным текстом. Не пишите «нажмите здесь»: человек должен понять назначение ссылки вне окружающего абзаца. Такой принцип соответствует критерию назначения ссылки в руководстве W3C по доступности.
<p>
<a href="/files/guide-registration.pdf">
Инструкция по регистрации, PDF
</a>
</p>
Открывать ссылку в новой вкладке необязательно. Если используете target="_blank", предупредите об этом в тексте или интерфейсе, иначе смена вкладки может быть неожиданной. Для файла на своём сайте сохраняйте одинаковый адрес, чтобы внешние ссылки и закладки не устаревали.
По теме: Как сделать сайт публичным: публикация и проверка 2026
Код для скачивания
Атрибут download подсказывает браузеру скачать файл и может предложить имя. Это подсказка, а не абсолютная команда: серверный заголовок Content-Disposition и настройки браузера могут изменить результат. При конфликте имя из серверного заголовка имеет приоритет, что описано в справке MDN о Content-Disposition.
<a href="/files/registration-template.docx"
download="registration-template.docx">
Скачать шаблон регистрации, DOCX
</a>
Если файл хранится на другом домене, атрибут download может не сработать. Не пытайтесь исправить это скриптом на странице. Либо настройте заголовки на сервере файла, либо оставьте обычную внешнюю ссылку и честно подпишите, что документ откроется на другом сайте.
Один собранный сайт учит больше десяти инструкций, потому что ошибки видны сразу. На бесплатном эфире по вайбкодингу показывают, как описать идею словами и получить работающую страницу, а участникам достаётся гайд.
Собрать сайт с ИИКак сделать ссылку в конструкторе сайта
В конструкторе последовательность та же, хотя названия кнопок различаются. Сначала загрузите документ в медиатеку или файловое хранилище, скопируйте выданный адрес, затем назначьте его тексту или кнопке. Не вставляйте путь к файлу на своём компьютере вроде C:\Documents\file.pdf: такой путь работает только на вашем устройстве.
- После загрузки откройте опубликованный адрес, а не предпросмотр редактора.
- Проверьте доступ без входа в аккаунт конструктора.
- Укажите формат рядом со ссылкой, если он неочевиден.
- Не обещайте скачивание, если сервис всегда открывает свою страницу просмотра.
- При замене файла проверьте, сохранился ли прежний публичный адрес.
Если конструктор экспортирует проект файлами, включите папку документов в резервную копию. Инструкция по выгрузке сайта поможет проверить, что ссылки не указывают на временное хранилище редактора.
По теме: Как сделать сайт-тест: квиз с баллами и результатом
Проверяемый чек-лист перед публикацией
Проверяйте не кнопку, а весь путь от страницы до правильного содержимого. Кнопка может выглядеть исправной и вести на старую версию документа.
- Откройте страницу в приватном окне без входа в административную панель.
- Нажмите ссылку на компьютере и телефоне.
- Сверьте название и дату внутри открывшегося документа.
- Вернитесь на страницу и убедитесь, что навигация не потеряна.
- Скопируйте адрес ссылки и откройте его напрямую.
- Временно измените имя тестового файла и убедитесь, что сервер показывает 404, а не главную страницу сайта.
- Верните правильное имя и повторите проверку.
Для важного документа добавьте на страницу его название, назначение и дату актуальности. Саму юридическую значимость, электронную подпись и правила хранения нельзя заменить HTML-ссылкой. Если требуется указать автора или реквизиты, сначала определите, что должно быть на странице, а что внутри файла. Смежный пример есть в разборе подписи на сайте.
Диагностика частых сбоев
Ссылка отдаёт 404. Сравните регистр букв, расширение и папку в href с реальным именем файла. На Linux Guide.pdf и guide.pdf могут быть разными путями.
Вместо скачивания открывается просмотр. Проверьте, находится ли файл на вашем домене, есть ли download и какой Content-Disposition возвращает сервер. Если сервер чужой, оставьте обычную ссылку.
Владелец видит файл, а посетитель нет. Откройте ссылку без авторизации. Скорее всего, файл остался в закрытом облаке или доступен только администратору конструктора.
Открывается старая версия. Проверьте адрес и кэш. Для нового содержания безопаснее сохранить постоянную страницу описания, а версии файлов различать осознанно, не случайным переименованием.
По теме: Как сделать ответы на сайте: FAQ без лишнего JavaScript
Когда публичная ссылка не подходит
Не размещайте по открытому адресу договоры с персональными данными, закрытые инструкции, медицинские сведения и другие материалы с ограниченным доступом. Запрет индексации не равен защите: адрес можно переслать или найти в журнале. Нужна серверная проверка пользователя перед каждой выдачей файла, журнал доступа и понятный срок хранения.
Частые вопросы
Можно дать ссылку на Word-документ?
Да. Подпишите формат DOCX и используйте скачивание, если файл предназначен для редактирования. Для чтения без редактора подготовьте PDF.
Почему адрес с Google Drive открывает страницу, а не файл?
Облачный сервис управляет просмотром и доступом на своём домене. Используйте его официальную ссылку общего доступа и не обещайте прямое скачивание без проверки.
Нужно ли ставить target="_blank"?
Нет. Новая вкладка полезна, когда документ нужен параллельно форме, но смену вкладки следует обозначить.
Как заменить документ и не сломать ссылки?
Если содержание обновляется как одна публикация, сохраните прежний путь и замените файл после резервной копии. Если версии должны сосуществовать, дайте им разные имена и обновите страницу со списком версий.
На воркшопе «Сайты с ИИ» вы соберёте страницу, опубликуете её и проверите рабочие ссылки. Подойдёт, если хотите не только вставить документ, но и довести весь сайт до понятного результата.
Записаться на воркшоп