На мгновение я искал в голове подходящий эпитет, который должен описать нашего сегодняшнего героя статьи. Я думаю, что удобнее будет дать вам полное определение, поскольку Markdown одинаково производителен и интуитивен.
Чем вообще является Markdown?
Это язык разметки, используемый для форматирования текста, созданный Джоном Грубером и Аароном Шварцем в далеком 2004 году. Из других доступных решений, таких как ВВCode или чистый HTML его отличает ряд преимуществ, из которых я бы выделил скорость использования и интуитивность. Синтаксис Markdown запроектирован таким образом, что даже глядя на еще не преобразованный код мы видим предназначение каждого маркера.
Markdown меняет дело!
Как работать со всем этим, спросите вы. И зачем вообще это. Работать с markdown можно практически везде, где до этого вы работали с чистым HTML. Есть множество библиотек, плагинов, модулей, все это можно найти на просторах интернета. Можно работать на WordPress, SublimeText, Eclipse и т. д. Для наглядности сразу кидаю вам пример:
Это заголовок h1
==================
# Это тоже заголовок h1
А это его подзаголовок
———————-
## А это тоже его подзаголовок
Каждый абзац отделяется пустой строкой, следовательно в пределе одного параграфа мы можем
беспрепятственно пользоваться клавишей enter.
Одинаково интуитивно происходит форматирование текста, например: это *курсив* а это **жирный**.
Ненумерованный список:
— Огурцы
— Картофель
— Помидоры
И пронумерованый список:
Огурцы
Свекла
Капуста
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
Это заголовок h1
==================
# Это тоже заголовок h1
А это его подзаголовок
———————-
## А это тоже его подзаголовок
Каждый абзац отделяется пустой строкой, следовательно в пределе одного параграфа мы можем
беспрепятственно пользоваться клавишей enter.
Одинаково интуитивно происходит форматирование текста, например: это *курсив* а это **жирный**.
Ненумерованный список:
— Огурцы
— Картофель
— Помидоры
И пронумерованый список:
Огурцы
Свекла
Капуста
Как видите, в разметке нет никаких тегов (закрывающих, открывающих, как это было в HTML), практически не возможно запутаться, все достаточно прозрачно и динамично.
У вас сразу же может возникнуть вопрос, а сколько надо ставить этих знаков равно (==
) или сколько пунктиров (-) чтобы получился заголовок? Ответ: достаточно одной таблэтки одного знака, но лучше ставить их относительно размера самого заголовка, так вам будет более легче «читать» разметку, или же можете пользоваться хешами (#).
А теперь смотрим на результат который сгенерировал для нас Markdown:
Теперь если посмотреть в исходный код страницы то вы увидите самый обычный HTML:
<h1>Это заголовок h1</h1>
<h1>Это тоже заголовок h1</h1>
<h2>А это его подзаголовок</h2>
<h2>А это тоже его подзаголовок</h2>
<p>Каждый абзац отделяется пустой строкой, следовательно в пределе одного параграфа мы можем
беспрепятственно пользоваться клавишей enter.</p>
<p>Одинаково интуитивно происходит форматирование текста, например: это <em>курсив</em>
а это <strong>жирный</strong>.</p>
<p>Ненумерованный список:</p>
<ul>
<li>Огурцы</li>
<li>Картофель</li>
<li>Помидоры</li>
</ul>
<p>И пронумерованый список:</p>
<ol>
<li>Огурцы</li>
<li>Свекла</li>
<li>Капуста</li>
</ol>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<h1>Это заголовок h1</h1>
<h1>Это тоже заголовок h1</h1>
<h2>А это его подзаголовок</h2>
<h2>А это тоже его подзаголовок</h2>
<p>Каждый абзац отделяется пустой строкой, следовательно в пределе одного параграфа мы можем
беспрепятственно пользоваться клавишей enter.</p>
<p>Одинаково интуитивно происходит форматирование текста, например: это <em>курсив</em>
а это <strong>жирный</strong>.</p>
<p>Ненумерованный список:</p>
<ul>
<li>Огурцы</li>
<li>Картофель</li>
<li>Помидоры</li>
</ul>
<p>И пронумерованый список:</p>
<ol>
<li>Огурцы</li>
<li>Свекла</li>
<li>Капуста</li>
</ol>
Краткая визуализация работы Markdown
Резюме
Конечно же, я показал только часть возможностей Markdown. Это было, скорее, демонстрацией прозрачности, концепции и синтаксиса. Как вы смогли догадаться, благодаря конструкциям markdown, можно смело писать статьи в любом текстовом редакторе и они по-прежнему останутся разборчивыми для нас.
7 основных конструкций в работе с Markdown
В дополнение тому, что уже было показано выше, синтаксис markdown предлагает нам еще целую кучу конструкций (а вы думали это все? 🙂 ). В список входит:
ссылки
изображения
разрывы строк внутри абзацев
размещение блоков кода
таблицы
линии
цитаты
Ссылки и Markdown
Все знают как записать ссылку в HTML.
Пример в HTML:
<p>Это разметка хтмл, а это <a href=»http://site. com/»>ссылка</a> на сайт</p>
Пример в Markdown:
Это разметка хтмл, а это [ссылка](http://site. com/) на сайт.
Также можно сослаться на сайт в таком стиле:
Это разметка хтмл, а это <http://site. com/> наш сайт.
Результат:
Изображения и Markdown
Пример:
Разрывы строк внутри абзацев
Для того чтобы в пределах одного абзаца перейти на новою строку, необходимо поставить в конце строки два или более пробелов а затем клавишу enter.
Пример:
Речь идет о том, как в пределах одного абзаца перейти<тут ставим два пробела без тегов и нажимаем enter> на новою строку
Размещение блоков кода с помощью Markdown
Хотите написать код (например на php)? Начинайте с трех и более, обратных апострофов (на клавиатуре значок тильды) и также ними заканчивайте. Например:
Результат:
Таблицы в Markdown
Тут тоже все достаточно легко и просто в сравнении с таблицами на чистом html. Пример построения таблицы:
Техника | Цена
— | —
Принтер | $100
Телефон | $80
Сканер | $150
Результат:
Хочется больше столбцов? Продолжаем по аналогии.
Линии в Markdown
Вместо тега <hr> (в html) просто ставим три звезды (***)
Цитаты в Markdown
Цитата (аналогия blockquote) начинается с символа (>)
Резюме
Как видите все это очень прозрачно и легко можно использовать в своей работе, списки, абзацы и выделения строк были в начале статьи, поэтому отдельные пункты для них я делать не буду.
Спецсекция или коротко о главном
Существует также альтернативный синтаксис для некоторых конструкций, я их уже показал в начале статьи — например два метода определения заголовков, которые могут быть использованы как взаимозаменяемые в том же документе.
Тут хотел бы сказать несколько слов о заголовках h1-h Лучше всего их записывать хешем (#), так вы всегда будете знать какой сейчас уровень заголовка исходя из их количества. Пример #Это заголовок h1, а ######Это заголовок h6
Сейчас множество программ поддерживает Markdown синтаксис. Например в Thunderbird, можно с легкостью писать письма используя все эти конструкции. Также markdown используется на таких сайтах как — БитБакет, ДжитХаб, Джекил и на многих других. Для wordpress можете пользоваться плагином WP-Markdown[1]. Про него я потом напишу обзорною статью. Напоследок несколько online сервисов, где вы можете потестить свои навыки в этой разметке:
В этом месте статья заканчивается. Оставляйте комментарии ниже. Добавляйте статью в социальные закладки, чтобы не потерять. Спасибо за то что Вы с нами!
Оцените пожалуйста материал:
Загрузка…
Поделиться:
Оставьте пожалуйста ваш комментарий :
comments powered by HyperComments[2]