Просмотров: 22686

Markdown: изящное форматирование для Web 2.0


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

И хотя я всегда считал, что придумывание новых еще более упрощенных синтаксисов для и так несложного HTML'а — это зло, Markdown мне понравился. Он, пожалуй, самый продуманный из тех, что я видел, и самый... ненавязчивый. В данной обзорной статье также подчеркнём концептуальное отличие Markdown от wiki-разметки, наиболее идеологически близкой ему.

Markdown wiki html

Форматирование и Web 2.0

Текущая эпоха Web 2.0 отличается от предыдущей тем, что сейчас пользователи web-сайтов сами могут массово создавать контент на этих сайтах. Сюда входят развитые системы комментариев к материалам, блоги, социальные сети, где содержание полностью создаётся самими пользователями.

Чтобы пользователям было удобно создавать сообщения, применяются различные достижения web-программирования, вплоть до специальных WYSIWYG-редакторов текста, как, например, в WordPress. Это практически полноценные редакторы текста с базовым набором функций редактирования.

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

Markdown wiki html

Но и чистый HTML не всегда хорош в силу не столько своей сложности, сколько из-за громоздкости кода, в котором легко запутаться. Поэтому изобретено немало упрощённых языков разметки, например, wiki-разметка, bbcode, которые помогают пользователям с большей лёгкостью форматировать свои сообщения при помощи простого текстового синтаксиса.

В этой статье рассмотрим пример текстового синтаксиса под названием Markdown, который по многих превосходит уже названные методы в удобстве и легкости web-форматировании текста.

Итак, Markdown — простой для написания и чтения формат обычного текста (plain text), который затем легко преобразуется в структурно верный HTML. С виду Markdown очень похож на wiki-разметку. Ниже подчеркнём особенности Markdown, как самостоятельного синтаксиса.

Markdown (маркдаун) — облегчённый язык разметки текста для публикации Web. Первоначально создан Джоном Грубером (англ. John Gruber) и Аароном Шварцем, целью которых являлось создание максимально удобочитаемого и удобного в публикации облегчённого языка разметки. Реализации языка Markdown преобразуют текст в формате Markdown в валидный, правильно построенный XHTML и заменяет левые угловые скобки («<»), амперсанды («&») и так далее на соответствующие коды сущностей.

Принципы Markdown

Первоначально синтаксис Markdown был придуман разработчиками Джоном Грубером и Аароном Шварцем с целью простой публикации примеров HTML-кода на web-сайтах. Ведь при обычной публикации примеров HTML на web-странице приходится много возиться с заменой угловых скобок на последовательности символов < и > и так далее.

Синтаксис Markdown использует особые последовательности знаков препинания и некоторых специальных символов для форматирования текста. В этом отношении Markdown очень похож, как мы говорили выше, на wiki-разметку. Но разница между ними есть. И прежде, чем приступить к конкретным примерам, о ней нужно сказать.

Markdown wiki html

Если wiki-разметка — более простая замена HTML-тегам, то Markdown уже самодостаточный язык структурного форматирования обычного текста. Идея Markdown состоит в том, чтобы создать легкость не только при написании и редактировании текста, но и даже при его чтении. В этом синтаксисе символы для форматирования текста тщательно подобраны и потому понятно и при чтении, что они означают: где заголовок, где выделение текста, где ссылки и списки.

Таким образом, Маркдаун стремится быть изящным и простым насколько это вообще возможно, в то время как многообразные варианты wiki-разметки пытаются передать как можно большую функциональность HTML. Синтаксис Markdown не старается заменить HTML, он минимально отличается от простого текста, поэтому с его помощью удобно создавать отформатированные сообщения даже для e-mail.

Базовое форматирование

В Сети уже существует подробная документация на русском языке: markdown.pp.ru. Правда, она немного заумная, так как рассчитана на web-мастеров.

На самом деле знакомство с базовым синтаксисом займёт не слишком много времени, она сводится к дюжине правил:

  • Разрыв строки создаётся при использовании двух или более пробелов.
  • Абзацы создаются пустой строкой.
  • Выделение текста: _курсив_, *выделенное слово*, **жирный шрифт**.
  • Заголовки: #первый уровень, ##второй уровень и т.д. Можно использовать подчеркивание знаками: «=» задает первый уровень, дефисами «-» - второй.
  • Цитаты определяются угловой скобкой: >текст цитаты.
  • Списки: для неупорядоченных элементов используются символы «*„, “-» или «+»; для упорядоченных элементов используются цифры.
  • Для форматирования блока кода его выделяют обратным апострофом «`», или каждую строку кода начинают с четырёх или более пробелов.
  • Горизонтальная черта: три или более дефиса или звездочки.
  • Ссылки: [текст ссылки](url).
  • Изображения: ![alt текст](url_изображения).
  • Чтобы вставить спецсимвол, используемый в разметке, как обычный символ, его нужно предварить символом обратной косой черты.

Markdown Extra

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

Выше мы уже упоминали такую фичу, как лёгкая вставка html-кода для публикации. Следующий пример кода в первом случае выведет код заголовка как отформатированный текст, а во втором случае как код.

<H1>Заголовок</H1>
’<H1>Заголовок</H1>’

Markdown wiki html

Как видите, здесь нет никакой возни с lt; и gt;.

Следует также упомянуть, что существуют и расширения минималистского синтаксиса Markdown, самое известное из низ — Markdown Extra. Оно позволяет использовать Markdown внутри HTML, форматировать таблицы, задавать id для заголовков, определять аббревиатуры и многое-многое другое...

Реализация

Естественно, Markdown — это не только синтаксис, но и специальное ПО, которое преобразует этот синтаксис в представление HTML. Для этого созданы специальные библиотеки, которые можно легко и свободно внедрять в свои web-проекты. Библиотеки написаны практически на всех языках программирования.

Например, для PHP доступна известная и активно разрабатываемая библиотека PHP Markdown (альтернативный линк), также есть её же версия и для Markdown Extra с ну очень витиеватым названием — PHP Markdown Extra. Они прекрасно интегрируются с известными фрэймворками, например с Codeigniter.

Кстати говоря, хочу обратить ваше внимание, что во многих реализациях встраивания Markdown в сайты из тех, что я видел, почти каждый раз пишут свой собственноручный фильтр ввода/вывода, почему-то игнорируя (или попросту не зная), что в PHP Markdown есть свой встроенный фильтр-парсер. Для чего имеет место быть замечательная опция input sanitizer , которую можно найти в самом верху класса Markdown_Parser (файл arkdown.php ), а вот и переменные ответственные за его включение и их значения по-умолчанию:

var $no_markup = false;
var $no_entities = false;

Если присвоить им true , например, так:

function do_markdown($text, $safe=false) {
    $parser = new Markdown_Parser;
    if ($safe) {
        $parser->no_markup = true;
        $parser->no_entities = true;
    }
    return $parser->transform($text);
}

Теперь функция будет создавать свой парсер, который будет вычищать весь поток символов.

Что же касается готовой поддержки Markdown, то этот синтаксис уже достаточно распространён на многих сайтах. Например, его можно использовать в социальной сети Diaspora. Markdown прямо или через плагины поддерживается в CMS-системах Drupal, Plone, TYPO3, Django, DokuWiki.

Многие текстовые редакторы plain text, а также среды разработки приложений тоже поддерживают Markdown как минимум на уровне подсветки кода. Сюда входят редакторы Vim, Emacs, Gedit, BBedit, TextMate, IDE Eclipse. Для примера возьмём плагин для редактора Gedit. Он даёт возможность предпросмотра отформатированного текста через HTML-просмотрщик в отдельном окне:

Markdown wiki html

~

Для желающих попрактиковаться с Markdown можно порекомендовать также web-сервис Dingus. Это онлайн-конвертор, с помощью которого вы сможете наглядно увидеть, как работает этот язык. Для желающих ещё больших подробностей — «Использование Markdown».

Для всех остальных рекомендую ReText — редактор для Markdown и reStructuredText, написанный на Python с использованием библиотек PyQt, который работает на Linux и других UNIX-подобных операционных системах.

twitter.com facebook.com vkontakte.ru odnoklassniki.ru mail.ru ya.ru pikabu.ru blogger.com liveinternet.ru livejournal.ru google.com bobrdobr.ru yandex.ru del.icio.us

Подписка на обновления блога → через RSS, на e-mail, через Twitter
Теги: , , ,
Эта запись опубликована: Пятница, 20 января 2012 в рубрике Программирование.

5 комментариев

Следите за комментариями по RSS
  1. А, по-моему, Markdown - это и есть по сути викисинтаксис, местами удобный, а местами очень не логичный (особенно в оформлении ссылок).

  2. А я работаю с Texts (www.texts.io) - это WYSIWYG редактор для работы с plain text, и этим все сказано :)

    Это позволяет вообще забыть о том, что существует специальная Markdown разметка и просто сосредоточится на тексте, получая на выходе Markdown документ. Поддерживает формулы, таблицы, экспорт в наиболее популярные форматы, такие как HTML/Doc/Rtf/EPUB/PDF/XeLaTex.

    Есть версии для Windows и Mac OS, что очень важно, так как позволяет использовать один и тот же редактор и дома и на работе.

  3. Для тех, кто привык использовать Word и у кого нет времени или желания изучать синтаксис Markdown, можно использовать плагин - Writage (www.writage.com). Он позволяет создавать и редактировать Markdown документы в Word.

  4. Оригинальная обувь в Москве стоит прилично. Если вы желаете заказать обувь в МО, вам следует изучить разные варианты в интернет-магазинах. Сейчас в интернете очень удобно заказывать разные товары, в том числе и кроссовки.

    На justnike.ru вы можете подобрать кроссовки различных мировых брендов, а также Женские кроссовки Nike Air Vapormax Flyknit (бело-серый) купить в дисконт интернет-магазине Nike с доставкой и разные предложения от Asics, Adidas, New Balance. Безумно колоссальный выбор зимних вариантов идёт от производителей Reebok и Nike. Вы сможете выбрать для себя обувь маленьких размеров. Надо выделить, что дисконт интернет-магазин обуви очень большой. У интернет-магазина есть склад. Вы можете сделать бронь на какие-то конкретные кроссовки. Нужно позвонить по телефону +7(495)642-26-83, после чего с вами соединится менеджер и проконсультирует.

    В фирме JUSTNIKE вы можете найти мужские кроссы разных размеров. На justnike.ru вы найдёте женские New Balance на лето или весну. Если вы хотите приобрести обувь на подарок, в интернет-магазине этого портала очень большой выбор. В эти дни кроссовки легко покупать через сеть. Сделать покупку можно прямо на сайте. Если кроссовки, которые вы выберете будут стоить много, доставка от компании будет бесплатная. Менеджеры доставляют все товары очень быстро.

    В этом году очень известны кроссовки таких брендов, как: Timberland, Balenciaga, Fila. Кроссы от этих производителей уже покорили сердца многих. Вы можете найти кроссовки с мехом или из лайки. Доставка кроссовок с помощью администратора интернет-магазина осуществляется по всей МО. На портале вы можете также сопоставить много вариантов. Если у вас стоит выбор между серыми и черными моделями, вы можете моментально обращаться к администраторам. Они смогут вам помочь с поиском.

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

    Консультанты всегда подсказывают с выбором. Если у вас на портале возникли проблемы, вам будет оптимально обратиться к менеджерам. Они моментально проверят статус вашего заказа и предоставят вам ответ.

  5. Я пользуюсь чат-блог платформой https://onp4.com/ для написания своих заметок и блог постов. Также удобно сохранять любой вид контента.


⇑ Наверх
⇓ Вниз