Рубріки: Теорія

Мова розмітки Markdown: повний гайд із синтаксису та форматування тексту

Андрій Денисенко

29.03.2023 16:21

Dog usind a laptop

Markdown є мовою розмітки, за допомогою якої створюють форматовані документи. Її синтаксис дуже простий та інтуїтивно зрозумілий, тому вже після першого прочитання цієї статті ви зможете користуватися Markdown.

Зміст

Що таке Markdown
Історія появи
Де використовується Markdown?
Переваги та недоліки
Приклади синтаксису Markdown
Як використовувати синтаксис Markdown
Програми для Markdown
Висновок

Що таке Markdown

Markdown є мовою розмітки, у якій для форматування тексту використовуються спеціальні символи або їх послідовності.

У синтаксисі Markdown немає складних тегів та атрибутів, тому створювати документи з її використанням можна набагато швидше та простіше, ніж за допомогою HTML.

Спеціальне програмне забезпечення для створення документів Markdown теж не потрібне: ви можете використовувати будь-який текстовий редактор.

Водночас існує софт, який створено саме для роботи з Markdown. Який він буває та навіщо потрібний, ми розглянемо трохи нижче.

Історія появи

Ідея створення мови розмітки Markdown виникла у UI-дизайнера Джона Грубера (John Gruber) у 2004 році. Він вів свій блог і захотів швидко та зручно його форматувати.

Джон Грубер. Фото Джорджа Дель Барріо

Джон хотів, щоб мова була простою та зрозумілою, а також доступною для широкого кола користувачів, зокрема тих, хто не має досвіду в HTML або інших мовах розмітки.

Отже, у тому самому 2004 році Джон Грубер разом зі своїм колегою, програмістом Аароном Шварцем (Aaron Swartz), створили Markdown.

Аарон Шварц. Фото Сейджа Росса

Мова стала поширюватися через блог Грубера та його сайт Daring Fireball. Творці описали свій продукт так: «Проста, зручна для читання людиною мова розмітки, яку можна використовувати для написання HTML-коду».

Важливо! Мову Markdown не призначено для заміни HTML. HTML є мовою для публікації, а Markdown — для написання тексту. У Markdown реалізовано лише певну підмножину тегів HTML.

Завдяки своїй простоті та зручності використання мова Markdown швидко стала популярною серед розробників та письменників. Її ввели до свого функціоналу багато популярних інструментів, зокрема:

GitHub;
Stack Overflow;
Slack.

Також було розроблено багато інструментів та бібліотек для перетворення тексту, який написано на Markdown, у інші формати: наприклад HTML, PDF та DOCX.

До того ж, Markdown інтегрувано до популярних редакторів коду, текстових редакторів та онлайн-редакторів, що забезпечило зручність роботи з цим форматом і можливість попереднього перегляду документів.

Сьогодні Markdown є однією з найпопулярніших мов розмітки. Вона знайшла широке застосування, приклади якого ми опишемо докладніше в наступному розділі.

Де використовується Markdown?

Markdown широко використовується для написання документації, блогів, електронних книг та інших текстових документів.

Деякі з найпоширеніших застосувань Markdown:

Написання публікацій у блогах та створення вебсторінок. Markdown широко використовується для написання блогів та вебсторінок. Він дозволяє авторам швидко й легко форматувати текст, додавати заголовки, списки, зображення та посилання.
Написання документації. Markdown використовується для написання документації, наприклад, інструкцій з експлуатації, документації API та створення інших документів, у яких потрібно подати інформацію в зручному для читання форматі.
Створення електронних книг. Markdown можна використовувати для створення електронних книг. Існують інструменти для перетворення документів Markdown на різні формати електронних книг, наприклад PDF, EPUB та MOBI.

Написання повідомлень у соціальних мережах. Деякі соціальні мережі, як-от Reddit, використовують Markdown для форматування повідомлень. Markdown дозволяє користувачам додавати до своїх повідомлень посилання, зображення та інші елементи.
Створення презентацій. Існують інструменти для створення презентацій на основі Markdown, зокрема Remark та reveal.js. Вони дають змогу створювати презентації з використанням Markdown та конвертувати їх у HTML-код.

В цілому Markdown широко використовується там, де потрібне швидке та зручне форматування тексту без складних тегів та команд.

Переваги та недоліки

Переваги	Недоліки
1. Простий синтаксис. Завдяки цьому Markdown легко використовувати. Можна форматувати текст за допомогою простих символів та не запам’ятовувати складні теги й команди.	1. Обмеженість функціональності. Простота синтаксису також означає, що Markdown не підтримує багато розширених функцій форматування, які доступні в інших мовах розмітки, наприклад HTML.
2. Портованість. Markdown є портованою мовою розмітки. Це означає, що її можна використовувати на будь-якій платформі без змін. Це робить її ідеальною для написання документації, яка може бути використана в різних операційних системах та на різних пристроях.	2. Неоднозначність. Хоча тексти, які написано на Markdown, теоретично можна відкривати на всіх пристроях та операційних системах, на практиці можуть виникати проблеми із інтерпретацією синтаксису. Форматування спрацює в будь-якому разі, але не факт, що коректно.
3. Зручність для колективної роботи. Markdown дозволяє користувачам спільно працювати над документами та ділитися ними у текстовому форматі. До того ж, Markdown-документи можна без проблем зберігати в системах контролю версій, наприклад Git.	3. Обмеженість розширюваності. Хоча є багато інструментів, які можуть полегшити написання й форматування Markdown-документів, сама мова обмежена в плані розширюваності, тобто до неї важко додавати нові елементи.
4. Універсальність. Формат Markdown підтримується багатьма програмами й інструментами, що робить його універсальним форматом для використання в різних програмах та середовищах.	4. Проблеми зі створенням складних таблиць. У Markdown проблематично створити складну таблицю з багаторівневою вкладеністю та/або об’єднанням комірок.
5. Простота конвертування в інші формати. Є багато інструментів та бібліотек, які допомагають конвертувати текст, написаний на Markdown, у інші формати.	6. Відсутність стандартизації. Для Markdown немає єдиного стандарту, і різні реалізації можуть підтримувати різні функції та синтаксис. Це може спричинити проблеми з портативністю та сумісністю документів між різними програмами та платформами.

Приклади синтаксису Markdown

Нижче наведено короткий опис синтаксичних елементів Markdown.

Абзаци

У Markdown для позначення нового абзацу потрібно залишити порожній рядок між двома блоками тексту. Тобто після закінчення попереднього абзацу потрібно зробити відступ (натиснути клавішу Enter) та почати писати наступний абзац з нового рядка.

Наприклад, щоб створити два абзаци в Markdown, потрібно написати:

Перший абзац тексту.

Другий абзац тексту.

Результат:

Крім того, для створення нового рядка в рамках одного абзацу можна використовувати два пробіли в кінці рядка:

Наступне речення розпочнеться з нового рядка.  
Я на новому рядку.

Результат:

Заголовки

У Markdown заголовки позначаються символами решітки перед текстом заголовка. Перший символ # має бути першим символом у рядку, а після останнього символу # перед текстом потрібно вставити пробіл.

Кількість символів # відповідає рівню заголовка: чим більше символів решітки, тим менше розмір заголовка.

Ось приклад коду та результат для заголовків різних рівнів:

# Заголовок рівня 1
## Заголовок рівня 2
### Заголовок рівня 3
#### Заголовок рівня 4
##### Заголовок рівня 5
###### Заголовок рівня 6

Також заголовки першого та другого рівнів можна позначити за допомогою підкреслення. Для цього на наступному рядку після тексту ставиться:

символ = після заголовка першого рівня;

символ - після заголовка другого рівня.

Достатньо й одного символу підкреслення, але рядок не має містити інших символів:

Заголовок рівня 1
================
Заголовок рівня 2
-------------------------

Результат:

Курсив

Щоб виділити текст курсивом, візьміть його в зірочки або символи підкреслення:

*курсив*
_курсив_

Результат:

Важливо! Якщо хочете вставити в текст зірочку чи символ підкреслення, а не писати текст курсивом, поставте перед символами зворотну косу риску:

\*
\_

Результат:

Напівжирний

Щоб виділити текст напівжирним, візьміть його в подвійні зірочки або символи підкреслення:

**напівжирний**
__напівжирний__

Результат:

Цитати

Цитати в Markdown позначаються символом «більше»( >). Його можна ставити перед кожним рядком:

>Це цитата,
>у якій виділено
>кожний рядок.

Результат:

Також його можна ставити перед першим рядком кожного абзацу:

>Це перший абзац
із двох рядків.

>Це другий абзац

Результат:

Цитати можуть бути вкладеними:

>Перший рівень
>>Другий рівень
>>>Третій рівень
>
>Перший рівень

Результат:

Допускається 15 рівнів цитат.

Списки

Списки в Markdown бувають невпорядкованими та впорядкованими.

Для позначення елементів невпорядкованого списку використовуються дефіси, плюси й зірочки:

* Повітря
* Вогонь
* Вода
* Земля
* Лілу Даллас, мультипас

Результат:

Упорядковані списки позначаються числами з крапкою:

1. Повітря
2. Вогонь
3. Вода
4. Земля
5. Лілу Даллас, мультипас

Результат:

Вказані номери не впливають на вихідний HTML. Можна позначити всі елементи одиницями:

1. Повітря
1. Вогонь

Результат усе одно буде коректним:

При цьому важливо розпочинати кожен впорядкований список з одиниці.

Між маркером та текстом має бути не більше трьох пробілів. Якщо список розпочато з одного маркера, а продовжено іншим, то з другого маркера почнеться новий список:

* перший
- третій
+ четвертий

Результат:

Щоб створити багаторівневий список, потрібно перед кожним елементом наступного рівня робити відступ у чотири пробіли (на чотири пробіли більше, ніж у попередньому рівні):

* перший
* другий
    * перший
    * другий
        - перший
        - другий

Результат:

До пунктів списку можна вкладати й інші елементи, наприклад абзаци, цитати або блоки коду з відповідним відступом перед ними.

Горизонтальна лінія

Горизонтальна лінія Markdown створюється трьома дефісами або трьома зірочками в окремому рядку:

---
***

Результат:

Код

Вбудований код у рядку береться в зворотні апострофи:

Діє, як тег `code` в HTML.

Результат:

Для виділення блоку коду використовуйте відступ на чотири пробіли:

    def add(a, b):
        return a + b

Також можна помістити три зворотні апострофи в рядку перед кодом та у рядку після нього:

````
def add(a, b):
    return a + b
````

Результат в обох випадках буде таким:

Посилання

Щоб вставити посилання, візьміть текст у квадратні дужки та введіть посилання у круглих дужках. Спливаючу підказку можна взяти в лапки та помістити всередині дужок:

[Посібник з Markdown](https://www.markdownguide.org "markdownguide")

Результат:

Зображення

Для вставки зображення використовується майже такий самий синтаксис, як й для посилань:

![Альтернативний текст](/path/filename.jpg "Підказка")

Якщо зображення відсутнє, виводиться альтернативний текст:

Якщо файл знайдений, відображається зображення:

Таблиці

Таблиці оформлюються таким чином:

| Синтаксис| Опис |
| ----- | ----------- |
| Заголовок | Назва |
| Абзац | Текст|

Тобто кожна комірка відокремлюється прямими лініями. При цьому комірки в коді не потрібно намагатися зробити однакового розміру. Вони вирівняються при відображенні:

Виноски

Виноски вказуються в квадратних дужках у вигляді числа, перед яким ставиться символ «кришка»(^):

Це речення з виноскою.[^1]

Результат:

У списку виносок після позначення виноски ставиться двокрапка:

[^1]: Це виноска.

Результат:

Закреслений текст

Закреслений текст береться в подвійні тильди(~):

~~Земля пласка.~~

Результат:

Список завдань

Список завдань оформляють у вигляді невпорядкованого списку, у якому через пробіл після маркера ставляться квадратні дужки, а через пробіл після дужок вказується текст.

Щоб позначити завдання як виконане, між дужками ставлять латинську літеру x, а в невиконаному між дужками залишають пробіл:

- [x] Написати прес-реліз.
- [ ] Викласти його на сайті.
- [ ] Зв'язатися зі ЗМІ.

Результат:

Емодзі

Markdown підтримує письмовий запис емодзі:

Смішно! :joy:

Результат:

Повний список письмових записів емодзі можна переглянути тут.

Виділення

Щоб виділити текст маркером (жовтим хайлайтом), візьміть його в подвійні символи рівності(=):

Потрібно виділити ці ==дуже важливі слова==.

Результат:

Індекси

Нижній індекс оточують тильдами:

H~2~O

Результат:

Верхній індекс оточують символами «кришка»:

X^2^

Результат:

Як використовувати синтаксис Markdown

Крім базового форматування, Markdown підтримує вкладене.

Наприклад, *у текст, який відформатовано курсивом, можна вставити **напівжирний фрагмент**, а потім продовжити курсивом*, а **можна *зробити* навпаки**. **Не радимо *завершувати зовнішнє форматування** раніше внутрішнього*, тому що результат може бути непередбачуваним.

В онлайн-редакторі StackEdit попередній абзац буде інтерпретовано так:

Як бачимо, в останньому реченні немає форматування напівжирним.

Програми для Markdown

Є багато програм, які підтримують Markdown. Нижче наведено деякі з них:

Текстові редактори: Sublime Text, Visual Studio Code, Atom, Notepad++, Vim, Emacs.
Онлайн-редактори: StackEdit, Dillinger, Typora, MarkdownPad, Remarkable.
Конвертери: Pandoc, MultiMarkdown, CommonMark.
Платформи: GitHub, GitLab, Bitbucket.
Системи керування контентом: WordPress, Ghost, Drupal.

Також можна використовувати для роботи з Markdown інші інструменти, зокрема утиліти командного рядка, бібліотеки програмування тощо.

Висновок

Markdown є простою та ефективною мовою розмітки, яка дозволяє швидко та зручно створювати форматовані текстові документи.

Незважаючи на деякі обмеження, пов’язані з функціональністю та розширюваністю мови, Markdown залишається популярним інструментом у спільноті розробників, блогерів, письменників та журналістів.

Багато програм та інструментів підтримують Markdown, тому, якщо вам потрібно швидко створити простий, але добре відформатований текстовий документ, Markdown може стати відмінним вибором.

Детальний розбір Markdown можна переглянути тут:

А тут — вивчити трюки для роботи з Markdown: