html текст
All interests
  • All interests
  • Design
  • Food
  • Gadgets
  • Humor
  • News
  • Photo
  • Travel
  • Video
Click to see the next recommended page
Like it
Don't like
Add to Favorites

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
Одноклассники
Мой Мир

материал с blogerator.ru

55
    +37 surfers

      Add

      You can create thematic collections and keep, for instance, all recipes in one place so you will never lose them.

      No images found
      Previous Next 0 / 0
      500
      • Advertisement
      • Animals
      • Architecture
      • Art
      • Auto
      • Aviation
      • Books
      • Cartoons
      • Celebrities
      • Children
      • Culture
      • Design
      • Economics
      • Education
      • Entertainment
      • Fashion
      • Fitness
      • Food
      • Gadgets
      • Games
      • Health
      • History
      • Hobby
      • Humor
      • Interior
      • Moto
      • Movies
      • Music
      • Nature
      • News
      • Photo
      • Pictures
      • Politics
      • Psychology
      • Science
      • Society
      • Sport
      • Technology
      • Travel
      • Video
      • Weapons
      • Web
      • Work
        Submit
        Valid formats are JPG, PNG, GIF.
        Not more than 5 Мb, please.
        30
        surfingbird.ru/site/
        RSS format guidelines
        500
        • Advertisement
        • Animals
        • Architecture
        • Art
        • Auto
        • Aviation
        • Books
        • Cartoons
        • Celebrities
        • Children
        • Culture
        • Design
        • Economics
        • Education
        • Entertainment
        • Fashion
        • Fitness
        • Food
        • Gadgets
        • Games
        • Health
        • History
        • Hobby
        • Humor
        • Interior
        • Moto
        • Movies
        • Music
        • Nature
        • News
        • Photo
        • Pictures
        • Politics
        • Psychology
        • Science
        • Society
        • Sport
        • Technology
        • Travel
        • Video
        • Weapons
        • Web
        • Work

          Submit

          Thank you! Wait for moderation.

          Тебе это не нравится?

          You can block the domain, tag, user or channel, and we'll stop recommend it to you. You can always unblock them in your settings.

          • pleshner
          • домен blogerator.ru

          Get a link

          Спасибо, твоя жалоба принята.

          Log on to Surfingbird

          Recover
          Sign up

          or

          Welcome to Surfingbird.com!

          You'll find thousands of interesting pages, photos, and videos inside.
          Join!

          • Personal
            recommendations

          • Stash
            interesting and useful stuff

          • Anywhere,
            anytime

          Do we already know you? Login or restore the password.

          Close

          Add to collection

             

            Facebook

            Ваш профиль на рассмотрении, обновите страницу через несколько секунд

            Facebook

            К сожалению, вы не попадаете под условия акции