Markdown

Markdown, эмблемаMarkdown (англ. "mark" – от англ. "пометка" и "down" – "вниз") – упрощённый язык разметки текста, позволяющий преобразовать специальные пометки в полноценное HTML или RTF-форматирование, включая как простые случаи выделения отдельных слов полужирным шрифтом или курсивом, так и поддержку списков или таблиц.

Несмотря на то, что файлы с разметкой Markdown имеют собственный формат .md или .markdown, они содержат только текст и могут создаваться в любых программах типа Блокнот. В отличие от полноценной гипертекстовой разметки (HTML), Markdown более прост и быстрее запоминается. Однако, его можно без проблем конвертировать и в гипертекст, и даже в документ с визуальным оформлением (RTF или DOC) без потери форматирования!

В статье ниже мы рассмотрим кому может быть полезен Markdown и как его использовать.

Современный язык разметки текста

Markdown Современный язык разметки текста
Язык:Русский
Формат:
Обновлено:2018-12-16
Автор:





Современный язык разметки текста

Освойте современный язык разметки текста Markdown и Вы сможете создавать красиво оформленные заметки в любом текстовом редакторе.

Конец года практически во всех организациях сопряжён с подготовкой целого вороха отчётной документации. Наша контора – не исключение... Половину прошедшей недели у меня ушло на то, чтобы опубликовать нужные материалы на портале открытых данных Data.gov.ua.

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

Markdown на Data.gov.ua

Неплохо зная обычный язык гипертекстовой разметки HTML, о Markdown я никогда прежде не слышал. Естественно, меня всё это заинтересовало и ниже я расскажу Вам о том, как и для чего можно использовать маркдаун в повседневной работе за компьютером.

Немного о проблеме форматирования текста

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

В контексте Windows форматированный текст мы обычно видим в текстовых процессорах вроде Microsoft Office Word, а неформатированный в простых TXT-файлах, которые открываются в Блокноте. Сравним для наглядности один и тот же текст с форматированием и без:

Текст с форматированием и без

Казалось бы, раз есть возможность в визуальном режиме красиво оформлять данные, то зачем нам простой и невзрачный текст? Однако, не всё так просто... Дело в том, что само форматирование нужно как-то сохранить. И здесь мы упираемся сразу в две проблемы.

Во-первых, форматы хранения форматированных данных могут быть очень разнообразными и не всегда универсальными. Например, если тот же Word с его форматом .DOC поддерживается большинством текстовых процессоров, то менее распространённый формат .ODT от OpenOffice Writer может у Вас и не открыться без установки самого ОпенОфиса!

Во-вторых, форматирование требует дополнительного места для хранения в виде как самой разметки, так и ряда специализированных мета-данных. Это довольно сильно влияет на размеры сохраняемого файла. Объём текстового контейнера с форматированием может в разы превосходить аналогичный контейнер без форматирования!

Размеры форматированного и неформатированного текстовых файлов

Именно для уменьшения итогового размера файла с сохранением форматирования и начали разрабатываться специальные языки разметки. Наиболее известным и распространённым из них является язык гипертекстовой разметки (аббр. "HTML" – "hypertext markup language"). Его "понимают" все браузеры и он повсеместно используется в Интернете. Однако, и он является несколько избыточным...


Что такое Markdown и для чего он нужен

Гипертекстовая разметка подразумевает заключение фрагментов текста в специальные теги, являющиеся обычно парными. Один из них открывает форматирование, а второй закрывает, возвращая тексту изначальный вид. Например, чтобы выделить текст жирным шрифтом в HTML можно использовать тег <strong> или более короткий его вариант <b>:

<strong>Жирный текст</strong>

<b>Второй вариант</b>

Нетрудно заметить, что в вышеприведённых вариантах итоговый объём данных будет увеличен на 7 (с тегом <b>) или на 17 (с тегом <strong>) байт. В сумме же теги разметки могут составлять до 50% объёма всего HTML-документа (а при использовании стилевых фрагментов, то и более).

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

Изначально новый язык разметки был создан писателем, блогером и дизайнером Джоном Грубером совместно с разработчиком и Интернет-активистом Аароном Шварцем. К концу 2004-го Шварц переключился на другие проекты, а Грубер выложил доработанный вариант Markdown во всеобщее пользование на собственном блоге Daring Fireball.

Джон Грубер

Как заметил сам Грубер, Markdown был задуман как язык для быстрого и удобного написания статей для размещения их в Интернете. Он был призван сделать неформатированный текст более наглядным и читабельным, в отличие от довольно громоздкого в этом плане HTML. При этом интерпретаторы Markdown без проблем могут формировать из размеченного таким способом текста валидный гипертекст или RTF-документы!

Более того, Markdown, имея не очень богатый синтаксис, не исключает использования внутри текста HTML-тегов. Например, если Вам нужно вставить блок или таблицу со сложным форматированием, Вы легко можете это сделать. Единственное условие – открывающий и закрывающий теги должны быть на разных строчках. Тогда интерпретатор Markdown корректно распознает гипертекст и правильно отобразит его.

Сравним возможности выделения текста при помощи Markdown с приведённым выше способом на HTML:

**Жирный текст**

__Второй вариант жирного__

*Курсивный текст*

_Второй вариант курсива_

Как видим, разметка на Markdown значительно проще и экономнее. Всего 4 дополнительных байта для жирного начертания и лишь 2 для курсива! Да и запомнить принцип выделения текста гораздо проще, чем в том же HTML. А, чтобы лучше понять все возможности этого языка разметки, предлагаю ознакомиться с его синтаксисом.

Синтаксис Markdown

Полное и официальное руководство по синтаксису Markdown можно прочесть на сайте его автора (естественно, на английском). Однако, не каждый захочет вникать в пространные объяснения всех тонкостей. Для повседневной работы будет достаточно знать только основы.

Структуризация текста

Хорошая современная статья для блога или сайта обязана иметь чёткую структуру с заголовками, подзаголовками и логическими блоками в виде разного рода абзацев. В Markdown всё это имеется! Простые абзацы вовсе не требуют дополнительных символов – достаточно лишь перевода строки. Для создания же заголовков используется несколько вариантов разметки.

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

Заголовки и подзаголовки в Markdown

Приведённый выше способ градации заголовков нагляден, но при конвертации в HTML не всегда подходит, поскольку основной заголовок интерпретируется как H1, которых по современным требованиям должно быть не более одного на веб-страницу. Обычно такой заголовок первого уровня уже прописан в движке сайта для вывода основного названия статьи.

Всего же спецификация HTML5 позволяет создавать до 6 уровней подзаголовков. Наиболее ходовыми из них являются H2–H4. Markdown позволяет реализовать такие заголовки, просто добавляя перед текстом нужное количество символов "#" (от 1 до 6, соответственно):

Заголовки 6 уровней в Markdown

Кроме того, иногда большие разделы с текстом в статье удобно отделять друг от друга горизонтальными линиями. Чтобы вставить такую линию в Markdown достаточно ввести с новой строки три (или более) символа "*", "-" или "_". Однако, если Вы в качестве символов будете использовать дефисы, то перед ними нужно будет сделать дополнительную пустую строку отступа, иначе предыдущая строка будет интерпретирована как подзаголовок!

Линии в Markdown

Выделение текста

Как мы уже видели в примере из предыдущего раздела, Markdown позволяет выделять отдельные слова и фразы курсивом и жирным шрифтом. Для этого нужный текст обрамляется с обеих сторон символами "*" или "_":

  • одна пара (*текст* или _текст_) – курсив;
  • две пары (**текст** или __текст__) – жирный шрифт;
  • три пары (***текст*** или ___текст___) – жирный курсивный шрифт.

Выделение текста в Markdown

К сожалению (а, может, и к счастью), в Markdown нет специальных символов для создания подчёркнутого текста (его можно при необходимости заменить тегом <u>). Зато есть возможность создать зачёркивание. Для этого нужное слово или фразу нужно обрамить парой тильд (~~зачёркнутый текст~~).

Списки

В Markdown очень удобно делать различные списки. Причём поддерживаются не только традиционные для веба нумерованные, маркированные и смешанные типы списков, но ещё и специальный формат списка дел!

Нумерованный список в Markdown создаётся сразу после того, как Вы введёте любое число и точку после него. Причём, число не обязано быть единицей. Markdown учитывает лишь структуру записи – "число-точка-пробел" и нумерует Ваш список по порядку:

Нумерованный список в Markdown

Кстати, если Вам нужно разорвать список добавлением какого-то текста, а затем продолжить его, то нужно действовать так:

  1. После последнего номерного пункта ставим 2 пробела.
  2. С новой строки пишем нужный текст, добавив перед ним 4 пробела или табуляцию.
  3. С новой строки продолжаем нумерацию списка (см. скриншот выше).

Маркированный список можно создать, использовав в качестве маркера один из символов: "*", "-" или "+" с пробелом после него:

Маркированный и смешанный список в Markdown

Если же поставить пробел (или табуляцию) перед пунктом с маркером, то мы получим подпункт, который будет отмечен не обычным маркером диска, а кружочком. Если же нужно увеличить уровень вложенности списка, то каждый следующий подпункт подпункта нужно отступать на дополнительные 4 пробела от предыдущего. В качестве маркера в этом случае будет выступать квадратик.

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

  1. Поставить в начале строки дефис ("-").
  2. Отступить от него один пробел.
  3. Вставить открывающую квадратную скобку ("[").
  4. Если задача не выполнена, ставим пробел, если выполнена – x.
  5. Закрываем квадратную скобку ("]").
  6. Ставим пробел и пишем название задачи (общий вид: "- [x] Задача выполнена").

Список дел в Markdown

К сожалению, не все редакторы корректно "понимают" списки дел. Например, облюбованный GhostWriter правильно подсвечивает синтаксис, но при предпросмотре не создаёт красивых чекбоксов, как это делает, например, самый популярный платный Markdown-редактор MarkdownPad...

Ссылки и картинки

Markdown позволяет вставлять в текст Вашей статьи ссылки и изображения. В общем случае ссылка вставляется конструкцией из двух частей, каждая в своих скобках: [текст ссылки] (сама_ссылка "по желанию всплывающая подсказка Title"):

Ссылки в Markdown

Если ссылка повторяется в тексте несколько раз, то для неё можно создать специальный идентификатор, который прописывается только раз, а затем автоматически заменяется на нужный адрес при экспорте. Чтобы сделать ссылку на идентификатор после текста ссылки укажите в квадратных скобках имя идентификатора ([текст ссылки][имя_идентификатора]), а его расшифровку можете прописать, например, в самом конце статьи в виде: [имя_идентификатора] ссылка "опциональный всплывающий заголовок".

Кстати, сам текст ссылки может также выступать и идентификатором. Если Вы используете такой способ записи, то в расшифровке в качестве имени идентификатора укажите лишь текст нужного линка.

Что касается вставки картинок, то синтаксис здесь практически аналогичен со ссылками, с той лишь разницей, что вначале ставится восклицательный знак: ![ALT-текст](ссылка_на_картинку "опциональный Title"):

Добавление изображения в Markdown

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

![ALT-текст][id]

[id]: ссылка_на_изображение "опциональный Title"

Единственным недостатком вставки изображений при помощи Markdown является отсутствие возможности указать размеры картинки.

Специальные блоки текста

Цитаты

Синтаксис цитат в Markdown был взят из синтаксиса цитирования электронной почты и использует символ > с новой строки и пробелом после него:

Цитата в Markdown

Обратите внимание на то, что если Вам нужно вставить определённый символ и, чтобы он не интерпретировался как спецсимвол Markdown, используйте перед ним экранирующий обратный слэш "\" (см. скриншот выше).

Код

Своё оформление есть у Markdown для фрагментов кода, которые Вы, возможно, захотите разместить в своей статье. Код обрамляется символами под названием "гравис" – ` (тильда в английской раскладке без SHIFT). Причём для однострочного кода внутри абзаца достаточно использовать по одному гравису в самом начале и в конце фрагмента, а для многострочного по три с новой строки:

Блоки кода в Markdown

Таблицы

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

Таблицы в Markdown

Вертикальные черты отделяют друг от друга ячейки в рамках строки. Однако, обратите внимание, что для генерации таблицы Вам придётся после первого ряда с заголовками столбцов создать дополнительную строку, содержащую специальные наборы символов-разделителей. В качестве разделителей можно использовать следующие последовательности:

  • --- (или более трёх дефисов);
  • :-- (или более двух дефисов).

Использование Markdown

Ну а теперь – самое главное! Где же и как можно использовать Markdown? Для удобства разделим всё многообразие применения данного языка разметки по сферам назначения.

Программы для компьютера

Несмотря на то, что Markdown – обычный текстовый формат, писать на нём в штатном Блокноте Windows – не самая лучшая идея. Как минимум нам бы не помешала подсветка синтаксиса хотя бы для самопроверки. Как максимум же, думаю, неплохо было бы и вовсе заполучить визуальный Markdown-редактор. Тем более, что всё это есть!

Начнём с подсветки. Её можно довольно легко организовать практически в любом продвинутом аналоге Блокнота. Я, например, использую Notepad++. Чтобы "подружить" его с Markdown мне понадобилось скачать файл с подсветкой синтаксиса и плагин MarkdownViewer++ для быстрого просмотра уже размеченного текста в дополнительной панельке:

Markdown в Notepad++

Если не хочется заморачиваться с установкой плагинов и прочих файлов-расширений, можно скачать готовый бесплатный текстовый редактор с поддержкой Markdown по умолчанию. Например, мне очень понравился GhostWriter, в котором я делал скриншоты для одновременного отображения текста с разметкой и отрендеренного его вида.

Интересный набор возможностей предлагает и другая бесплатная программа – Typora. Её особенностью является то, что она по умолчанию сразу превращает Markdown-разметку в готовый отформатированный текст. При этом в меню "Вид" есть возможность переключиться на работу чисто с текстом, а в меню "Файл" имеется целый набор из доступных для экспорта форматов (более десятка!):

Markdown в Typora

Наконец, существуют и полностью визуальные Markdown-редакторы. Примером такового можно назвать Texts. С его помощью Вам даже не нужно знать синтаксиса Markdown – вся нужная разметка будет вставляться нажатием нужных Вам кнопок на панели инструментов:

Texts - визуальный Markdown-редактор

Онлайн-редакторы Markdown

Поскольку Markdown изначально задумывался как средство быстрого предварительного форматирования статей для размещения в Интернете, неудивительно, что поддержка этого языка разметки имеется на многочисленных онлайн-ресурсах. Например, изначально сам разработчик Markdown Джон Грубер реализовал поддержку языка во встроенном редакторе материалов платформы для ведения блогов Movable Type.

К сожалению, платформа платная, но поддержка Markdown имеется и во многих современных бесплатных движках сайтов, вроде Wordpress, Drupal, Plone и некоторых других. Кроме того, имеются и специализированные отдельные онлайн-редакторы, которые позволяют писать на Markdown без необходимости установки какого-либо стороннего софта!

Одним из самых известных и популярных Markdown-редакторов онлайн является Dillinger:

Dillinger

Этот редактор позволяет создавать и редактировать уже готовые MD-файлы, размещённые как на компьютере пользователя, так и на облачных сервисах хранения данных, вроде Dropbox, Google Docs и ряда других. Присутствует окно предпросмотра разметки и возможность экспорта в HTML, PDF и MD-форматы.

Тем же, кто не особо хочет вникать в синтаксис Markdown, в качестве онлайн-редактора можно советовать сервис StackEdit:

StackEdit

Основным преимуществом данного редактора является то, что он визуальный. То есть, нужные символы разметки в нём можно вставлять нажатием кнопок на панели инструментов, не думая о синтаксисе! Редактировать текст здесь можно без регистрации, но для сохранения и работы с Вашими файлами потребуется войти на сервис при помощи своего Google-аккаунта.

Если же Вам нужно заполучить собственный онлайн-редактор Markdown (например, для своего сайта), то можете приглядеться к универсальному бесплатному решению от китайских производителей под названием Editor.md:

Editor.md

К Вашим услугам будет удобный двухпанельный визуальный Markdown-редактор с рядом дополнительных средств разметки, вроде, эмодзи, блок-схем и некоторых добавочных типов полей. Editor.md также поддерживает несколько тем и может использоваться как в полноформатном виде редактора, так и в виде отдельных модулей: конвертера, загрузчика изображений, формы отправки данных и т.п. (см. примеры).

Другие сферы применения

Markdown можно встретить не только в онлайн и оффлайн редакторах. Например, он может использоваться для форматирования записей в группах в Facebook и даже в популярном мессенджере Telegram! Но использование Markdown не ограничивается только созданием текстов.

Например, программа ResophNotes позволяет вести электронный блокнот заметок с использованием Markdown-разметки. Учитывая, что программа портативная и может синхронизироваться с Вашим аккаунтом Simplenote, Вы вполне можете использовать её в качестве замены популярному Evernote:

ResophNotes

Ещё одно интересное применение для Markdown рекомендует нам сайт ToDoTXT.org. Он предлагает нам использовать особенности языка разметки для составления списков дел, которые могут открываться и правиться в любом текстовом редакторе, а просматриваться в удобном виде в специальном приложении для ПК или мобильных устройств.

Если Вы часто пишете электронные письма и хотели бы, чтобы они выглядели более красиво оформленными, можете воспользоваться плагинами Markdown Here. Плагины эти активируют преобразование Markdown-разметки в валидный HTML и работают в большинстве браузеров, а также в почтовых программах Mozilla Thunderbird и Postbox.

Наконец, существует целый фреймворк для создания собственного блога из текстов, оформленных только на Markdown. Имя сему чуду – Octopress. Он позволяет создавать и вести практически полноценный блог на базе бесплатных площадок GitHub, Heroku и Rsync.

Выводы

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

А, может, Вы тоже используете Markdown или знаете об интересных сервисах с его применением? Тогда поделитесь со всеми нами своим опытом и знаниями в комментариях!

P.S. Разрешается свободно копировать и цитировать данную статью при условии указания открытой активной ссылки на источник и сохранения авторства Руслана Тертышного.







Полезный совет:



Система проверки ошибок от Mistakes.ru