Генератор ссылок Markdown

Введите URL ссылки и текст ссылки, и генератор выдаст аккуратный синтаксис ссылки Markdown, [text](url), с необязательной всплывающей подсказкой заголовка и вариантом ссылочного стиля, который выносит URL за пределы абзаца. Это удобно, когда вы копируете длинный URL с параметрами отслеживания и хотите сохранить читаемость абзаца, не ломая ссылку.

Как создать ссылку Markdown

  1. 1

    Вставьте URL

    Абсолютный или относительный. Инструмент кодирует пробелы и зарезервированные символы в формате URL.

  2. 2

    Введите текст ссылки

    То, что читатели видят как кликабельный текст.

  3. 3

    Добавьте заголовок (необязательно)

    Появляется при наведении курсора в большинстве обработчиков.

  4. 4

    Выберите стиль

    Встроенный `[text](url)` или ссылочный `[text][ref]` с определением ниже.

  5. 5

    Скопируйте и вставьте

    Копирование в один клик в ваш документ или README.

Четыре варианта ссылок

Встроенный, без заголовка:

[Читать документацию](https://example.com/docs)

Встроенный с заголовком (всплывающая подсказка при наведении):

[Читать документацию](https://example.com/docs "Полная документация")

Ссылочный стиль (URL определён ниже):

Откройте [документацию][docs] или [журнал изменений][cl].

[docs]: https://example.com/docs
[cl]:   https://example.com/changelog

Автоссылка (URL является одновременно текстом и целью):

<https://example.com>

Когда какой вариант выбрать

  • Встроенный, для нечастых ссылок, где URL короткий и абзац по-прежнему хорошо читается.
  • Ссылочный стиль, когда вы приводите один и тот же URL несколько раз или когда URL представляет собой отслеживающего монстра на 200 символов, который иначе нарушил бы течение абзаца.
  • Автоссылка, для случая «вот наша страница документации», когда вы хотите, чтобы URL был виден и как текст, и как цель.

Обработка специальных символов

  • Пробелы в URL требуют %20, иначе ссылка обрывается на пробеле.
  • Круглые скобки в URL требуют URL-кодирования как %28 и %29, иначе парсер Markdown их проглотит.
  • Квадратные скобки в тексте ссылки нужно экранировать как \[ и \], чтобы парсер не воспринял их как вложенный синтаксис ссылки.

Советы по доступности

  • Избегайте «нажмите здесь». Текст ссылки вроде нажмите здесь или читать далее бесполезен, когда пользователи программ чтения с экрана перебирают ссылки табуляцией. Используйте описательный текст: [руководство по установке](...).
  • Не используйте сам URL в качестве текста ссылки для длинных URL, это неудобно для вспомогательных технологий и некрасиво выглядит в печати.
  • «Открыть в новой вкладке», это сырой HTML (target="_blank"), а не Markdown. Большинство обработчиков, принимающих сырой HTML, учтут его; чистый CommonMark, нет.

Однострочный приём

В комментариях на GitHub вставка URL рядом с выделенным текстом автоматически превращает его в ссылку Markdown. Удобно, когда вы уже находитесь в редакторе.

Часто задаваемые вопросы

Нет. target="_blank" требует сырого HTML. Большинство обработчиков Markdown допускают запасной вариант на HTML: <a href="..." target="_blank" rel="noopener">text</a>.

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

Когда один и тот же URL встречается несколько раз, когда URL длинные (параметры отслеживания, UUID) или когда вы хотите собрать все ссылки в конце документа для более удобного сопровождения.

Да, в большинстве обработчиков. [другой документ](./other.md) ссылается на другой файл в той же папке. Поведение различается между GitHub, Obsidian и генераторами статических сайтов, проверьте в своей целевой среде.

Сопутствующие инструменты

Смешивание цветов

Смешайте два HEX-цвета в 2-20 равномерных образцов. Каждый промежуточный цвет показывается как HEX-код в верхнем регистре, включая оба края.

Генератор вымышленных телефонных номеров

Создавайте до 50 вымышленных номеров из официально зарезервированных диапазонов пяти стран.

Генератор конфигурации webpack

Создайте webpack.config.js для webpack 5 под чистый JavaScript, React или Vue: TypeScript, Babel, CSS или Sass, изображения, HtmlWebpackPlugin, dev-сервер и команда npm install.

Генератор бейджей README

Создавайте бейджи shields.io для файлов README на GitHub: статус сборки, версия, лицензия, число загрузок и покрытие кода. Просмотрите и скопируйте фрагмент Markdown.

Генератор случайных букв

Генерируйте случайные буквы A-Z. Выберите количество, верхний или нижний регистр либо смешанный вариант для игр, заданий и уроков.

Генератор случайных адресов

Создавайте 1–20 похожих на адрес записей для макетов и тестов в трёх упрощённых форматах.

Инструмент доступен на других языках