Загрузка...
Linux
Новости, статьи, обсуждения, - все что связано с GNU Linux, FreeBSD, OpenBSD, Sun Solaris, Mac OS X и другими системами. Если вы интересуетесь данной темой - добро пожаловать в сообщество.
     

Zen Coding

05.06.10, 01:49
Автор ggg

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

Некоторые специализированные HTML-редакторы предоставляют различные средства для поиска и автоматической подстановки закрывающего HTML-тега, но я считаю, что есть более интересное решение данной проблемы. Оно носит название Zen Coding. Рассмотрим поподробнее, что же это за зверь.

Zen Coding - это способ ускоренного написания HTML-кода наподобие CSS, предложенный Вадимом Макеевым и разрабатываемый Сергеем Чикуёнком. Например, такой код:

div.wrapper>div.content

с помощью Zen Coding раскрывается в:

< div class="wrapper">
   < div class="content">< /div>
< /div>

Zen Coding позволяет использовать повторения, что сильно упрощает создание таких структур данных как таблицы и ссылки, например, такой код:

table>tr*2>td*3

раскрывается в карказ большой таблицы:

< table>
   < tr>
     < td>< /td>
     < td>< /td>
     < td>< /td>
   < /tr>
   < tr>
    < td>< /td>
    < td>< /td>
    < td>< /td>
  < /tr>
< /table>

Не знаю как вас, но лично меня мысль о том, что вместо 12 строк (в каждой из которых можно допустить синтаксическу ошибку) можно написать всего одну сильно радует. Поскольку стиль кода, используемый в Zen Coding очень похож на привычный web-разработчикам CSS, то для использования данного средства не потребуется какой-то дополнительной подготовки. Вы можете добавить плагин и увеличить скорость верстки в разы.

Zen Coding - это концепт, а реализации данного концепта есть для самых различных текстовых редакторов и IDE:

  • VIM
  • Emacs
  • Coda
  • Espresso
  • TextMate
  • E-text
  • Aptana
  • TopStyle
  • Sublime Text
  • GEdit
  • editArea
  • Dreamweaver
  • UltraEdit
  • Visual Studio
Сам лично я использовал Zen Coding в Vim и GEdit: очень удобно, а нареканий пока не было.
Подводя итог, хотелось бы поделиться двумя полезными ссылками:
  1. http://code.google.com/p/zen-coding/wiki/ZenHTMLElementsRu - описание различных полезных конструкций, которые могут использоваться в Zen Coding
  2. http://vimeo.com/7405114 - интересное видео, в котором автор показывает как различные, казалось бы простые Zen Coding инструкции раскрываются в достаточно сложный и в то же время интересный HTML-код

Комментарии

Хм, а штука-то интересная, только вот что если нужно обернуть уже имеющийся текст, например построчно в таблицу? Может оно такое?

Ага, может!

Войдите, чтобы оставить комментарий