From 8410ce6421b45b3e25d2e8c7ded367c034a9d955 Mon Sep 17 00:00:00 2001
From: Ilya Kantor <iliakan@gmail.com>
Date: Thu, 12 Mar 2015 10:26:02 +0300
Subject: [PATCH] minor renovations, beautify round 2 (final)

---
 .../2-first-steps/6-variable-names/article.md |   2 +-
 .../7-array/9-eratosthenes-sieve/sieve.gif    | Bin 0 -> 44506 bytes
 .../7-array/9-eratosthenes-sieve/task.md      |   2 +-
 .../5-coffeemachine-add-isrunning/task.md     |   2 +-
 .../10-regexp-backreferences/article.md       |   6 +-
 .../12-regexp-alternation/article.md          |   2 +-
 .../article.md                                |  12 +-
 .../14-regexp-multiline-mode/article.md       |   4 +-
 .../15-regexp-word-boundary/article.md        |   8 +-
 .../2-regexp-methods/article.md               |  40 ++--
 .../3-regexp-character-classes/article.md     |  16 +-
 .../article.md                                |  14 +-
 .../1-find-text-manydots/solution.md          |   2 +-
 .../1-find-text-manydots/task.md              |   2 +-
 .../7-regexp-quantifiers/article.md           |  24 +--
 .../8-regexp-greedy-and-lazy/article.md       |   2 +-
 .../9-regexp-groups/article.md                |  34 +--
 10-regular-expressions-javascript/index.md    |   4 +-
 12-extra/10-cookie/article.md                 |  44 ++--
 .../11-intl/1-collate-array-sort/solution.md  |   2 +-
 12-extra/11-intl/1-collate-array-sort/task.md |   2 +-
 12-extra/11-intl/article.md                   |  36 ++--
 12-extra/12-regexp-specials/article.md        |  34 +--
 12-extra/3-templates/article.md               |   6 +-
 12-extra/4-books/article.md                   |   2 +-
 12-extra/5-setImmediate/article.md            |   1 +
 12-extra/6-bind-late/article.md               |   4 +-
 .../8-range-textrange-selection/article.md    | 195 +++++++++---------
 .../1-browser-environment/article.md          |   4 +-
 .../10-compare-document-position/article.md   |  49 +++--
 .../10-clock-setinterval/solution.md          |  14 +-
 .../2-remove-polyfill/solution.md             |   2 +-
 .../2-remove-polyfill/task.md                 |   6 +-
 .../3-insert-after/solution.md                |   6 +-
 .../3-insert-after/task.md                    |   3 +-
 .../4-remove-children/solution.md             |   8 +-
 .../4-remove-children/task.md                 |   4 +-
 .../11-modifying-document/5-why-aaa/task.md   |  10 +-
 .../7-create-object-tree/task.md              |  20 +-
 .../11-modifying-document/article.md          |  16 +-
 2-ui/1-document/12-multi-insert/article.md    |  37 ++--
 2-ui/1-document/13-document-write/article.md  |  26 ++-
 .../2-create-notification/task.md             |   2 +-
 .../14-styles-and-classes/article.md          |  29 ++-
 .../15-metrics/2-scrollbar-width/solution.md  |   4 +-
 .../15-metrics/3-div-placeholder/solution.md  |   4 +-
 .../15-metrics/3-div-placeholder/task.md      |   2 +-
 .../4-put-ball-in-center/solution.md          |   8 +-
 2-ui/1-document/15-metrics/article.md         |   5 +-
 2-ui/1-document/16-metrics-window/article.md  |  10 +-
 .../1-find-point-coordinates/solution.md      |   6 +-
 .../18-coordinates-document/article.md        |  41 ++--
 .../2-dom-nodes/1-body-from-head/solution.md  |   5 +-
 .../2-dom-nodes/1-body-from-head/task.md      |   5 +-
 2-ui/1-document/2-dom-nodes/article.md        |  58 +++---
 .../4-traversing-dom/1-dom-children/task.md   |  29 +--
 .../2-has-childnodes/solution.md              |   3 +
 .../4-traversing-dom/2-has-childnodes/task.md |   1 +
 2-ui/1-document/4-traversing-dom/article.md   |  51 +++--
 .../2-tree/solution.md                        |   2 +-
 .../5-searching-elements-dom/article.md       |  39 ++--
 .../solution.md                               |   7 +-
 .../1-collection-length-after-remove/task.md  |   4 +-
 .../2-compare-elements-count/task.md          |   2 +-
 .../3-benchmark-search-dom/solution.md        |   2 +-
 .../6-searching-elements-internals/article.md |  14 +-
 .../solution.md                               |   8 +-
 .../2-lastchild-nodetype-inline/solution.md   |  14 +-
 .../2-lastchild-nodetype-inline/task.md       |  14 +-
 .../3-tag-in-comment/solution.md              |   6 +-
 .../3-tag-in-comment/task.md                  |   6 +-
 .../7-basic-dom-node-properties/article.md    |  81 ++++----
 .../1-polyfill-matches/solution.md            |   6 +-
 .../3-polyfill-textcontent-ie8/solution.md    |  15 +-
 2-ui/1-document/8-dom-polyfill/article.md     |  18 +-
 .../1-get-user-attribute/solution.md          |   4 +-
 .../1-get-user-attribute/task.md              |   6 +-
 .../2-set-class-links/solution.md             |  16 +-
 .../2-set-class-links/task.md                 |  16 +-
 .../article.md                                |  54 ++---
 .../2-hide-self-onclick/solution.md           |   2 +-
 .../3-which-handlers-run/solution.md          |   4 +-
 .../3-which-handlers-run/task.md              |   1 +
 .../4-sliding-menu/solution.md                |  30 ++-
 .../5-hide-message/solution.view/messages.css |   2 +-
 .../5-hide-message/source.view/messages.css   |   2 +-
 .../1-introduction-browser-events/article.md  |  67 +++---
 .../2-events-and-timing-depth/article.md      |   9 +-
 .../3-obtaining-event-object/article.md       |  10 +-
 .../4-event-bubbling/article.md               |  16 +-
 .../solution.view/messages.css                |   2 +-
 .../source.view/messages.css                  |   2 +-
 .../2-sliding-tree/solution.md                |  48 +++--
 .../5-event-delegation/article.md             |  58 +++---
 .../1-why-return-false-fails/solution.md      |   2 +-
 .../1-why-return-false-fails/task.md          |   2 +-
 .../2-catch-link-navigation/solution.md       |   8 +-
 .../3-image-gallery/solution.md               |   6 +-
 .../7-default-browser-action/article.md       |   7 +-
 .../8-dispatch-events/article.md              |  77 +++----
 .../3-event-details/1-mouse-clicks/article.md |  12 +-
 .../10-onload-ondomcontentloaded/article.md   |  20 +-
 .../3-script-callback/task.md                 |   2 +-
 .../4-scripts-callback/task.md                |   1 +
 .../11-onload-onerror/article.md              |  21 +-
 .../3-event-details/2-unselectable/article.md |  18 +-
 .../2-hoverintent/task.md                     |   2 +-
 .../article.md                                |   4 +-
 .../4-drag-and-drop/article.md                |  20 +-
 .../5-drag-and-drop-objects/article.md        |  10 +-
 2-ui/3-event-details/6-mousewheel/article.md  |  10 +-
 2-ui/3-event-details/7-fixevent/article.md    |  10 +-
 .../8-onscroll/2-updown-button/solution.md    |   4 +-
 .../8-onscroll/3-load-visible-img/solution.md |   4 +-
 2-ui/3-event-details/8-onscroll/article.md    |   2 +-
 .../1-numeric-input/solution.md               |   6 +-
 .../2-check-sync-keydown/task.md              |   1 +
 .../9-keyboard-events/article.md              |  32 +--
 .../1-add-select-option/solution.md           |   4 +-
 .../1-form-elements/article.md                |  90 ++++----
 .../2-focus-blur/3-hotkeys/solution.md        |  34 +--
 .../7-capslock-warning-field/solution.md      |  18 +-
 2-ui/4-forms-controls/2-focus-blur/article.md |  76 ++++---
 .../3-events-change/article.md                |  91 ++++----
 .../4-forms-submit/1-modal-dialog/task.md     |   2 +-
 .../4-forms-submit/article.md                 |   2 +-
 .../2-widgets-structure/1-clock/task.md       |   2 +-
 .../6-voter-add-step/task.md                  |   2 +-
 2-ui/5-widgets/2-widgets-structure/article.md |  14 +-
 .../3-widgets-markup/1-semantic-menu/task.md  |   2 -
 2-ui/5-widgets/3-widgets-markup/article.md    |   2 +-
 .../1-table-template/task.md                  |   1 +
 .../4-template-lodash/3-menu-template/task.md |   6 +-
 2-ui/5-widgets/4-template-lodash/article.md   |  33 ++-
 .../5-custom-events/1-voter-events/task.md    |   2 +-
 .../4-slider-events/solution.md               |   4 +-
 .../5-custom-events/4-slider-events/task.md   |   2 +-
 2-ui/5-widgets/5-custom-events/article.md     |   5 +-
 .../2-webcomponent-core/article.md            |   6 +-
 3-webcomponents/3-shadow-dom/article.md       |  10 +-
 3-webcomponents/4-template-tag/article.md     |  12 +-
 3-webcomponents/5-css-scoping/article.md      |  55 +++--
 3-webcomponents/6-link-import/article.md      |   3 +
 .../7-webcomponent-build/article.md           |  70 ++++---
 3-webcomponents/index.md                      |   4 +-
 4-ajax/10-ajax-jsonp/article.md               |   7 +-
 4-ajax/11-server-sent-events/article.md       |  15 +-
 4-ajax/12-ajax-iframe/article.md              |  44 ++--
 4-ajax/13-csrf/article.md                     |   1 +
 4-ajax/2-ajax-nodejs/article.md               |   2 +-
 .../1-phones-list/solution.md                 |  28 +--
 4-ajax/3-ajax-xmlhttprequest/article.md       |  14 +-
 4-ajax/4-xhr-forms/article.md                 |  31 +--
 4-ajax/5-xhr-crossdomain/article.md           |   7 +-
 4-ajax/6-xhr-onprogress/article.md            |  30 +--
 4-ajax/7-xhr-resume/article.md                |   4 +-
 4-ajax/9-websockets/article.md                |  17 +-
 4-ajax/9-websockets/websocket.zip             | Bin 0 -> 1950 bytes
 4-ajax/index.md                               |   4 +-
 5-animation/1-bezier/article.md               |   4 +
 5-animation/1-bezier/demo.svg                 |   2 +-
 .../1-animate-logo-css/solution.md            |   2 +-
 5-animation/2-css-transitions/article.md      |  75 ++++---
 .../3-js-animation/1-animate-ball/solution.md |   2 +-
 .../2-animate-ball-hops/solution.md           |   6 +-
 5-animation/3-js-animation/article.md         |  38 ++--
 6-optimize/1-memory-leaks/article.md          |  22 +-
 6-optimize/2-memory-leaks-jquery/article.md   |  45 ++--
 .../jquery-leak.view/index.html               |  34 ---
 6-optimize/3-minification/article.md          | 125 +++++------
 6-optimize/4-better-minification/article.md   |  76 +++----
 .../5-gcc-advanced-optimization/article.md    |  30 ++-
 6-optimize/6-gcc-check-types/article.md       |  12 +-
 6-optimize/7-gcc-closure-library/article.md   |  31 ++-
 .../8-memory-removechild-innerhtml/article.md |   8 +-
 7-frames-and-windows/2-iframes/article.md     |  18 +-
 .../3-same-origin-policy/article.md           |  20 +-
 .../article.md                                |   7 +-
 .../5-window-focus/article.md                 |  38 ++--
 .../6-clickjacking/article.md                 |  12 +-
 8-css-for-js/10-box-sizing/article.md         |  41 ++--
 .../11-margin/1-failing-margins/task.md       |   2 +-
 8-css-for-js/11-margin/article.md             |   9 +-
 8-css-for-js/12-space-under-img/article.md    |  75 ++++---
 8-css-for-js/13-overflow/article.md           |  10 +-
 8-css-for-js/14-height-percent/article.md     |   5 +-
 .../1-select-elements-selector/task.md        |   4 +-
 8-css-for-js/15-css-selectors/article.md      |  33 +--
 8-css-for-js/17-css-sprite/article.md         |  36 ++--
 8-css-for-js/18-css-format/article.md         |  20 +-
 8-css-for-js/2-css-units/article.md           |   6 +-
 8-css-for-js/3-display/article.md             |   9 +-
 .../4-float/3-paginator-css/solution.md       |   5 +-
 .../4-add-border-keep-width/solution.md       |   2 +-
 .../4-float/4-add-border-keep-width/task.md   |   2 +-
 8-css-for-js/4-float/article.md               |   4 +
 8-css-for-js/5-position/article.md            |  16 +-
 .../solution.md                               |   2 +-
 .../task.md                                   |   2 +-
 8-css-for-js/6-css-center/article.md          |  14 +-
 .../7-font-size-line-height/article.md        |   2 +-
 8-css-for-js/8-white-space/article.md         |   3 +-
 8-css-for-js/9-outline/article.md             |   2 +-
 .../3-jquery-stub/2-jquery-search/article.md  |  37 ++--
 .../1-select-parents-with-self/task.md        |  12 +-
 .../3-jquery-traversal/article.md             |  93 +++++----
 archive/4-script-place-optimize/article.md    |  31 +--
 archive/widget-tasks/1-date-selector/task.md  |   8 +-
 .../1-tooltip-over-element/solution.md        |   7 +-
 .../1-tooltip-over-element/task.md            |   2 +-
 .../widget-tasks/2-draggable-windows/task.md  |   2 +-
 .../widget-tasks/2-moving-tooltip/solution.md |   1 +
 212 files changed, 1981 insertions(+), 1717 deletions(-)
 create mode 100644 1-js/4-data-structures/7-array/9-eratosthenes-sieve/sieve.gif
 create mode 100644 4-ajax/9-websockets/websocket.zip
 delete mode 100644 6-optimize/2-memory-leaks-jquery/jquery-leak.view/index.html

diff --git a/1-js/2-first-steps/6-variable-names/article.md b/1-js/2-first-steps/6-variable-names/article.md
index ceb5ab74..202a4f03 100644
--- a/1-js/2-first-steps/6-variable-names/article.md
+++ b/1-js/2-first-steps/6-variable-names/article.md
@@ -95,7 +95,7 @@ var border_left_width;
 
 Есть причина и поважнее. Поскольку именно это имя переменной пришло в голову -- скорее всего, оно больше соответствует хранимым там данным, чем то, которое было мы придумали изначально. Исключения бывают, но в любом случае -- такое несовпадение -- это повод задуматься.
 
-Чтобы удобно переименовывать переменную, нужно использовать [хороший редактор JavaScript](/editors), тогда этот процесс будет очень простым и быстрым.
+Чтобы удобно переименовывать переменную, нужно использовать [хороший редактор JavaScript](/editor), тогда этот процесс будет очень простым и быстрым.
 
 [smart header="Если коротко..."]
 Смысл имени переменной -- это "имя на коробке", по которому мы сможем максимально быстро находить нужные нам данные. 
diff --git a/1-js/4-data-structures/7-array/9-eratosthenes-sieve/sieve.gif b/1-js/4-data-structures/7-array/9-eratosthenes-sieve/sieve.gif
new file mode 100644
index 0000000000000000000000000000000000000000..d1960cefce9ed783675b6f3d7ed0a4b76f604d28
GIT binary patch
literal 44506
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
Z#O!7clStu~@F(0~sOREpkdzRS{{a%-5M%%V

literal 0
HcmV?d00001

diff --git a/1-js/4-data-structures/7-array/9-eratosthenes-sieve/task.md b/1-js/4-data-structures/7-array/9-eratosthenes-sieve/task.md
index fe367dc3..73bc70c1 100644
--- a/1-js/4-data-structures/7-array/9-eratosthenes-sieve/task.md
+++ b/1-js/4-data-structures/7-array/9-eratosthenes-sieve/task.md
@@ -15,7 +15,7 @@
 <li>Все оставшиеся незачеркнутыми числа -- простые.</li>
 </ol>
 
-Посмотрите также <a href="/files/tutorial/intro/array/sieve.gif">анимацию алгоритма</a>.
+Посмотрите также [анимацию алгоритма](sieve.gif).
 
 Реализуйте "Решето Эратосфена" в JavaScript, используя массив.
 
diff --git a/1-js/8-oop/3-getters-setters/5-coffeemachine-add-isrunning/task.md b/1-js/8-oop/3-getters-setters/5-coffeemachine-add-isrunning/task.md
index 4fd21cdf..7d8ff96c 100644
--- a/1-js/8-oop/3-getters-setters/5-coffeemachine-add-isrunning/task.md
+++ b/1-js/8-oop/3-getters-setters/5-coffeemachine-add-isrunning/task.md
@@ -22,4 +22,4 @@ coffeeMachine.setOnReady(function() {
 });
 ```
 
-Исходный код возьмите из решения [предыдущей задачи](/task/setter-onReady).
\ No newline at end of file
+Исходный код возьмите из решения [предыдущей задачи](/task/setter-onready).
\ No newline at end of file
diff --git a/10-regular-expressions-javascript/10-regexp-backreferences/article.md b/10-regular-expressions-javascript/10-regexp-backreferences/article.md
index f2f69286..bb8e3a82 100644
--- a/10-regular-expressions-javascript/10-regexp-backreferences/article.md
+++ b/10-regular-expressions-javascript/10-regexp-backreferences/article.md
@@ -10,7 +10,7 @@
 var name = "Александр Пушкин";
 
 name = name.replace(/([а-яё]+) ([а-яё]+)/i, "$2, $1");
-alert(name); // Пушкин, Александр
+alert( name ); // Пушкин, Александр
 ```
 
 К скобочной группе можно также обратиться в самом шаблоне.
@@ -25,7 +25,7 @@ str = "He said:\"She's the one\"."
 
 reg = /['"](.*?)['"]/g
 
-alert( str.match(reg) ) // "She'
+alert(str.match(reg)) // "She'
 ```
 
 Как видно, регэксп нашёл открывающую кавычку <code class="match">"</code>, затем текст, вплоть до новой кавычки <code class="match">'</code>, которая закрывает соответствие.
@@ -38,7 +38,7 @@ str = "He said:\"She's the one\"."
 
 reg = /(['"])(.*?)\1/g
 
-alert( str.match(reg) ) // "She's the one"
+alert(str.match(reg)) // "She's the one"
 ```
 
 Теперь работает верно!
diff --git a/10-regular-expressions-javascript/12-regexp-alternation/article.md b/10-regular-expressions-javascript/12-regexp-alternation/article.md
index b9a4cb55..adb1adc9 100644
--- a/10-regular-expressions-javascript/12-regexp-alternation/article.md
+++ b/10-regular-expressions-javascript/12-regexp-alternation/article.md
@@ -14,7 +14,7 @@ var reg = /html|php|css|java(script)?/gi
 
 var str = "Сначала появился HTML, затем CSS, потом JavaScript"
 
-alert( str.match(reg) )  // 'HTML', 'CSS', 'JavaScript'
+alert(str.match(reg)) // 'HTML', 'CSS', 'JavaScript'
 ```
 
 **Альтернация имеет очень низкий приоритет.**
diff --git a/10-regular-expressions-javascript/13-regexp-ahchors-and-multiline-mode/article.md b/10-regular-expressions-javascript/13-regexp-ahchors-and-multiline-mode/article.md
index 736de5d2..3ac236a6 100644
--- a/10-regular-expressions-javascript/13-regexp-ahchors-and-multiline-mode/article.md
+++ b/10-regular-expressions-javascript/13-regexp-ahchors-and-multiline-mode/article.md
@@ -16,7 +16,7 @@
 ```js
 //+ run
 var str = '100500 попугаев съели 500100 бананов!';
-alert( str.match( /\d+/ig )  // 100500, 500100 (все числа)
+alert(str.match(/\d+/ig) // 100500, 500100 (все числа)
 ```
 
 А с кареткой:
@@ -24,7 +24,7 @@ alert( str.match( /\d+/ig )  // 100500, 500100 (все числа)
 ```js
 //+ run
 var str = '100500 попугаев съели 500100 бананов!';
-alert( str.match( /^\d+/ig )  // 100500 (только в начале строки)*!*
+alert(str.match(/^\d+/ig) // 100500 (только в начале строки)*!*
 ```
 
 Знак доллара <code class="pattern">$</code> используют, чтобы указать, что паттерн должен заканчиваться в конце текста.
@@ -34,7 +34,7 @@ alert( str.match( /^\d+/ig )  // 100500 (только в начале строк
 ```js
 //+ run
 var str = '100500 попугаев съели 500100 бананов!';
-alert( str.match( /\d+$/ig )  // null (в начале строки чисел нет)*!*
+alert(str.match(/\d+$/ig) // null (в начале строки чисел нет)*!*
 ```
 
 Якоря используют одновременно, чтобы указать, что паттерн должен охватывать текст с начала и до конца. Обычно это требуется при валидации.
@@ -46,7 +46,7 @@ alert( str.match( /\d+$/ig )  // null (в начале строки чисел 
 ```js
 //+ run
 var num = "ля-ля 12.34";
-alert( num.match( /\d+\.\d+/ig) );  // 12.34
+alert( num.match(/\d+\.\d+/ig) ); // 12.34
 ```
 
 Если мы хотим проверить, что `num` *целиком* соответствует паттерну <code class="pattern">\d+\.\d+</code>, то укажем якоря по обе стороны от него:
@@ -54,9 +54,9 @@ alert( num.match( /\d+\.\d+/ig) );  // 12.34
 ```js
 //+ run
 var num = "ля-ля 12.34";
-alert( num.match( /^\d+\.\d+$/ig) );  // null, не дробь
+alert( num.match(/^\d+\.\d+$/ig) ); // null, не дробь
 
 var num = "12.34";
-alert( num.match( /^\d+\.\d+$/ig) );  // 12.34, дробь!
+alert( num.match(/^\d+\.\d+$/ig) ); // 12.34, дробь!
 ```
 
diff --git a/10-regular-expressions-javascript/14-regexp-multiline-mode/article.md b/10-regular-expressions-javascript/14-regexp-multiline-mode/article.md
index d2e147e8..1f0e0d19 100644
--- a/10-regular-expressions-javascript/14-regexp-multiline-mode/article.md
+++ b/10-regular-expressions-javascript/14-regexp-multiline-mode/article.md
@@ -15,7 +15,7 @@ var str = '1е место: Винни-пух\n' +
   '2е место: Пятачок\n' +
   '33е место: Слонопотам';
 
-alert( str.match(/^\d+/gm ) ); // 1, 2, 33*!*
+alert( str.match(/^\d+/gm) ); // 1, 2, 33*!*
 ```
 
 Обратим внимание -- без флага <code class="pattern">/m</code> было бы только первое число:
@@ -26,7 +26,7 @@ var str = '1е место: Винни-пух\n' +
   '2е место: Пятачок\n' +
   '33е место: Слонопотам';
 
-alert( str.match(/^\d+/g ) ); // 1
+alert( str.match(/^\d+/g) ); // 1
 ```
 
 Это потому что в обычном режиме каретка <code class="pattern">^</code> -- это только начало текста.
diff --git a/10-regular-expressions-javascript/15-regexp-word-boundary/article.md b/10-regular-expressions-javascript/15-regexp-word-boundary/article.md
index 09ddc758..50c64d53 100644
--- a/10-regular-expressions-javascript/15-regexp-word-boundary/article.md
+++ b/10-regular-expressions-javascript/15-regexp-word-boundary/article.md
@@ -6,7 +6,7 @@ For example, <code class=pattern">\bdog\b</code> matches a standalone <code clas
 
 ```js
 //+ run
-showMatch( "doggy catdog dog", /\bdog\b/ ) // "dog"
+showMatch("doggy catdog dog", /\bdog\b/) // "dog"
 ```
 
 Here, <code class="match">dog</code> matches, because the previous char is a space (non-wordly), and the next position is text end.
@@ -16,14 +16,14 @@ If the word is long enough, it may match multiple times:
 
 ```js
 //+ run
-showMatch( "Boombaroom", /\w{4}/g) // 'Boom', 'baro'
+showMatch("Boombaroom", /\w{4}/g) // 'Boom', 'baro'
 ```
 
 Appending <code class="pattern">\b</code> causes <code class="pattern">\w{4}\b</code> to match only at word end:
 
 ```js
 //+ run
-showMatch( "Because life is awesome", /\w{4}\b/g) // 'ause', 'life', 'some'
+showMatch("Because life is awesome", /\w{4}\b/g) // 'ause', 'life', 'some'
 ```
 
 **The word boundary <code class="pattern">\b</code> like <code class="pattern">^</code> and <code class="pattern">$</code> doesn't match a char. It only performs the check.**
@@ -32,7 +32,7 @@ Let's add the check from another side, <code class="pattern">\b\w{4}\b</code>:
 
 ```js
 //+ run
-showMatch( "Because life is awesome", /\b\w{4}\b/g) //  'life'
+showMatch("Because life is awesome", /\b\w{4}\b/g) //  'life'
 ```
 
 Now there is only one result <code class="match">life</code>.
diff --git a/10-regular-expressions-javascript/2-regexp-methods/article.md b/10-regular-expressions-javascript/2-regexp-methods/article.md
index d637ea65..a0c4b801 100644
--- a/10-regular-expressions-javascript/2-regexp-methods/article.md
+++ b/10-regular-expressions-javascript/2-regexp-methods/article.md
@@ -112,7 +112,7 @@ alert( result.index ); // undefined
 var str = "Ой-йой-йой";
 
 // результат match не всегда массив!
-alert( str.match( /лю/gi ).length ) // ошибка! нет свойства length у null
+alert(str.match(/лю/gi).length) // ошибка! нет свойства length у null
 ```
 [/warn]
 
@@ -124,7 +124,7 @@ alert( str.match( /лю/gi ).length ) // ошибка! нет свойства l
 
 ```js
 //+ run
-alert( '12-34-56'.split('-') ) // [12, 34, 56]
+alert('12-34-56'.split('-')) // [12, 34, 56]
 ```
 
 Можно передать в него и регулярное выражение, тогда он разобьёт строку по всем совпадениям.
@@ -133,7 +133,7 @@ alert( '12-34-56'.split('-') ) // [12, 34, 56]
 
 ```js
 //+ run
-alert( '12-34-56'.split(/-/) ) // [12, 34, 56]
+alert('12-34-56'.split(/-/)) // [12, 34, 56]
 ```
 
 ## str.replace(reg, str|func)   
@@ -145,7 +145,7 @@ alert( '12-34-56'.split(/-/) ) // [12, 34, 56]
 ```js
 //+ run
 // заменить дефис на двоеточие
-alert( '12-34-56'.replace("-", ":") )  // 12:34-56
+alert('12-34-56'.replace("-", ":")) // 12:34-56
 ```
 
 **При вызове со строкой замены `replace` всегда заменяет только первое совпадение.**
@@ -198,7 +198,7 @@ alert( '12-34-56'.replace( *!*/-/g*/!*, ":" ) )  // 12:34:56
 //+ run
 var str = "Василий Пупкин";
 
-alert( str.replace( /(Василий) (Пупкин)/ ,'$2, $1') ) // Пупкин, Василий
+alert(str.replace(/(Василий) (Пупкин)/, '$2, $1')) // Пупкин, Василий
 ```
 
 Ещё пример, с использованием `$&`:
@@ -207,7 +207,7 @@ alert( str.replace( /(Василий) (Пупкин)/ ,'$2, $1') ) // Пупки
 //+ run
 var str = "Василий Пупкин";
 
-alert( str.replace( /Василий Пупкин/ ,'Великий $&!') ) // Великий Василий Пупкин!
+alert(str.replace(/Василий Пупкин/, 'Великий $&!')) // Великий Василий Пупкин!
 ```
 
 **Для ситуаций, который требуют максимально "умной" замены, в качестве второго аргумента предусмотрена функция.**
@@ -221,9 +221,9 @@ alert( str.replace( /Василий Пупкин/ ,'Великий $&!') ) // В
 var i = 0;
 
 // заменить каждое вхождение "ой" на результат вызова функции
-alert( "ОЙ-Ой-ой".replace( /ой/gi, function() { 
-  return ++i; 
-}) ); // 1-2-3
+alert("ОЙ-Ой-ой".replace(/ой/gi, function() {
+  return ++i;
+})); // 1-2-3
 ```
 
 В примере выше функция просто возвращала числа по очереди, но обычно она основывается на поисковых данных.
@@ -245,12 +245,12 @@ alert( "ОЙ-Ой-ой".replace( /ой/gi, function() {
 //+ run
 // вывести и заменить все совпадения
 function replacer(str, offset, s) {
-  alert("Найдено: " + str + " на позиции: " + offset + " в строке: " + s);
+  alert( "Найдено: " + str + " на позиции: " + offset + " в строке: " + s );
   return str.toLowerCase();
-} 
+}
 
-var result = "ОЙ-Ой-ой".replace( /ой/gi, replacer);
-alert('Результат: ' + result); // Результат: ой-ой-ой
+var result = "ОЙ-Ой-ой".replace(/ой/gi, replacer);
+alert( 'Результат: ' + result ); // Результат: ой-ой-ой
 ```
 
 С двумя скобочными выражениями -- аргументов уже 5:
@@ -260,8 +260,8 @@ alert('Результат: ' + result); // Результат: ой-ой-ой
 function replacer(str, name, surname, offset, s) {
   return surname + ", " + name;
 }
- 
-alert( str.replace( /(Василий) (Пупкин)/ , replacer) ) // Пупкин, Василий
+
+alert(str.replace(/(Василий) (Пупкин)/, replacer)) // Пупкин, Василий
 ```
 
 Функция -- это самый мощный инструмент для замены, какой только может быть. Она владеет всей информацией о совпадении и имеет доступ к замыканию, поэтому может всё.
@@ -319,14 +319,14 @@ var str = 'Многое по JavaScript можно найти на сайте ht
 
 var regexp = /javascript/ig;
 
-alert("Начальное значение lastIndex: " + regexp.lastIndex);
+alert( "Начальное значение lastIndex: " + regexp.lastIndex );
 
-while( result = regexp.exec(str) ) { 
-  alert('Найдено: ' + result[0] + ' на позиции:' + result.index);
-  alert('Свойство lastIndex: ' + regexp.lastIndex);
+while (result = regexp.exec(str)) {
+  alert( 'Найдено: ' + result[0] + ' на позиции:' + result.index );
+  alert( 'Свойство lastIndex: ' + regexp.lastIndex );
 }
 
-alert('Конечное значение lastIndex: ' + regexp.lastIndex);
+alert( 'Конечное значение lastIndex: ' + regexp.lastIndex );
 ```
 
 Здесь цикл продолжается до тех пор, пока `regexp.exec` не вернёт `null`, что означает "совпадений больше нет".
diff --git a/10-regular-expressions-javascript/3-regexp-character-classes/article.md b/10-regular-expressions-javascript/3-regexp-character-classes/article.md
index 668cfbe5..2a9e449a 100644
--- a/10-regular-expressions-javascript/3-regexp-character-classes/article.md
+++ b/10-regular-expressions-javascript/3-regexp-character-classes/article.md
@@ -114,21 +114,21 @@ alert( str.replace(/\D/g, "") ); // 79031234567
 
 ```js
 //+ run
-alert(  "1 - 5".match (/\d-\d/) );  // null, нет совпадений!
+alert( "1 - 5".match(/\d-\d/) ); // null, нет совпадений!
 ```
 
 Поправим это, добавив в регэксп пробелы:
 
 ```js
 //+ run
-alert(  "1 - 5".match (/\d - \d/) );  // работает, пробелы вокруг дефиса
+alert( "1 - 5".match(/\d - \d/) ); // работает, пробелы вокруг дефиса
 ```
 
 В регулярные выражения также не надо вставлять лишние пробелы. Все символы имеют значение:
 
 ```js
 //+ run
-alert( "1-5".match( /\d - \d/ ) ); // null, так как в строке 1-5 нет пробелов
+alert( "1-5".match(/\d - \d/) ); // null, так как в строке 1-5 нет пробелов
 ```
 
 ## Класс точка
@@ -159,7 +159,7 @@ alert( "CS 4".match(re) ); // найдено "CS 4" (пробел тоже си
 
 ```js
 //+ run
-alert( "CS4".match (/CS.4/) ); // нет совпадений, так как для точки нет символа
+alert( "CS4".match(/CS.4/) ); // нет совпадений, так как для точки нет символа
 ```
 
 ## Экранирование специальных символов
@@ -180,14 +180,14 @@ alert( "CS4".match (/CS.4/) ); // нет совпадений, так как д
 
 ```js
 //+ run
-alert( "Глава 5.1".match( /\d\.\d/ ) );  // 5.1
+alert( "Глава 5.1".match(/\d\.\d/) ); // 5.1
 ```
 
 Круглые скобки также являются специальными символами, так что для поиска именно скобки нужно использовать `\(`. Пример ниже ищет строку `"g()"`:
 
 ```js
 //+ run
-alert( "function g()".match( /g\(\)/ ) );  // "g()"
+alert( "function g()".match(/g\(\)/) ); // "g()"
 ```
 
 Сам символ слэш `'/'`, хотя и не является специальными символом в регулярных выражениях, но открывает-закрывает регэксп в синтаксисе <code class="pattern">/...pattern.../</code>, поэтому его тоже нужно экранировать.
@@ -196,7 +196,7 @@ alert( "function g()".match( /g\(\)/ ) );  // "g()"
 
 ```js
 //+ run
-alert( "/".match( /\// ) );  // '/'
+alert( "/".match(/\//) ); // '/'
 ```
 
 Ну и, наконец, если нам нужно найти сам обратный слэш `\`, то его нужно просто задублировать.
@@ -205,7 +205,7 @@ alert( "/".match( /\// ) );  // '/'
 
 ```js
 //+ run
-alert( "1\2".match( /\\/ ) );  // '\'
+alert( "1\2".match(/\\/) ); // '\'
 ```
 
 ## Итого
diff --git a/10-regular-expressions-javascript/5-regexp-character-sets-and-ranges/article.md b/10-regular-expressions-javascript/5-regexp-character-sets-and-ranges/article.md
index 2cc997de..00f2481f 100644
--- a/10-regular-expressions-javascript/5-regexp-character-sets-and-ranges/article.md
+++ b/10-regular-expressions-javascript/5-regexp-character-sets-and-ranges/article.md
@@ -13,7 +13,7 @@
 ```js
 //+ run
 // найти [г или т], а затем "оп"
-alert( "Гоп-стоп".match( /[гт]оп/gi ) ); // "Гоп", "топ"
+alert( "Гоп-стоп".match(/[гт]оп/gi) ); // "Гоп", "топ"
 ```
 
 Обратим внимание: несмотря на то, что в наборе указано несколько символов, в совпадении должен присутствовать *ровно один* из них. 
@@ -23,7 +23,7 @@ alert( "Гоп-стоп".match( /[гт]оп/gi ) ); // "Гоп", "топ"
 ```js
 //+ run
 // найти "В", затем [у или а], затем "ля"
-alert( "Вуаля".match( /В[уа]ля/ ) ); // совпадений нет
+alert( "Вуаля".match(/В[уа]ля/) ); // совпадений нет
 ```
 
 Поиск подразумевает:
@@ -69,7 +69,7 @@ alert( "Exception 0xAF".match(/x[0-9A-F][0-9A-F]/g) );
 //+ run
 var str = "The sun is rising!";
 
-alert( str.match( /\w+/g ) ); // The, sun, is, rising*!*
+alert( str.match(/\w+/g) ); // The, sun, is, rising*!*
 ```
 
 А если есть слова и на русском?
@@ -78,7 +78,7 @@ alert( str.match( /\w+/g ) ); // The, sun, is, rising*!*
 //+ run
 var str = "Солнце встаёт!";
 
-alert( str.match( /\w+/g ) ); // null*!*
+alert( str.match(/\w+/g) ); // null*!*
 ```
 
 Ничего не найдено! Это можно понять, ведь <code class="pattern">\w</code> -- это именно английская букво-цифра, как можно видеть из аналога <code class="pattern">[a-zA-Z0-9_]</code>.
@@ -91,7 +91,7 @@ alert( str.match( /\w+/g ) ); // null*!*
 //+ run
 var str = "Солнце (the sun) встаёт!";
 
-alert( str.match( /[\wа-я]+/gi ) ); // Солнце, the, sun, вста, т*!*
+alert( str.match(/[\wа-я]+/gi) ); // Солнце, the, sun, вста, т*!*
 ```
 
 ...Присмотритесь внимательно к предыдущему примеру! Вы видите странность? Оно не находит букву <code class="match">ё</code>, более того -- считает её разрывом в слове. Причина  -- в кодировке юникод, она подробно раскрыта в главе [](/string). 
@@ -102,7 +102,7 @@ alert( str.match( /[\wа-я]+/gi ) ); // Солнце, the, sun, вста, т*!*
 //+ run
 var str = "Солнце (the sun) встаёт!";
 
-alert( str.match( /[\wа-яё]+/gi ) ); // Солнце, the, sun, встаёт*!*
+alert( str.match(/[\wа-яё]+/gi) ); // Солнце, the, sun, встаёт*!*
 ```
 
 Теперь всё в порядке.
@@ -125,7 +125,7 @@ alert( str.match( /[\wа-яё]+/gi ) ); // Солнце, the, sun, встаёт*
 
 ```js
 //+ run
-alert( "alice15@gmail.com".match( /[^\d\sA-Z]/gi ) ); // "@", "."
+alert( "alice15@gmail.com".match(/[^\d\sA-Z]/gi) ); // "@", "."
 ```
 
 ## Не нужно экранирование
diff --git a/10-regular-expressions-javascript/7-regexp-quantifiers/1-find-text-manydots/solution.md b/10-regular-expressions-javascript/7-regexp-quantifiers/1-find-text-manydots/solution.md
index 350fdc0e..4eb72c42 100644
--- a/10-regular-expressions-javascript/7-regexp-quantifiers/1-find-text-manydots/solution.md
+++ b/10-regular-expressions-javascript/7-regexp-quantifiers/1-find-text-manydots/solution.md
@@ -4,6 +4,6 @@
 ```js
 //+ run
 var reg = /\.{3,}/g;
-alert("Привет!... Как дела?.....".match(reg)); // ..., .....
+alert( "Привет!... Как дела?.....".match(reg) ); // ..., .....
 ```
 
diff --git a/10-regular-expressions-javascript/7-regexp-quantifiers/1-find-text-manydots/task.md b/10-regular-expressions-javascript/7-regexp-quantifiers/1-find-text-manydots/task.md
index 750f6c59..414a49b4 100644
--- a/10-regular-expressions-javascript/7-regexp-quantifiers/1-find-text-manydots/task.md
+++ b/10-regular-expressions-javascript/7-regexp-quantifiers/1-find-text-manydots/task.md
@@ -9,6 +9,6 @@
 
 ```js
 var reg = /ваше выражение/g;
-alert("Привет!... Как дела?.....".match(reg)); // ..., .....
+alert( "Привет!... Как дела?.....".match(reg) ); // ..., .....
 ```
 
diff --git a/10-regular-expressions-javascript/7-regexp-quantifiers/article.md b/10-regular-expressions-javascript/7-regexp-quantifiers/article.md
index ac0b6608..38f2ccf8 100644
--- a/10-regular-expressions-javascript/7-regexp-quantifiers/article.md
+++ b/10-regular-expressions-javascript/7-regexp-quantifiers/article.md
@@ -20,7 +20,7 @@
 
 ```js
 //+ run
-alert( "Мне 12345 лет".match (/\d{5}/) );  //  "12345"
+alert( "Мне 12345 лет".match(/\d{5}/) ); //  "12345"
 ```
 
 </dd>
@@ -29,14 +29,14 @@ alert( "Мне 12345 лет".match (/\d{5}/) );  //  "12345"
 
 ```js
 //+ run
-alert( "Мне не 12, а 1234 года".match( /\d{3,5}/ ) );  // "1234"
+alert( "Мне не 12, а 1234 года".match(/\d{3,5}/) ); // "1234"
 ```
 
 Последнее значение можно и не указывать. Тогда выражение <code class="pattern">\d{3,}</code> найдет числа, длиной от трех цифр:
 
 ```js
 //+ run
-alert( "Мне не 12, а 345678 лет".match( /\d{3,5}/ ) );  // "345678"
+alert( "Мне не 12, а 345678 лет".match(/\d{3,5}/) ); // "345678"
 ```
 </dd>
 </dl>
@@ -47,7 +47,7 @@ alert( "Мне не 12, а 345678 лет".match( /\d{3,5}/ ) );  // "345678"
 //+ run
 var str = "+7(903)-123-45-67";
 
-alert( str.match( /\d{1,}/g ) ); // 7,903,123,45,67
+alert( str.match(/\d{1,}/g) ); // 7,903,123,45,67
 ```
 
 
@@ -65,7 +65,7 @@ alert( str.match( /\d{1,}/g ) ); // 7,903,123,45,67
 //+ run
 var str = "+7(903)-123-45-67";
 
-alert( str.match( /\d+/g ) ); // 7,903,123,45,67
+alert( str.match(/\d+/g) ); // 7,903,123,45,67
 ```
 
 </dd>
@@ -80,7 +80,7 @@ alert( str.match( /\d+/g ) ); // 7,903,123,45,67
 //+ run
 var str = "Можно писать color или colour (британский вариант)";
 
-alert( str.match( /colou?r/g ) ); // color, colour
+alert( str.match(/colou?r/g) ); // color, colour
 ```
 
 </dd>
@@ -91,14 +91,14 @@ alert( str.match( /colou?r/g ) ); // color, colour
 
 ```js
 //+ run
-alert( "100 10 1".match( /\d0*/g ) ); // 100, 10, 1
+alert( "100 10 1".match(/\d0*/g) ); // 100, 10, 1
 ```
 
 Сравните это с `'+'` (один или более):
 
 ```js
 //+ run
-alert( "100 10 1".match( /\d0+/g ) ); // 100, 10
+alert( "100 10 1".match(/\d0+/g) ); // 100, 10
 ```
 
 </dd>
@@ -115,7 +115,7 @@ alert( "100 10 1".match( /\d0+/g ) ); // 100, 10
 В действии:
 ```js
 //+ run
-alert( "0 1 12.345 7890".match( /\d+\.\d+/g ) ); // 123.45
+alert( "0 1 12.345 7890".match(/\d+\.\d+/g) ); // 123.45
 ```
 
 </dd>
@@ -124,7 +124,7 @@ alert( "0 1 12.345 7890".match( /\d+\.\d+/g ) ); // 123.45
 
 ```js
 //+ run
-alert( "<BODY> ... </BODY>".match ( /<[a-z]+>/gi ) ); // <BODY>
+alert( "<BODY> ... </BODY>".match(/<[a-z]+>/gi) ); // <BODY>
 ```
 
 Это регулярное выражение ищет символ <code class="pattern">'&lt;'</code>, за которым идут одна или более букв английского алфавита, и затем <code class="pattern">'&gt;'</code>. 
@@ -135,7 +135,7 @@ alert( "<BODY> ... </BODY>".match ( /<[a-z]+>/gi ) ); // <BODY>
 
 ```js
 //+ run
-alert( "<h1>Привет!</h1>".match( /<[a-z][a-z0-9]*>/gi ) );  // <h1>
+alert( "<h1>Привет!</h1>".match(/<[a-z][a-z0-9]*>/gi) ); // <h1>
 ```
 
 </dd>
@@ -144,7 +144,7 @@ alert( "<h1>Привет!</h1>".match( /<[a-z][a-z0-9]*>/gi ) );  // <h1>
 
 ```js
 //+ run
-alert( "<h1>Привет!</h1>".match( /<\/?[a-z][a-z0-9]*>/gi ) );  // <h1>, </h1>
+alert( "<h1>Привет!</h1>".match(/<\/?[a-z][a-z0-9]*>/gi) ); // <h1>, </h1>
 ```
 
 </dd>
diff --git a/10-regular-expressions-javascript/8-regexp-greedy-and-lazy/article.md b/10-regular-expressions-javascript/8-regexp-greedy-and-lazy/article.md
index 483116d9..e8610df7 100644
--- a/10-regular-expressions-javascript/8-regexp-greedy-and-lazy/article.md
+++ b/10-regular-expressions-javascript/8-regexp-greedy-and-lazy/article.md
@@ -152,7 +152,7 @@ alert( str.match(reg) ); // witch, broom
 
 ```js
 //+ run
-alert( "123 456".match ( /\d+ \d+?/g) );  // 123 4
+alert( "123 456".match(/\d+ \d+?/g) ); // 123 4
 ```
 
 <ol>
diff --git a/10-regular-expressions-javascript/9-regexp-groups/article.md b/10-regular-expressions-javascript/9-regexp-groups/article.md
index dcfd7072..8e8a9685 100644
--- a/10-regular-expressions-javascript/9-regexp-groups/article.md
+++ b/10-regular-expressions-javascript/9-regexp-groups/article.md
@@ -4,7 +4,7 @@
 
 У такого выделения есть два эффекта:
 <ol>
-<li>Он позволяет выделить часть совпадения в отдельный элемент массива при поиске через [:String#match] или [:RegExp#exec].</li>
+<li>Он позволяет выделить часть совпадения в отдельный элемент массива при поиске через [String#match](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/String/match) или [RegExp#exec](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec).</li>
 <li>Если поставить квантификатор после скобки, то он применится *ко всей скобке*, а не всего лишь к одному символу.</li>
 </ol>
 
@@ -13,7 +13,7 @@
 
 ```js
 //+ run
-alert( 'Gogogo now!'.match( /(go)+/i );  // "Gogogo"
+alert( 'Gogogo now!'.match(/(go)+/i ); // "Gogogo"
 ```
 
 Без скобок, шаблон <code class="pattern">/go+/</code> означал бы <code class="subject">g</code>, после которого идёт одна или более <code class="subject">o</code>, например: <code class="match">goooo</code>.
@@ -25,17 +25,17 @@ alert( 'Gogogo now!'.match( /(go)+/i );  // "Gogogo"
 
 Для удобства заключим его в скобки: <code class="pattern">&lt;(.*?)&gt;</code>. Тогда содержимое скобок можно будет получить отдельно.
 
-Используем метод [:String#match]. В результирующем массиве будет сначала всё совпадение, а далее -- скобочные группы, в данном случае -- только одна:
+Используем метод [String#match](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/String/match). В результирующем массиве будет сначала всё совпадение, а далее -- скобочные группы, в данном случае -- только одна:
 
 ```js
 //+ run
 var str = '<h1>Привет, мир!</h1>'
-var reg = /<(.*?)>/ 
+var reg = /<(.*?)>/
 
-alert( str.match(reg) ) // массив: <h1>, h1
+alert(str.match(reg)) // массив: <h1>, h1
 ```
 
-Для поиска всех совпадений, как мы обсуждали ранее, используется метод [:RegExp#exec].
+Для поиска всех совпадений, как мы обсуждали ранее, используется метод [RegExp#exec](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec).
 
 **Скобки могут быть и вложенными. В этом случае нумерация также идёт слева направо.**
 
@@ -49,7 +49,7 @@ var str = '<span class="my">';
 
 reg = /<(([a-z])[a-z0-9]*).*?>/;
 
-alert( str.match(reg) );  // <span class="my">, span, s
+alert( str.match(reg) ); // <span class="my">, span, s
 ```
 
 Вот так выглядят скобочные группы:
@@ -65,12 +65,12 @@ alert( str.match(reg) );  // <span class="my">, span, s
 
 ```js
 //+ run
-match = 'a'.match( /a(z)?(c)?/ )  
+match = 'a'.match(/a(z)?(c)?/)
 
-alert(match.length); // 3
-alert(match[0]); // a
-alert(match[1]); // undefined
-alert(match[2]); // undefined
+alert( match.length ); // 3
+alert( match[0] ); // a
+alert( match[1] ); // undefined
+alert( match[2] ); // undefined
 ```
 
 Массив получился длины `3`, но все скобочные группы -- `undefined`.
@@ -79,12 +79,12 @@ alert(match[2]); // undefined
 
 ```js
 //+ run
-match = 'ack'.match( /a(z)?(c)?/ )  
+match = 'ack'.match(/a(z)?(c)?/)
 
-alert(match.length); // 3
-alert(match[0]); // ac, всё совпадение
-alert(match[1]); // undefined, для (z)? ничего нет
-alert(match[2]); // c
+alert( match.length ); // 3
+alert( match[0] ); // ac, всё совпадение
+alert( match[1] ); // undefined, для (z)? ничего нет
+alert( match[2] ); // c
 ```
 
 Длина массива результатов по-прежнему `3`. Она постоянна. А вот для скобочной группы <code class="pattern">(z)?</code> в ней ничего нет.
diff --git a/10-regular-expressions-javascript/index.md b/10-regular-expressions-javascript/index.md
index 6dc875d7..f96e0193 100644
--- a/10-regular-expressions-javascript/index.md
+++ b/10-regular-expressions-javascript/index.md
@@ -1,5 +1,3 @@
 # Регулярные выражения [в работе]
 
-Регулярные выражения -- мощный способ поиска и замены для строк.
-
-В JavaScript они поддерживаются в простом варианте, менее мощном, чем в большинстве других языков. Но зато  нам будет проще их изучить.
+Регулярные выражения -- мощный способ поиска и замены для строк.
\ No newline at end of file
diff --git a/12-extra/10-cookie/article.md b/12-extra/10-cookie/article.md
index 3b232a91..3887263f 100644
--- a/12-extra/10-cookie/article.md
+++ b/12-extra/10-cookie/article.md
@@ -13,11 +13,11 @@
 alert( document.cookie );
 ```
 
-Эта строка состоит из пар `ключ=значение`, которые перечисляются через точку с запятой с пробелом `; `. 
+Эта строка состоит из пар `ключ=значение`, которые перечисляются через точку с запятой с пробелом `"; "`. 
 
-Значит, чтобы прочитать cookie, достаточно разбить строку по `; `, и затем найти нужный ключ. Это можно делать либо через `split` и работу с массивом, либо через регулярное выражение.
+Значит, чтобы прочитать cookie, достаточно разбить строку по `"; "`, и затем найти нужный ключ. Это можно делать либо через `split` и работу с массивом, либо через регулярное выражение.
 
-### Функция getCookie(name)
+## Функция getCookie(name)
 
 Следующая функция `getCookie(name)` возвращает cookie с именем `name`:
 
@@ -63,7 +63,7 @@ document.cookie = "userName=Vasya";
 ```js
 // +1 день от текущего момента
 var date = new Date;
-date.setDate( date.getDate() + 1 );
+date.setDate(date.getDate() + 1);
 alert( date.toUTCString() );
 ```
 
@@ -78,8 +78,8 @@ alert( date.toUTCString() );
 
 ```js
 //+ run
-var date = new Date( new Date().getTime() + 60*1000 );
-document.cookie="name=value; path=/; expires="+date.toUTCString();
+var date = new Date(new Date().getTime() + 60 * 1000);
+document.cookie = "name=value; path=/; expires=" + date.toUTCString();
 ```
 
 Чтобы удалить это cookie:
@@ -87,12 +87,12 @@ document.cookie="name=value; path=/; expires="+date.toUTCString();
 ```js
 //+ run
 var date = new Date(0);
-document.cookie="name=; path=/; expires="+date.toUTCString();
+document.cookie = "name=; path=/; expires=" + date.toUTCString();
 ```
 
 При удалении значение не важно. Можно его не указывать, как сделано в коде выше.
 
-### Функция setCookie(name, value, options)
+## Функция setCookie(name, value, options)
 
 Если собрать все настройки воедино, вот такая функция ставит куки:
 
@@ -104,23 +104,23 @@ function setCookie(name, value, options) {
 
   if (typeof expires == "number" && expires) {
     var d = new Date();
-    d.setTime(d.getTime() + expires*1000);
+    d.setTime(d.getTime() + expires * 1000);
     expires = options.expires = d;
   }
-  if (expires && expires.toUTCString) { 
-  	options.expires = expires.toUTCString();
+  if (expires && expires.toUTCString) {
+    options.expires = expires.toUTCString();
   }
 
   value = encodeURIComponent(value);
 
   var updatedCookie = name + "=" + value;
 
-  for(var propName in options) {
+  for (var propName in options) {
     updatedCookie += "; " + propName;
-    var propValue = options[propName];    
-    if (propValue !== true) { 
+    var propValue = options[propName];
+    if (propValue !== true) {
       updatedCookie += "=" + propValue;
-     }
+    }
   }
 
   document.cookie = updatedCookie;
@@ -137,7 +137,7 @@ function setCookie(name, value, options) {
 <dt>expires</dt><dd>Время истечения cookie. Интерпретируется по-разному, в зависимости от типа:
 <ul>
 <li>Число -- количество секунд до истечения. Например, `expires: 3600` -- кука на час.</li>
-<li>Объект типа [:Date] -- дата истечения.</li>
+<li>Объект типа [Date](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Date) -- дата истечения.</li>
 <li>Если expires в прошлом, то cookie будет удалено.</li>
 <li>Если expires отсутствует или `0`, то cookie будет установлено как сессионное и исчезнет при закрытии браузера.</li>
 </ul>
@@ -149,13 +149,15 @@ function setCookie(name, value, options) {
 </dd>
 </dl>
 
-### Функция deleteCookie(name)
+## Функция deleteCookie(name)
 
 Здесь всё просто -- удаляем вызовом `setCookie` с датой в прошлом.
 
 ```js
 function deleteCookie(name) {
-  setCookie(name, "", { expires: -1 })
+  setCookie(name, "", {
+    expires: -1
+  })
 }
 ```
 
@@ -241,13 +243,13 @@ function deleteCookie(name) {
 ```js
 //+ run
 if (!navigator.cookieEnabled) {
-  alert('Включите cookie для комфортной работы с этим сайтом');
+  alert( 'Включите cookie для комфортной работы с этим сайтом' );
 }
 ```
 
 ...Конечно, предполагается, что включён JavaScript. Впрочем, посетитель без JS и cookie с большой вероятностью не человек, а бот.</li> 
 </ul>
 
-## Cookie.js
+## Итого
 
-Файл с функциями для работы с cookie: [cookie.js](/files/tutorial/browser/cookie/cookie.js).
\ No newline at end of file
+Файл с функциями для работы с cookie: [cookie.js](cookie.js).
\ No newline at end of file
diff --git a/12-extra/11-intl/1-collate-array-sort/solution.md b/12-extra/11-intl/1-collate-array-sort/solution.md
index 6d2a2f49..78c1d455 100644
--- a/12-extra/11-intl/1-collate-array-sort/solution.md
+++ b/12-extra/11-intl/1-collate-array-sort/solution.md
@@ -11,7 +11,7 @@ animals.sort(function(a, b) {
 });
 */!*
 
-alert(animals); // АИСТ,ёж,енот,ехидна,тигр,ЯК
+alert( animals ); // АИСТ,ёж,енот,ехидна,тигр,ЯК
 ```
 
 А вот, что было бы при обычном вызове `sort()`:
diff --git a/12-extra/11-intl/1-collate-array-sort/task.md b/12-extra/11-intl/1-collate-array-sort/task.md
index b50404b4..c457627a 100644
--- a/12-extra/11-intl/1-collate-array-sort/task.md
+++ b/12-extra/11-intl/1-collate-array-sort/task.md
@@ -9,7 +9,7 @@ var animals = ["тигр", "ёж", "енот", "ехидна", "АИСТ", "ЯК
 
 // ... ваш код ...
 
-alert(animals); // АИСТ,ёж,енот,ехидна,тигр,ЯК
+alert( animals ); // АИСТ,ёж,енот,ехидна,тигр,ЯК
 ```
 
 В этом примере порядок сортировки не должен зависеть от регистра. 
diff --git a/12-extra/11-intl/article.md b/12-extra/11-intl/article.md
index 7b1bd827..062bed07 100644
--- a/12-extra/11-intl/article.md
+++ b/12-extra/11-intl/article.md
@@ -77,7 +77,7 @@
 
 ```js
 // создание 
-var collator = new Intl.Collator([locales, [options] ])
+var collator = new Intl.Collator([locales, [options]])
 ```
 
 Параметры:
@@ -131,7 +131,9 @@ alert( collator.compare("ёжик", "яблоко") ); // -1 (ёжик мень
 var collator = new Intl.Collator();
 alert( collator.compare("ЁжиК", "ёжик") ); // 1, разные
 
-var collator = new Intl.Collator(undefined, { sensitivity: "accent" } );
+var collator = new Intl.Collator(undefined, {
+  sensitivity: "accent"
+});
 alert( collator.compare("ЁжиК", "ёжик") ); // 0, одинаковые
 ```
 
@@ -141,7 +143,7 @@ alert( collator.compare("ЁжиК", "ёжик") ); // 0, одинаковые
 
 ```js
 // создание 
-var formatter = new Intl.DateFormatter([locales, [options] ])
+var formatter = new Intl.DateFormatter([locales, [options]])
 ```
 
 Первый аргумент -- такой же, как и в `Collator`, а в объекте `options` мы можем определить, какие именно части даты показывать (часы, месяц, год...) и в каком формате.
@@ -281,13 +283,13 @@ alert( formatter.format(date) ); // 12/31/2014
 var date = new Date(2014, 11, 31, 12, 30, 0);
 
 var formatter = new Intl.DateTimeFormat("ru", {
-  weekday: "long", 
-  year: "numeric", 
+  weekday: "long",
+  year: "numeric",
   month: "long",
-  day: "numeric" 
+  day: "numeric"
 });
 
-alert( formatter.format(date) );  // среда, 31 декабря 2014 г.
+alert( formatter.format(date) ); // среда, 31 декабря 2014 г.
 ```
 
 Только время:
@@ -297,12 +299,12 @@ alert( formatter.format(date) );  // среда, 31 декабря 2014 г.
 var date = new Date(2014, 11, 31, 12, 30, 0);
 
 var formatter = new Intl.DateTimeFormat("ru", {
-  hour: "numeric" , 
-  minute: "numeric" , 
-  second: "numeric" 
+  hour: "numeric",
+  minute: "numeric",
+  second: "numeric"
 });
 
-alert( formatter.format(date) );  // 12:30:00
+alert( formatter.format(date) ); // 12:30:00
 ```
 
 ## Числа: Intl.NumberFormat
@@ -312,7 +314,7 @@ alert( formatter.format(date) );  // 12:30:00
 Синтаксис:
 
 ```js
-var formatter = new Intl.NumberFormat([locales [, options] ]);
+var formatter = new Intl.NumberFormat([locales[, options]]);
 
 formatter.format(number); // форматирование
 ```
@@ -398,7 +400,7 @@ formatter.format(number); // форматирование
 ```js
 //+ run
 var formatter = new Intl.NumberFormat("ru");
-alert(formatter.format(1234567890.123)); // 1 234 567 890,123
+alert( formatter.format(1234567890.123) ); // 1 234 567 890,123
 ```
 
 С ограничением значимых цифр (важны только первые 3):
@@ -408,7 +410,7 @@ alert(formatter.format(1234567890.123)); // 1 234 567 890,123
 var formatter = new Intl.NumberFormat("ru", {
   maximumSignificantDigits: 3
 });
-alert(formatter.format(1234567890.123)); // 1 230 000 000
+alert( formatter.format(1234567890.123) ); // 1 230 000 000
 ```
 
 C опциями для валюты:
@@ -419,7 +421,7 @@ var formatter = new Intl.NumberFormat("ru", {
   currency: "GBP"
 });
 
-alert( formatter.format(1234.5)); // 1 234,5 £
+alert( formatter.format(1234.5) ); // 1 234,5 £
 ```
 
 С двумя цифрами после запятой:
@@ -431,7 +433,7 @@ var formatter = new Intl.NumberFormat("ru", {
   minimumFractionDigits: 2
 });
 
-alert( formatter.format(1234.5)); // 1 234,50 £
+alert( formatter.format(1234.5) ); // 1 234,50 £
 ```
 
 ## Методы в Date, String, Number
@@ -454,7 +456,7 @@ alert( str.localeCompare("яблоко", "ru") ); // -1
 <dd>Форматирует дату в соответствии с локалью, например:
 
 ```js
-//+ run
+//+ run no-beautify
 var date = new Date(2014, 11, 31, 12, 00);
 
 alert( date.toLocaleString("ru", { year: 'numeric', month: 'long' }) ); // Декабрь 2014
diff --git a/12-extra/12-regexp-specials/article.md b/12-extra/12-regexp-specials/article.md
index 9a0ddd00..50303b3c 100644
--- a/12-extra/12-regexp-specials/article.md
+++ b/12-extra/12-regexp-specials/article.md
@@ -2,7 +2,7 @@
 
 Регулярные выражения в javascript немного странные. Вроде - перловые, обычные, но с подводными камнями, на которые натыкаются даже опытные javascript-разработчики.
 
-Эта статья ставит целью перечислить неожиданные фишки и особенности [:RegExp] в краткой и понятной форме.
+Эта статья ставит целью перечислить неожиданные фишки и особенности `RegExp` в краткой и понятной форме.
 
 
 [cut]
@@ -18,12 +18,12 @@
 //+ run
 function bbtagit(text) {
   text = text.replace(/\[u\](.*?)\[\/u\]/gim, '<u>$1</u>')
- 
+
   return text
 }
 
 var line = "[u]мой\n текст[/u]"
-alert( bbtagit(line) )
+alert(bbtagit(line))
 ```
 
 Попробуйте запустить. Заменяет? Как бы не так!
@@ -38,12 +38,12 @@ alert( bbtagit(line) )
 //+ run
 function bbtagit(text) {
   text = text.replace(/\[u\]([\s\S]*)\[\/u\]/gim, '<u>$1</u>')
- 
+
   return text
 }
 
 var line = "[u]мой\n текст[/u]"
-alert( bbtagit(line) )
+alert(bbtagit(line))
 ```
 
 ## Жадность
@@ -103,7 +103,7 @@ alert(text)
 //+ run
 text = ' [b]a [u]b[/u] c [/b] '
 
-var reg = /\[([bus])\](.*?)\[\//*u*/\1/*/u*/\]/
+var reg = /\[([bus])\](.*?)\[\// * u * /\1/ * /u*/\] /
 text = text.replace(reg, '<$1>$2</$1>')
 alert(text)
 ```
@@ -120,7 +120,7 @@ P.S. Понятно, что при таком способе поиска bb-т
 
 ### Заменить все
 
-Для замены всех вхождений используется метод [:String#replace|]. 
+Для замены всех вхождений используется метод [String#replace](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/String/replace). 
 Он интересен тем, что допускает первый аргумент - регэксп или строку. 
 
 Если первый аргумент - строка, то будет осуществлен поиск подстроки, без преобразования в регулярное выражение.
@@ -134,7 +134,7 @@ alert("2 ++ 1".replace("+", "*"))
 
 Как видите, заменился только один плюс, а не оба.
 
-**Чтобы заменить все вхождения, [:String#replace|] обязательно нужно использовать с регулярным выражением.**
+**Чтобы заменить все вхождения, [String#replace](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/String/replace) обязательно нужно использовать с регулярным выражением.**
 
 В режиме регулярного выражения плюс придётся экранировать, но зато <code>replace</code> заменит все вхождения (при указании флага <code>g</code>):
 
@@ -152,7 +152,7 @@ alert("2 ++ 1".replace(/\+/g, "*"))
 Следующий пример произведет операции вычитания:
 
 ```js
-//+ run
+//+ run no-beautify
 var str = "count 36 - 26, 18 - 9"
 str = str.replace(/(\d+) - (\d+)/g, function(a,b,c) { return b-c })
 alert(str)
@@ -161,32 +161,32 @@ alert(str)
 ### Найти всё
 
 В javascript нет одного универсального метода для поиска всех совпадений. 
-Для поиска без запоминания скобочных групп - можно использовать [:String#match|]:
+Для поиска без запоминания скобочных групп - можно использовать [String#match](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/String/match):
 
 ```js
 //+ run
 var str = "count 36-26, 18-9"
-var re =  /(\d+)-(\d+)/g
+var re = /(\d+)-(\d+)/g
 result = str.match(re)
-for(var i=0; i<result.length; i++) alert(result[i])
+for (var i = 0; i < result.length; i++) alert(result[i])
 ```
 
 Как видите, оно исправно ищет все совпадения (флаг <code>'g'</code> у регулярного выражения обязателен), но при этом не запоминает скобочные группы. Эдакий "облегченный вариант". 
 
 ### Найти всё с учётом скобочных групп
 
-В сколько-нибудь сложных задачах важны не только совпадения, но и скобочные группы. Чтобы их найти, предлагается использовать многократный вызов [:RegExp#exec|].
+В сколько-нибудь сложных задачах важны не только совпадения, но и скобочные группы. Чтобы их найти, предлагается использовать многократный вызов [RegExp#exec](https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec).
 
 Для этого регулярное выражение должно использовать флаг <code>'g'</code>. Тогда результат поиска, запомненный в свойстве <code>lastIndex</code> объекта <code>RegExp</code> используется как точка отсчета для следующего поиска:
 
 ```js
 //+ run
 var str = "count 36-26, 18-9"
-var re =  /(\d+)-(\d+)/g
+var re = /(\d+)-(\d+)/g
 var res
-while ( (res = re.exec(str)) != null) {
-  alert("Найдено " + res[0] + ":  ("+ res[1]+") и ("+res[2]+")")
-  alert("Дальше ищу с позиции "+re.lastIndex)
+while ((res = re.exec(str)) != null) {
+  alert("Найдено " + res[0] + ":  (" + res[1] + ") и (" + res[2] + ")")
+  alert("Дальше ищу с позиции " + re.lastIndex)
 }
 ```
 
diff --git a/12-extra/3-templates/article.md b/12-extra/3-templates/article.md
index 1165be14..e69a0253 100644
--- a/12-extra/3-templates/article.md
+++ b/12-extra/3-templates/article.md
@@ -16,6 +16,7 @@
 Пример:
 
 ```html
+<!--+ no-beautify -->
 <div class="menu">
   <span class="title"><%-title%></span>
   <ul>
@@ -129,6 +130,7 @@ alert( compiled() ); // <div>Привет</div>
 Шаблон для меню в Handlerbars, к примеру, будет выглядеть так:
 
 ```html
+<!--+ no-beautify -->
 <div class="menu">
   <span class="title">{{title}}</span>
   <ul>
@@ -151,7 +153,7 @@ var compiled = Handlebars.compile(tmpl);
 
 var result = compiled({
   title: "Сладости",
-  items: [ "Торт", "Пирожное", "Пончик" ]
+  items: ["Торт", "Пирожное", "Пончик"]
 });
 ```
 
@@ -228,7 +230,7 @@ ko.applyBindings(user, document.body);
 Например:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <script src="http://knockoutjs.com/downloads/knockout-3.1.0.js"></script>
 
 <script>
diff --git a/12-extra/4-books/article.md b/12-extra/4-books/article.md
index f687e3f1..b65edd19 100644
--- a/12-extra/4-books/article.md
+++ b/12-extra/4-books/article.md
@@ -17,7 +17,7 @@ CSS стоит изучать по одной из этих книг. Можно
 <i>Эрик Мейер</i></li>
 </ul>
 
-Конечно, [стандарт CSS 2.1](http://specs.operafan.net/css2.1RU/CSS21/visuren.html) тоже будет вам в помощь. Подчас его скупая простота и точность гораздо понятнее, чем много страниц разъяснений.
+Конечно, [стандарты](http://www.w3.org/Style/CSS/) тоже будут полезны. Подчас их точность куда проще, чем много страниц разъяснений.
 
 ## JavaScript
 
diff --git a/12-extra/5-setImmediate/article.md b/12-extra/5-setImmediate/article.md
index cd0e5e9e..93d16318 100644
--- a/12-extra/5-setImmediate/article.md
+++ b/12-extra/5-setImmediate/article.md
@@ -16,6 +16,7 @@
 Полифилл для `setImmediate` через `postMessage`:
 
 ```js
+//+ no-beautify
 if (!window.setImmediate) window.setImmediate = (function() {
   var head = { }, tail = head; // очередь вызовов, 1-связный список
 
diff --git a/12-extra/6-bind-late/article.md b/12-extra/6-bind-late/article.md
index a33953e6..07fd2028 100644
--- a/12-extra/6-bind-late/article.md
+++ b/12-extra/6-bind-late/article.md
@@ -59,7 +59,7 @@ var func = bindLate(obj, "method");
 Код:
 
 ```js
-function bindLate(context, funcName) { 
+function bindLate(context, funcName) {
   return function() {
     return context[funcName].apply(context, arguments);
   };
@@ -138,7 +138,7 @@ userSayHi(); // Метод работает: *!*Привет!*/!*
 Обёртка для позднего связывания (без карринга):
 
 ```js
-function bindLate(context, funcName) { 
+function bindLate(context, funcName) {
   return function() {
     return context[funcName].apply(context, arguments);
   };
diff --git a/12-extra/8-range-textrange-selection/article.md b/12-extra/8-range-textrange-selection/article.md
index add2aa45..db67a2c7 100644
--- a/12-extra/8-range-textrange-selection/article.md
+++ b/12-extra/8-range-textrange-selection/article.md
@@ -50,25 +50,25 @@ HTML:
 </button>
 
 <script>
-function domRangeCreate() {
-  // Найдем корневой контейнер
-  var root = document.getElementById('ex2');
-  // Найдем контейнеры граничных точек (в данном случае тестовые)
-  var start = root.getElementsByTagName('h2')[0].firstChild;
-  var end = root.getElementsByTagName('p')[0].firstChild;
-  if (root.createRange) {
-    // Создаем Range
-    var rng = root.createRange();
-    // Задаем верхнюю граничную точку, передав контейнер и смещение
-    rng.setStart( start, 3 );
-    // Аналогично для нижней границы
-    rng.setEnd( end, 10 );
-    // Теперь мы можем вернуть текст, который содержится в полученной области
-    return rng.toString();
-  } else {
-    return 'Вероятно, у вас IE8-, смотрите реализацию TextRange ниже';
+  function domRangeCreate() {
+    // Найдем корневой контейнер
+    var root = document.getElementById('ex2');
+    // Найдем контейнеры граничных точек (в данном случае тестовые)
+    var start = root.getElementsByTagName('h2')[0].firstChild;
+    var end = root.getElementsByTagName('p')[0].firstChild;
+    if (root.createRange) {
+      // Создаем Range
+      var rng = root.createRange();
+      // Задаем верхнюю граничную точку, передав контейнер и смещение
+      rng.setStart(start, 3);
+      // Аналогично для нижней границы
+      rng.setEnd(end, 10);
+      // Теперь мы можем вернуть текст, который содержится в полученной области
+      return rng.toString();
+    } else {
+      return 'Вероятно, у вас IE8-, смотрите реализацию TextRange ниже';
+    }
   }
-}
 </script>
 ```
 
@@ -99,9 +99,9 @@ function domRangeCreate() {
 ```js
 var rng = document.createRange();
 // Установит верхнюю граничную точку по левой границе спана #s1
-rng.setStartBefore( document.getElementById('s1') );
+rng.setStartBefore(document.getElementById('s1'));
 // Установит нижнюю граничную точку по правой границе спана #s2
-rng.setEndAfter( document.getElementById('s2') );
+rng.setEndAfter(document.getElementById('s2'));
 ```
 
 </li>
@@ -129,32 +129,32 @@ rng.setEndAfter( document.getElementById('s2') );
 </div>
 
 <script>
-function domRangeHighlight(text) {
-  // Получим текстовый узел
-  var root = document.getElementById('ex3').firstChild;
-  // и его содержимое
-  var content = root.nodeValue;
-  // Проверим есть ли совпадения с переданным текстом
-  if ( ~content.indexOf( text ) ) {
-    if ( document.createRange ) {
-      // Если есть совпадение, и браузер поддерживает Range, создаем объект
-      var rng = document.createRange();
-      // Ставим верхнюю границу по индексу совпадения,
-      rng.setStart( root, content.indexOf( text ) );
-      // а нижнюю по индексу + длина текста
-      rng.setEnd( root, content.indexOf( text ) + text.length );
-      // Создаем спан с синим фоном
-      var highlightDiv = document.createElement('span');
-      highlightDiv.style.backgroundColor = 'blue';
-      // Обернем наш Range в спан
-      rng.surroundContents( highlightDiv );
+  function domRangeHighlight(text) {
+    // Получим текстовый узел
+    var root = document.getElementById('ex3').firstChild;
+    // и его содержимое
+    var content = root.nodeValue;
+    // Проверим есть ли совпадения с переданным текстом
+    if (~content.indexOf(text)) {
+      if (document.createRange) {
+        // Если есть совпадение, и браузер поддерживает Range, создаем объект
+        var rng = document.createRange();
+        // Ставим верхнюю границу по индексу совпадения,
+        rng.setStart(root, content.indexOf(text));
+        // а нижнюю по индексу + длина текста
+        rng.setEnd(root, content.indexOf(text) + text.length);
+        // Создаем спан с синим фоном
+        var highlightDiv = document.createElement('span');
+        highlightDiv.style.backgroundColor = 'blue';
+        // Обернем наш Range в спан
+        rng.surroundContents(highlightDiv);
+      } else {
+        alert( 'Вероятно, у вас IE8-, смотрите реализацию TextRange ниже' );
+      }
     } else {
-      alert('Вероятно, у вас IE8-, смотрите реализацию TextRange ниже');
+      alert( 'Совпадений не найдено' );
     }
-  } else {
-    alert('Совпадений не найдено');
   }
-}
 </script>
 ```
 
@@ -177,19 +177,19 @@ function domRangeHighlight(text) {
 <input id="buttonId" type="button" value="Test button" onclick="alert( ieTextRangeCreate() );" />
 
 <script>
-function ieTextRangeCreate() {
-  // Найдем кнопку
-  var button = document.getElementById('buttonId');
-  // Если мы в ИЕ
-  if ( button.createTextRange && button.createTextRange() != undefined ) {
-    // Создаем TextRange
-    var rng = button.createTextRange();
-    // И вернем текстовое содержимое полученного объекта
-    return rng.text;
-  } else {
-    return 'Вероятно, у вас не IE, смотрите реализацию Range выше';
+  function ieTextRangeCreate() {
+    // Найдем кнопку
+    var button = document.getElementById('buttonId');
+    // Если мы в ИЕ
+    if (button.createTextRange && button.createTextRange() != undefined) {
+      // Создаем TextRange
+      var rng = button.createTextRange();
+      // И вернем текстовое содержимое полученного объекта
+      return rng.text;
+    } else {
+      return 'Вероятно, у вас не IE, смотрите реализацию Range выше';
+    }
   }
-}
 </script>
 ```
 
@@ -239,30 +239,30 @@ function ieTextRangeCreate() {
 </div>
 
 <script>
-function ieTextRangeHighlight(text) {
-  // Получим ссылку на элемент, в котором будет происходить поиск
-  var root = document.getElementById('ex4');
-  // Получим значение его текстового потомка
-  var content = root.firstChild.nodeValue;
-  // Если есть совпадение
-  if ( ~content.indexOf(text) ) {
-    // и мы в MSIE
-    if ( document.body.createTextRange ) {
-      // Создадим объект TextRange
-      var rng = document.body.createTextRange();
-      // Свернем его до root
-      rng.moveToElementText( root );
-      // Найдем текст и свернем диапазон до него
-      if ( rng.findText( text ) )
+  function ieTextRangeHighlight(text) {
+    // Получим ссылку на элемент, в котором будет происходить поиск
+    var root = document.getElementById('ex4');
+    // Получим значение его текстового потомка
+    var content = root.firstChild.nodeValue;
+    // Если есть совпадение
+    if (~content.indexOf(text)) {
+      // и мы в MSIE
+      if (document.body.createTextRange) {
+        // Создадим объект TextRange
+        var rng = document.body.createTextRange();
+        // Свернем его до root
+        rng.moveToElementText(root);
+        // Найдем текст и свернем диапазон до него
+        if (rng.findText(text))
         // Заменим текстовый фрагмент на span с синим фоном
-        rng.pasteHTML( '<span style="background:blue;">' + text + '</span>' );
+          rng.pasteHTML('<span style="background:blue;">' + text + '</span>');
+      } else {
+        alert( 'Вероятно, у вас не  IE, смотрите реализацию Range выше' );
+      }
     } else {
-      alert('Вероятно, у вас не  IE, смотрите реализацию Range выше');
+      alert( 'Совпадений не найдено' );
     }
-  } else {
-    alert('Совпадений не найдено');
   }
-}
 </script>
 ```
 
@@ -281,6 +281,7 @@ function ieTextRangeHighlight(text) {
 Эту задачу мы уже решали в самом начале статьи <a href="#demo-mix">в примере с миксом</a>. Теперь рассмотрим код:
 
 ```js
+//+ no-beautify
 function getSelectionText() {
   var txt = '';
   if (txt = window.getSelection) // Не IE, используем метод getSelection
@@ -342,21 +343,21 @@ IE предоставляет собственный интерфейс взаи
 </div>
 
 <script>
-function setSelection() {
-  var target = document.getElementById('ex5').getElementsByTagName('span')[0];
-  var rng, sel;
-  if ( document.createRange ) {
-    rng = document.createRange();
-    rng.selectNode( target )
-    sel = window.getSelection();
-    sel.removeAllRanges();
-    sel.addRange( rng );
-  } else {
-    var rng = document.body.createTextRange();
-    rng.moveToElementText( target );
-    rng.select();
+  function setSelection() {
+    var target = document.getElementById('ex5').getElementsByTagName('span')[0];
+    var rng, sel;
+    if (document.createRange) {
+      rng = document.createRange();
+      rng.selectNode(target)
+      sel = window.getSelection();
+      sel.removeAllRanges();
+      sel.addRange(rng);
+    } else {
+      var rng = document.body.createTextRange();
+      rng.moveToElementText(target);
+      rng.select();
+    }
   }
-}
 </script>
 ```
 
@@ -372,7 +373,7 @@ function clearSelection() {
   try {
     // современный объект Selection
     window.getSelection().removeAllRanges();
-  } catch(e) {
+  } catch (e) {
     // для IE8-
     document.selection.empty();
   }
@@ -393,15 +394,15 @@ function clearSelection() {
 
 ```js
   var range = getRangeObject();
-  if(range) {
-    alert(range);
-    alert(range.startContainer.nodeValue);
-    alert(range.startOffset);
-    alert(range.endOffset);
+  if (range) {
+    alert( range );
+    alert( range.startContainer.nodeValue );
+    alert( range.startOffset );
+    alert( range.endOffset );
   } else {
-    alert('Ничего не выделено');
+    alert( 'Ничего не выделено' );
+  }
   }
-}
 ```
 
 В действии:
diff --git a/2-ui/1-document/1-browser-environment/article.md b/2-ui/1-document/1-browser-environment/article.md
index 12515f49..c713e303 100644
--- a/2-ui/1-document/1-browser-environment/article.md
+++ b/2-ui/1-document/1-browser-environment/article.md
@@ -29,7 +29,7 @@ window.open('http://ya.ru');
 ```js
 //+ run
 document.body.style.background = 'red';
-alert('Элемент BODY стал красным, а сейчас обратно вернётся');
+alert( 'Элемент BODY стал красным, а сейчас обратно вернётся' );
 document.body.style.background = '';
 ```
 
@@ -57,7 +57,7 @@ BOM -- это объекты для работы с чем угодно, кро
 Пример использования:
 ```js
 //+ run
-alert(location.href); // выведет текущий адрес
+alert( location.href ); // выведет текущий адрес
 ```
 
 Большинство возможностей BOM стандартизированы в [HTML 5](http://www.w3.org/TR/html5/Overview.html), хотя различные браузеры и предоставляют зачастую что-то своё, в дополнение к стандарту.
diff --git a/2-ui/1-document/10-compare-document-position/article.md b/2-ui/1-document/10-compare-document-position/article.md
index 4e958160..e8374584 100644
--- a/2-ui/1-document/10-compare-document-position/article.md
+++ b/2-ui/1-document/10-compare-document-position/article.md
@@ -57,21 +57,21 @@ var result = nodeA.compareDocumentPosition(nodeB);
 </ul>
 
 <script>
-var p = document.body.children[0];
-var ul = document.body.children[1];
-var li = ul.children[0];
+  var p = document.body.children[0];
+  var ul = document.body.children[1];
+  var li = ul.children[0];
 
-// 1. <ul> находится после <p>
-alert( ul.compareDocumentPosition( p ) ); // 2 = 10
+  // 1. <ul> находится после <p>
+  alert( ul.compareDocumentPosition(p) ); // 2 = 10
 
-// 2. <p> находится до <ul>
-alert( p.compareDocumentPosition( ul ) );  // 4 = 100
+  // 2. <p> находится до <ul>
+  alert( p.compareDocumentPosition(ul) ); // 4 = 100
 
-// 3. <ul> родитель <li>
-alert( ul.compareDocumentPosition( li ) ); // 20 = 10100
+  // 3. <ul> родитель <li>
+  alert( ul.compareDocumentPosition(li) ); // 20 = 10100
 
-// 4. <ul> потомок <body>
-alert( ul.compareDocumentPosition( document.body ) ); // 10 = 1010
+  // 4. <ul> потомок <body>
+  alert( ul.compareDocumentPosition(document.body) ); // 10 = 1010
 </script>
 ```
 
@@ -111,13 +111,13 @@ alert( 20..toString(2) );
 </ul>
 
 <script>
-var body = document.body;
-var li = document.body.children[0].children[0];
+  var body = document.body;
+  var li = document.body.children[0].children[0];
 
 *!*
-if( body.compareDocumentPosition(li) & 16 ) {
-  alert( body +' содержит ' + li );
-}
+  if (body.compareDocumentPosition(li) & 16) {
+    alert( body + ' содержит ' + li );
+  }
 */!*
 </script>
 ```
@@ -139,18 +139,17 @@ if( body.compareDocumentPosition(li) & 16 ) {
 
 ```js
 // код с http://compatibility.shwups-cms.ch/en/polyfills/?&id=82
-(function(){
+(function() {
   var el = document.documentElement;
-  if( !el.compareDocumentPosition && el.sourceIndex !== undefined ){
+  if (!el.compareDocumentPosition && el.sourceIndex !== undefined) {
 
-    Element.prototype.compareDocumentPosition = function(other){
+    Element.prototype.compareDocumentPosition = function(other) {
       return (this != other && this.contains(other) && 16) +
-                 (this != other && other.contains(this) && 8) +
-                 (this.sourceIndex >= 0 && other.sourceIndex >= 0 ?
-                   (this.sourceIndex < other.sourceIndex && 4) +
-                   (this.sourceIndex > other.sourceIndex && 2) 
-                   : 1
-                 ) + 0;
+        (this != other && other.contains(this) && 8) +
+        (this.sourceIndex >= 0 && other.sourceIndex >= 0 ?
+          (this.sourceIndex < other.sourceIndex && 4) +
+          (this.sourceIndex > other.sourceIndex && 2) : 1
+        ) + 0;
     }
   }
 }());
diff --git a/2-ui/1-document/11-modifying-document/10-clock-setinterval/solution.md b/2-ui/1-document/11-modifying-document/10-clock-setinterval/solution.md
index 682e2e1a..d591b6b4 100644
--- a/2-ui/1-document/11-modifying-document/10-clock-setinterval/solution.md
+++ b/2-ui/1-document/11-modifying-document/10-clock-setinterval/solution.md
@@ -4,7 +4,7 @@
 
 ```html
 <div id="clock">
-    <span class="hour">hh</span>:<span class="min">mm</span>:<span class="sec">ss</span>
+  <span class="hour">hh</span>:<span class="min">mm</span>:<span class="sec">ss</span>
 </div>
 ```
 
@@ -15,21 +15,21 @@
 ```js
 function update() {
   var clock = document.getElementById('clock');
-  
+
 *!*
   var date = new Date(); // (*)
 */!*
 
   var hours = date.getHours();
-  if (hours < 10) hours = '0'+hours;
+  if (hours < 10) hours = '0' + hours;
   clock.children[0].innerHTML = hours;
 
   var minutes = date.getMinutes();
-  if (minutes < 10) minutes = '0'+minutes;
+  if (minutes < 10) minutes = '0' + minutes;
   clock.children[1].innerHTML = minutes;
 
   var seconds = date.getSeconds();
-  if (seconds < 10) seconds = '0'+seconds;
+  if (seconds < 10) seconds = '0' + seconds;
   clock.children[2].innerHTML = seconds;
 }
 ```
@@ -41,9 +41,9 @@ function update() {
 Функция `clockStart` для запуска часов:
 
 ```js
-function clockStart() {  // запустить часы
+function clockStart() { // запустить часы
   setInterval(update, 1000);
-  update();  // (*)
+  update(); // (*)
 }
 
 function clockStop() {
diff --git a/2-ui/1-document/11-modifying-document/2-remove-polyfill/solution.md b/2-ui/1-document/11-modifying-document/2-remove-polyfill/solution.md
index c4330e37..bd99772f 100644
--- a/2-ui/1-document/11-modifying-document/2-remove-polyfill/solution.md
+++ b/2-ui/1-document/11-modifying-document/2-remove-polyfill/solution.md
@@ -18,6 +18,6 @@
 
   var elem = document.body.children[0];
 
-  elem.remove();  
+  elem.remove();
 </script>
 ```
\ No newline at end of file
diff --git a/2-ui/1-document/11-modifying-document/2-remove-polyfill/task.md b/2-ui/1-document/11-modifying-document/2-remove-polyfill/task.md
index a4c72d87..a212fdc0 100644
--- a/2-ui/1-document/11-modifying-document/2-remove-polyfill/task.md
+++ b/2-ui/1-document/11-modifying-document/2-remove-polyfill/task.md
@@ -16,12 +16,12 @@
 <div>Элементы DOM</div>
 
 <script>
-  /* ваш код полифилла */ 
-  
+  /* ваш код полифилла */
+
   var elem = document.body.children[0];
 
 *!*
-  elem.remove();  // <-- вызов должен удалить элемент
+  elem.remove(); // <-- вызов должен удалить элемент
 */!*
 </script>
 ```
diff --git a/2-ui/1-document/11-modifying-document/3-insert-after/solution.md b/2-ui/1-document/11-modifying-document/3-insert-after/solution.md
index 63e6e886..4436bdcb 100644
--- a/2-ui/1-document/11-modifying-document/3-insert-after/solution.md
+++ b/2-ui/1-document/11-modifying-document/3-insert-after/solution.md
@@ -9,9 +9,9 @@ function insertAfter(elem, refElem) {
   var parent = refElem.parentNode;
   var next = refElem.nextSibling;
   if (next) {
-      return parent.insertBefore(elem, next);
+    return parent.insertBefore(elem, next);
   } else {
-      return parent.appendChild(elem);
+    return parent.appendChild(elem);
   }
 }
 ```
@@ -20,7 +20,7 @@ function insertAfter(elem, refElem) {
 
 ```js
 function insertAfter(elem, refElem) {
-    return refElem.parentNode.insertBefore(elem, refElem.nextSibling);
+  return refElem.parentNode.insertBefore(elem, refElem.nextSibling);
 }
 ```
 
diff --git a/2-ui/1-document/11-modifying-document/3-insert-after/task.md b/2-ui/1-document/11-modifying-document/3-insert-after/task.md
index 30947467..d5fa5329 100644
--- a/2-ui/1-document/11-modifying-document/3-insert-after/task.md
+++ b/2-ui/1-document/11-modifying-document/3-insert-after/task.md
@@ -20,8 +20,7 @@
   insertAfter(elem, body.firstChild); // <--- должно работать
 
   // вставить elem за последним элементом
-  insertAfter(elem, body.lastChild);  // <--- должно работать 
-  
+  insertAfter(elem, body.lastChild); // <--- должно работать
 </script>
 ```
 
diff --git a/2-ui/1-document/11-modifying-document/4-remove-children/solution.md b/2-ui/1-document/11-modifying-document/4-remove-children/solution.md
index 9ea9f63d..3ca743c4 100644
--- a/2-ui/1-document/11-modifying-document/4-remove-children/solution.md
+++ b/2-ui/1-document/11-modifying-document/4-remove-children/solution.md
@@ -4,7 +4,7 @@
 
 ```js
 function removeChildren(elem) {
-  for(var k=0; k<elem.childNodes.length;k++) {
+  for (var k = 0; k < elem.childNodes.length; k++) {
     elem.removeChild(elem.childNodes[k]);
   }
 }
@@ -20,7 +20,7 @@ function removeChildren(elem) {
 
 ```js
 function removeChildren(elem) {
-  while(elem.lastChild) {
+  while (elem.lastChild) {
     elem.removeChild(elem.lastChild);
   }
 }
@@ -44,8 +44,8 @@ function removeChildren(elem) {
 function removeChildren(elem) {
   try {
     elem.innerHTML = '';
-  } catch(e) {
-    while(elem.firstChild) { 
+  } catch (e) {
+    while (elem.firstChild) {
       elem.removeChild(elem.firstChild);
     }
   }
diff --git a/2-ui/1-document/11-modifying-document/4-remove-children/task.md b/2-ui/1-document/11-modifying-document/4-remove-children/task.md
index e7609cc8..e6b7cb74 100644
--- a/2-ui/1-document/11-modifying-document/4-remove-children/task.md
+++ b/2-ui/1-document/11-modifying-document/4-remove-children/task.md
@@ -7,7 +7,9 @@
 ```html
 <table id="table">
   <tr>
-    <td>Это</td><td>Все</td><td>Элементы DOM</td>
+    <td>Это</td>
+    <td>Все</td>
+    <td>Элементы DOM</td>
   </tr>
 </table>
 
diff --git a/2-ui/1-document/11-modifying-document/5-why-aaa/task.md b/2-ui/1-document/11-modifying-document/5-why-aaa/task.md
index 47a76ec2..d0d6d4df 100644
--- a/2-ui/1-document/11-modifying-document/5-why-aaa/task.md
+++ b/2-ui/1-document/11-modifying-document/5-why-aaa/task.md
@@ -9,17 +9,17 @@
 <table>
   aaa
   <tr>
-   <td>Test</td>
+    <td>Test</td>
   </tr>
 </table>
 
 <script>
-var table = document.body.children[0]; 
+  var table = document.body.children[0];
 
-alert(table); // таблица, пока всё правильно
+  alert( table ); // таблица, пока всё правильно
 
-document.body.removeChild( table );
-// почему в документе остался текст?
+  document.body.removeChild(table);
+  // почему в документе остался текст?
 </script>
 ```
 
diff --git a/2-ui/1-document/11-modifying-document/7-create-object-tree/task.md b/2-ui/1-document/11-modifying-document/7-create-object-tree/task.md
index ce416085..25eb80be 100644
--- a/2-ui/1-document/11-modifying-document/7-create-object-tree/task.md
+++ b/2-ui/1-document/11-modifying-document/7-create-object-tree/task.md
@@ -8,19 +8,19 @@
 
 ```js
 var data = {
-  "Рыбы":{
-    "Форель":{},
-    "Щука":{}
+  "Рыбы": {
+    "Форель": {},
+    "Щука": {}
   },
 
-  "Деревья":{
-    "Хвойные":{
-      "Лиственница":{},
-      "Ель":{}
+  "Деревья": {
+    "Хвойные": {
+      "Лиственница": {},
+      "Ель": {}
     },
-    "Цветковые":{
-      "Берёза":{},
-      "Тополь":{}
+    "Цветковые": {
+      "Берёза": {},
+      "Тополь": {}
     }
   }
 };
diff --git a/2-ui/1-document/11-modifying-document/article.md b/2-ui/1-document/11-modifying-document/article.md
index 8c891639..9fe5ea49 100644
--- a/2-ui/1-document/11-modifying-document/article.md
+++ b/2-ui/1-document/11-modifying-document/article.md
@@ -78,12 +78,10 @@ div.innerHTML = "<strong>Ура!</strong> Вы прочитали это важ
 </ol>
 
 <script>
-
   var newLi = document.createElement('li');
   newLi.innerHTML = 'Привет, мир!';
 
   list.appendChild(newLi);
-
 </script>
 ```
 
@@ -101,7 +99,6 @@ div.innerHTML = "<strong>Ура!</strong> Вы прочитали это важ
   <li>2</li>
 </ol>
 <script>
-
   var newLi = document.createElement('li');
   newLi.innerHTML = 'Привет, мир!';
 
@@ -147,6 +144,7 @@ parentElem.appendChild(elem)
 ```html
 <!--+ height=150 run autorun -->
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.css">
+
 <body>
   <h3>Моя страница</h3>
 </body>
@@ -167,6 +165,7 @@ parentElem.appendChild(elem)
 ```html
 <!--+ height=150 run autorun -->
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.css">
+
 <body>
   <h3>Моя страница</h3>
 </body>
@@ -197,6 +196,7 @@ parentElem.appendChild(elem)
 ```html
 <!--+ height=200 run autorun -->
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.css">
+
 <body>
   <h3>Моя страница</h3>
 </body>
@@ -214,16 +214,15 @@ parentElem.appendChild(elem)
   // копию можно подправить
   div2.querySelector('strong').innerHTML = 'Супер!';
   // вставим её после текущего сообщения
-  div.parentNode.insertBefore( div2, div.nextSibling );
+  div.parentNode.insertBefore(div2, div.nextSibling);
 */!*
-
 </script>
 ```
 
 Обратите внимание на последнюю строку, которая вставляет `div2` после `div`:
 
 ```js
-div.parentNode.insertBefore( div2, div.nextSibling );
+div.parentNode.insertBefore(div2, div.nextSibling);
 ```
 
 <ol>
@@ -284,6 +283,7 @@ div.parentNode.insertBefore( div2, div.nextSibling );
 ```html
 <!--+ run -->
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.css">
+
 <body>
   <h3>Сообщение пропадёт через секунду</h3>
 </body>
@@ -321,12 +321,12 @@ div.parentNode.insertBefore( div2, div.nextSibling );
   var div = document.createElement('div');
   div.className = "alert alert-success";
   document.body.appendChild(div);
-  
+
 *!*
   var text = prompt("Введите текст для сообщения", "Жили были <a> и <b>!");
 
   // вставится именно как текст, без HTML-обработки
-  div.appendChild( document.createTextNode(text) );
+  div.appendChild(document.createTextNode(text));
 */!*
 </script>
 ```
diff --git a/2-ui/1-document/12-multi-insert/article.md b/2-ui/1-document/12-multi-insert/article.md
index 53acc250..74e54233 100644
--- a/2-ui/1-document/12-multi-insert/article.md
+++ b/2-ui/1-document/12-multi-insert/article.md
@@ -14,13 +14,14 @@
 ```js
 var ul = document.createElement('ul');
 document.body.appendChild(ul); // сначала в документ
-for(...) ul.appendChild(li);   // потом узлы
+for (...) ul.appendChild(li); // потом узлы
 ```
 
 </li>
 <li>Полностью создать список "вне DOM", а потом -- вставить в документ:
 
 ```js
+//+ no-beautify
 var ul = document.createElement('ul');
 for(...) ul.appendChild(li);   // сначала вставить узлы
 document.body.appendChild(ul); // затем в документ
@@ -115,14 +116,14 @@ elem.insertAdjacentHTML(where, html);
 </ul>
 
 <script>
-var ul = document.body.children[0];
-var li5 = ul.children[2];
+  var ul = document.body.children[0];
+  var li5 = ul.children[2];
 
-li5.insertAdjacentHTML("beforeBegin", "<li>3</li><li>4</li>");
+  li5.insertAdjacentHTML("beforeBegin", "<li>3</li><li>4</li>");
 </script>
 ```
 
-Единственный недостаток этого метода -- он не работает в Firefox до версии 8. Но его можно легко добавить, используя [полифилл insertAdjacentHTML для Firefox](insertAdjacentHTML.js).
+Единственный недостаток этого метода -- он не работает в Firefox до версии 8. Но его можно легко добавить, используя [полифилл insertAdjacentHTML для Firefox](insertAdjacentFF.js).
 
 У этого метода есть "близнецы-братья", которые поддерживаются везде, кроме Firefox, но в него они добавляются тем же полифиллом:
 
@@ -181,7 +182,7 @@ for (цикл по li) {
   fragment.appendChild(list[i]); // вставить каждый LI в DocumentFragment 
 }
 
-ul.appendChild(fragment);   // вместо фрагмента вставятся элементы списка
+ul.appendChild(fragment); // вместо фрагмента вставятся элементы списка
 ```
 
 В современных браузерах эффект от такой оптимизации может быть различным, а на небольших документах иногда и отрицательным. 
@@ -211,28 +212,30 @@ ul.appendChild(fragment);   // вместо фрагмента вставятс
 ```html
 <!--+ run autorun height=80 -->
 <html>
+
 <head>
   <meta charset="utf-8">
   <script src="https://cdn.polyfill.io/v1/polyfill.js?features=Element.prototype.mutation"></script>
 </head>
 
 <body>
-<script>
-  // добавим элемент в конец <body>
-  var p = document.createElement('p');
-  document.body.append(p);
+  <script>
+    // добавим элемент в конец <body>
+    var p = document.createElement('p');
+    document.body.append(p);
 
-  var em = document.createElement('em');
-  em.append('Мир!');
+    var em = document.createElement('em');
+    em.append('Мир!');
 
-  // вставить в параграф текстовый и обычный узлы
-  p.append("Привет, ", em);
+    // вставить в параграф текстовый и обычный узлы
+    p.append("Привет, ", em);
 
-  // добавить элемент после <p>
-  p.after(document.createElement('hr'))
-</script>
+    // добавить элемент после <p>
+    p.after(document.createElement('hr'))
+  </script>
 
 </body>
+
 </html>
 ```
 
diff --git a/2-ui/1-document/13-document-write/article.md b/2-ui/1-document/13-document-write/article.md
index 4fe6b849..49f2e34e 100644
--- a/2-ui/1-document/13-document-write/article.md
+++ b/2-ui/1-document/13-document-write/article.md
@@ -13,11 +13,11 @@ HTML-документ ниже будет содержать `1 2 3`.
 ```html
 <!--+ run -->
 <body>
-1
-<script>
-  document.write(2);
-</script>
-3
+  1
+  <script>
+    document.write(2);
+  </script>
+  3
 </body>
 ```
 
@@ -29,14 +29,18 @@ HTML-документ ниже будет содержать `1 2 3`.
 
 ```html
 <!--+ run -->
-<script> 
+<script>
   document.write('<style> td { color: #F40 } </style>');
- </script>
+</script>
 <table>
   <tr>
-  <script> document.write('<td>') </script>
+    <script>
+      document.write('<td>')
+    </script>
     Текст внутри TD.
-  <script> document.write('</td>') </script>
+    <script>
+      document.write('</td>')
+    </script>
   </tr>
 </table>
 ```
@@ -93,7 +97,7 @@ HTML-документ ниже будет содержать `1 2 3`.
   var url = 'http://ads.com/buyme?screen=' + screen.width + "x" + screen.height;
 
   // загрузить такой скрипт прямо сейчас
-  document.write('<script src="'+url+'"></scr'+'ipt>');
+  document.write('<script src="' + url + '"></scr' + 'ipt>');
 </script>
 ```
 
@@ -103,7 +107,7 @@ HTML-документ ниже будет содержать `1 2 3`.
 Также используют запись:
 
 ```js
-document.write('<script src="'+url+'"><\/script>');
+document.write('<script src="' + url + '"><\/script>');
 ```
 
 Здесь `<\/script>` вместо `</script>`: обратный слеш `\` обычно используется для вставки спецсимволов типа `\n`, а если такого спецсимвола нет, в данном случае `\/` не является спецсимволом, то будет проигнорирован. Так что получается такой альтернативный способ безопасно вставить строку `</script>`. 
diff --git a/2-ui/1-document/14-styles-and-classes/2-create-notification/task.md b/2-ui/1-document/14-styles-and-classes/2-create-notification/task.md
index aab40b32..bc89ddcc 100644
--- a/2-ui/1-document/14-styles-and-classes/2-create-notification/task.md
+++ b/2-ui/1-document/14-styles-and-classes/2-create-notification/task.md
@@ -16,7 +16,7 @@
  * @param options.className {string} CSS-класс 
  * @param options.html {string} HTML-текст для показа
  */
-function showNotification(options) { 
+function showNotification(options) {
   // ваш код
 }
 ```
diff --git a/2-ui/1-document/14-styles-and-classes/article.md b/2-ui/1-document/14-styles-and-classes/article.md
index 5659f895..fb7ce900 100644
--- a/2-ui/1-document/14-styles-and-classes/article.md
+++ b/2-ui/1-document/14-styles-and-classes/article.md
@@ -21,6 +21,7 @@
 **Для свойств, названия которых состоят из нескольких слов, используется вотТакаяЗапись:**
 
 ```js
+//+ no-beautify
 background-color  => elem.style.backgroundColor
 z-index           => elem.style.zIndex
 border-left-width => elem.style.borderLeftWidth
@@ -73,15 +74,15 @@ setTimeout(function() {
 ```html
 <!--+ run height=100 -->
 <body>
-  <script> 
+  <script>
 *!*
     document.body.style.margin = '20px';
-    alert(document.body.style.marginTop); // 20px! 
+    alert( document.body.style.marginTop ); // 20px! 
 */!*
 
 *!*
     document.body.style.color = '#abc';
-    alert(document.body.style.color); // rgb(170, 187, 204) 
+    alert( document.body.style.color ); // rgb(170, 187, 204) 
 */!*
   </script>
 </body>
@@ -146,7 +147,7 @@ setTimeout(function() {
 Вот так `style` уже ничего не увидит:
 
 ```html
-<!--+ run height=100 -->
+<!--+ run height=100  no-beautify -->
 <head>
   <style> body { color: red; margin: 5px } </style>
 </head>
@@ -190,14 +191,17 @@ getComputedStyle(element[, pseudo])
 ```html
 <!--+ run height=100 -->
 <style>
-  body { margin: 10px }
+  body {
+    margin: 10px
+  }
 </style>
+
 <body>
 
-  <script> 
+  <script>
     var computedStyle = getComputedStyle(document.body);
-    alert(computedStyle.marginTop);  // выведет отступ в пикселях
-    alert(computedStyle.color);  // выведет цвет 
+    alert( computedStyle.marginTop ); // выведет отступ в пикселях
+    alert( computedStyle.color ); // выведет цвет
   </script>
 
 </body>
@@ -264,10 +268,13 @@ function getStyle(elem) {
 ```html
 <!--+ run height=100 -->
 <style>
-  body { margin: 10% }
+  body {
+    margin: 10%
+  }
 </style>
+
 <body>
-  <script> 
+  <script>
     var elem = document.body;
 
     function getStyle(elem) {
@@ -275,7 +282,7 @@ function getStyle(elem) {
     }
 
     var marginTop = getStyle(elem).marginTop;
-    alert(marginTop); // IE8-: 10%, иначе пиксели
+    alert( marginTop ); // IE8-: 10%, иначе пиксели
   </script>
 </body>
 ```
diff --git a/2-ui/1-document/15-metrics/2-scrollbar-width/solution.md b/2-ui/1-document/15-metrics/2-scrollbar-width/solution.md
index 4dda1121..9f376da1 100644
--- a/2-ui/1-document/15-metrics/2-scrollbar-width/solution.md
+++ b/2-ui/1-document/15-metrics/2-scrollbar-width/solution.md
@@ -4,9 +4,9 @@
 //+ run
 // создадим элемент с прокруткой
 var div = document.createElement('div');
-      
+
 div.style.overflowY = 'scroll';
-div.style.width =  '50px';
+div.style.width = '50px';
 div.style.height = '50px';
 
 // при display:none размеры нельзя узнать
diff --git a/2-ui/1-document/15-metrics/3-div-placeholder/solution.md b/2-ui/1-document/15-metrics/3-div-placeholder/solution.md
index 13b7d7e5..dd09226b 100644
--- a/2-ui/1-document/15-metrics/3-div-placeholder/solution.md
+++ b/2-ui/1-document/15-metrics/3-div-placeholder/solution.md
@@ -20,9 +20,9 @@ placeHolder.style.height = div.offsetHeight + 'px';
 // можно и width, но в этом примере это не обязательно
 
 // IE || другой браузер
-var computedStyle = div.currentStyle ||  getComputedStyle(div, '');
+var computedStyle = div.currentStyle || getComputedStyle(div, '');
 
-placeHolder.style.marginTop = computedStyle.marginTop;          // (1)
+placeHolder.style.marginTop = computedStyle.marginTop; // (1)
 placeHolder.style.marginBottom = computedStyle.marginBottom;
 ```
 
diff --git a/2-ui/1-document/15-metrics/3-div-placeholder/task.md b/2-ui/1-document/15-metrics/3-div-placeholder/task.md
index 130cdb84..3fa0528f 100644
--- a/2-ui/1-document/15-metrics/3-div-placeholder/task.md
+++ b/2-ui/1-document/15-metrics/3-div-placeholder/task.md
@@ -5,7 +5,7 @@
 Посмотрим следующий случай из жизни. Был текст, который, в частности, содержал `div` с зелеными границами:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <style> 
   #moving-div { 
     border: 5px groove green; 
diff --git a/2-ui/1-document/15-metrics/4-put-ball-in-center/solution.md b/2-ui/1-document/15-metrics/4-put-ball-in-center/solution.md
index fefe340d..0f445407 100644
--- a/2-ui/1-document/15-metrics/4-put-ball-in-center/solution.md
+++ b/2-ui/1-document/15-metrics/4-put-ball-in-center/solution.md
@@ -12,8 +12,8 @@
 var ball = document.getElementById('ball');
 var field = document.getElementById('field');
 
-ball.style.left = Math.round(field.clientWidth / 2)+'px';
-ball.style.top = Math.round(field.clientHeight / 2)+'px';
+ball.style.left = Math.round(field.clientWidth / 2) + 'px';
+ball.style.top = Math.round(field.clientHeight / 2) + 'px';
 ```
 
 [iframe hide="Нажмите, чтобы посмотреть текущий результат" height=180 src="ball-half"]
@@ -24,8 +24,8 @@ ball.style.top = Math.round(field.clientHeight / 2)+'px';
 var ball = document.getElementById('ball');
 var field = document.getElementById('field');
 
-ball.style.left = Math.round(field.clientWidth/2 - ball.offsetWidth/2)+'px';
-ball.style.top = Math.round(field.clientHeight/2 - ball.offsetHeight/2)+'px';
+ball.style.left = Math.round(field.clientWidth / 2 - ball.offsetWidth / 2) + 'px';
+ball.style.top = Math.round(field.clientHeight / 2 - ball.offsetHeight / 2) + 'px';
 ```
 
 **Внимание, подводный камень!**
diff --git a/2-ui/1-document/15-metrics/article.md b/2-ui/1-document/15-metrics/article.md
index 95b74a7f..0a26e051 100644
--- a/2-ui/1-document/15-metrics/article.md
+++ b/2-ui/1-document/15-metrics/article.md
@@ -11,6 +11,7 @@
 Мы будем использовать для примера вот такой элемент, у которого есть рамка (border), поля (padding), и прокрутка:
 
 ```html
+<!--+ no-beautify -->
 <div id="example">
   ...Текст...
 </div>
@@ -125,7 +126,7 @@
 **Это дает нам замечательный способ для проверки, виден ли элемент**:
 
 ```js
-function isHidden(elem)
+function isHidden(elem) {
   return !elem.offsetWidth && !elem.offsetHeight;
 }
 ```
@@ -265,7 +266,7 @@ alert( getComputedStyle(elem).width ); // вывести CSS-ширину для
 
 <script>
 *!*
-  alert( getComputedStyle(elem).width );  // auto
+  alert( getComputedStyle(elem).width ); // auto
 */!*
 </script>
 ```
diff --git a/2-ui/1-document/16-metrics-window/article.md b/2-ui/1-document/16-metrics-window/article.md
index af8c235c..e80e051e 100644
--- a/2-ui/1-document/16-metrics-window/article.md
+++ b/2-ui/1-document/16-metrics-window/article.md
@@ -57,7 +57,7 @@ var scrollHeight = Math.max(
   document.body.clientHeight, document.documentElement.clientHeight
 );
 
-alert('Высота с учетом прокрутки: ' + scrollHeight);
+alert( 'Высота с учетом прокрутки: ' + scrollHeight );
 ```
 
 Почему так? Лучше и не спрашивайте, это одно из редких мест, где просто ошибки в браузерах. Глубокой логики здесь нет.
@@ -74,8 +74,8 @@ alert('Высота с учетом прокрутки: ' + scrollHeight);
 
 ```js
 //+ run
-alert('Текущая прокрутка сверху: ' + window.pageYOffset);
-alert('Текущая прокрутка слева: ' + window.pageXOffset);
+alert( 'Текущая прокрутка сверху: ' + window.pageYOffset );
+alert( 'Текущая прокрутка слева: ' + window.pageXOffset );
 ```
 
 Эти свойства:
@@ -92,7 +92,7 @@ alert('Текущая прокрутка слева: ' + window.pageXOffset);
 //+ run
 var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
 
-alert("Текущая прокрутка: " + scrollTop);
+alert( "Текущая прокрутка: " + scrollTop );
 ```
 
 ## Изменение прокрутки: scrollTo, scrollBy, scrollIntoView [#window-scroll]
@@ -199,7 +199,7 @@ var body = document.body;
 var scrollTop = html.scrollTop || body && body.scrollTop || 0;
 scrollTop -= html.clientTop; // в IE7- <html> смещён относительно (0,0)
 
-alert("Текущая прокрутка: " + scrollTop);
+alert( "Текущая прокрутка: " + scrollTop );
 ```
 
 </li>
diff --git a/2-ui/1-document/17-coordinates/1-find-point-coordinates/solution.md b/2-ui/1-document/17-coordinates/1-find-point-coordinates/solution.md
index ceae552e..1d911709 100644
--- a/2-ui/1-document/17-coordinates/1-find-point-coordinates/solution.md
+++ b/2-ui/1-document/17-coordinates/1-find-point-coordinates/solution.md
@@ -25,8 +25,8 @@ var coords3 = [coords.left + field.clientLeft, coords.top + field.clientTop];
 
 ```js
 var coords4 = [
-  coords.right - parseInt(getComputedStyle(field).borderRightWidth) ,
-  coords.bottom - parseInt(getComputedStyle(field).borderBottomWidth) 
+  coords.right - parseInt(getComputedStyle(field).borderRightWidth),
+  coords.bottom - parseInt(getComputedStyle(field).borderBottomWidth)
 ]
 ```
 
@@ -34,7 +34,7 @@ var coords4 = [
 
 ```js
 var coords4 = [
-  coords.left + elem.clientLeft + elem.clientWidth ,
+  coords.left + elem.clientLeft + elem.clientWidth,
   coords.top + elem.clientTop + elem.clientHeight
 ]
 ```
diff --git a/2-ui/1-document/18-coordinates-document/article.md b/2-ui/1-document/18-coordinates-document/article.md
index d3dfa669..eb3831d3 100644
--- a/2-ui/1-document/18-coordinates-document/article.md
+++ b/2-ui/1-document/18-coordinates-document/article.md
@@ -46,9 +46,9 @@
 Результат `getCoords`: объект с координатами `{left: .., top: ..}`
 
 ```js
-function getCoords(elem) {  // кроме IE8-
+function getCoords(elem) { // кроме IE8-
   var box = elem.getBoundingClientRect();
-  
+
   return {
     top: box.top + pageYOffset,
     left: box.left + pageXOffset
@@ -64,23 +64,26 @@ function getCoords(elem) {  // кроме IE8-
 function getCoords(elem) {
   // (1)
   var box = elem.getBoundingClientRect();
-  
+
   var body = document.body;
   var docEl = document.documentElement;
-  
+
   // (2)
   var scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
   var scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;
-  
+
   // (3)
   var clientTop = docEl.clientTop || body.clientTop || 0;
   var clientLeft = docEl.clientLeft || body.clientLeft || 0;
-  
+
   // (4)
-  var top  = box.top +  scrollTop - clientTop;
+  var top = box.top + scrollTop - clientTop;
   var left = box.left + scrollLeft - clientLeft;
-  
-  return { top: top, left: left };
+
+  return {
+    top: top,
+    left: left
+  };
 }
 ```
 
@@ -104,15 +107,19 @@ function getCoords(elem) {
 ```js
 //+ autorun
 function getOffsetSum(elem) {
-  var top = 0, left = 0;
+  var top = 0,
+    left = 0;
 
-  while(elem) {
+  while (elem) {
     top = top + parseInt(elem.offsetTop);
     left = left + parseInt(elem.offsetLeft);
-    elem = elem.offsetParent;     
+    elem = elem.offsetParent;
   }
-   
-  return {top: top, left: left};
+
+  return {
+    top: top,
+    left: left
+  };
 }
 ```
 
@@ -183,10 +190,10 @@ document.getElementById('getBoundingClientRectEx').onclick = function(event) {
 ```js
 //+ run
 // общая ширина/высота
-alert( screen.width + ' x ' + screen.height ); 
+alert( screen.width + ' x ' + screen.height );
 
 // доступная ширина/высота (за вычетом таскбара и т.п.)
-alert( screen.availWidth + ' x ' + screen.availHeight); 
+alert( screen.availWidth + ' x ' + screen.availHeight );
 
 // есть и ряд других свойств screen (см. документацию)
 ```
@@ -196,7 +203,7 @@ alert( screen.availWidth + ' x ' + screen.availHeight);
 
 ```js
 //+ run
-alert("Браузер находится на " + window.screenX + "," + window.screenY);
+alert( "Браузер находится на " + window.screenX + "," + window.screenY );
 ```
 
 Они могут быть и меньше нуля, если окно частично вне экрана. </li>
diff --git a/2-ui/1-document/2-dom-nodes/1-body-from-head/solution.md b/2-ui/1-document/2-dom-nodes/1-body-from-head/solution.md
index 4fd0177f..399d66bc 100644
--- a/2-ui/1-document/2-dom-nodes/1-body-from-head/solution.md
+++ b/2-ui/1-document/2-dom-nodes/1-body-from-head/solution.md
@@ -5,14 +5,17 @@
 ```html
 <!--+ run -->
 <html>
+
 <head>
   <script>
-    alert(document.body); // null
+    alert( document.body ); // null
   </script>
 </head>
+
 <body>
   Привет, мир!
 </body>
+
 </html>
 ```
 
diff --git a/2-ui/1-document/2-dom-nodes/1-body-from-head/task.md b/2-ui/1-document/2-dom-nodes/1-body-from-head/task.md
index 9303132d..ef89617c 100644
--- a/2-ui/1-document/2-dom-nodes/1-body-from-head/task.md
+++ b/2-ui/1-document/2-dom-nodes/1-body-from-head/task.md
@@ -6,16 +6,19 @@
 
 ```html
 <html>
+
 <head>
 *!*
   <script>
-    alert(document.body); // ?
+    alert( document.body ); // ?
   </script>
 */!*
 </head>
+
 <body>
   Привет, мир!
 </body>
+
 </html>
 ```
 
diff --git a/2-ui/1-document/2-dom-nodes/article.md b/2-ui/1-document/2-dom-nodes/article.md
index ac1139bf..aed95c16 100644
--- a/2-ui/1-document/2-dom-nodes/article.md
+++ b/2-ui/1-document/2-dom-nodes/article.md
@@ -13,15 +13,15 @@ DOM -- это представление документа в виде дере
 Построим, для начала, дерево DOM для следующего документа.
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <!DOCTYPE HTML>
 <html>
-  <head>
-    <title>О лосях</title>
-  </head>
-  <body>
-     Правда о лосях
-   </body>
+<head>
+  <title>О лосях</title>
+</head>
+<body>
+  Правда о лосях
+</body>
 </html>
 ```
 
@@ -60,6 +60,7 @@ drawHtmlTree(node, 'div.domtree', 690, 350);
 В остальных случаях всё честно -- если пробелы есть в документе, то они есть и в DOM, а если их убрать, то и в DOM их не будет, получится так:
 
 ```html
+<!--+ no-beautify -->
 <!DOCTYPE HTML>
 <html><head><title>О лосях</title></head><body>Правда о лосях</body></html>
 ```
@@ -86,6 +87,7 @@ drawHtmlTree(node, 'div.domtree', 690, 300);
 Такой документ:
 
 ```html
+<!--+ no-beautify -->
 <p>Привет
 <li>Мама
 <li>и
@@ -98,7 +100,7 @@ drawHtmlTree(node, 'div.domtree', 690, 300);
 <script>
 var node = {"name":"HTML","nodeType":1,"children":[{"name":"HEAD","nodeType":1,"children":[]},{"name":"BODY","nodeType":1,"children":[{"name":"P","nodeType":1,"children":[{"name":"#text","nodeType":3,"content":"Привет\n"}]},{"name":"LI","nodeType":1,"children":[{"name":"#text","nodeType":3,"content":"Мама\n"}]},{"name":"LI","nodeType":1,"children":[{"name":"#text","nodeType":3,"content":"и\n"}]},{"name":"LI","nodeType":1,"children":[{"name":"#text","nodeType":3,"content":"Папа\n"}]}]}]}
 
-drawHtmlTree(node,  [].pop.call(document.querySelectorAll('div.domtree')), 690, 400);
+drawHtmlTree(node, 'div.domtree', 690, 400);
 </script>
 
 [warn header="Таблицы всегда содержат `<tbody>`"]
@@ -107,6 +109,7 @@ drawHtmlTree(node,  [].pop.call(document.querySelectorAll('div.domtree')), 690,
 Например, для такого HTML:
 
 ```html
+<!--+ no-beautify -->
 <table id="table">
   <tr><td>1</td></tr>
 </table>
@@ -123,6 +126,7 @@ drawHtmlTree(node,  'div.domtree', 600, 200);
 Вы видите? Появился `<tbody>`, как будто документ был таким:
 
 ```html
+<!--+ no-beautify -->
 <table>
 *!*
   <tbody>
@@ -145,16 +149,18 @@ drawHtmlTree(node,  'div.domtree', 600, 200);
 ```html
 <!DOCTYPE HTML>
 <html>
-  <body>
-    Правда о лосях
-    <ol>
-      <li>Лось — животное хитрое</li>
+
+<body>
+  Правда о лосях
+  <ol>
+    <li>Лось — животное хитрое</li>
 *!*
-      <!-- комментарий -->
+    <!-- комментарий -->
 */!*
-      <li>...и коварное!</li>
-    </ol>
-  </body>
+    <li>...и коварное!</li>
+  </ol>
+</body>
+
 </html>
 ```
 
@@ -198,10 +204,10 @@ drawHtmlTree(node, 'div.domtree', 690, 550);
 ```js
 //+ run
 document.body.style.backgroundColor = 'red';
-alert('Поменяли цвет BODY');
+alert( 'Поменяли цвет BODY' );
 
 document.body.style.backgroundColor = '';
-alert('Сбросили цвет BODY');
+alert( 'Сбросили цвет BODY' );
 ```
 
 DOM предоставляет возможность делать со страницей всё, что угодно.
@@ -216,6 +222,7 @@ IE8- не генерирует текстовые узлы, если они со
  То есть, такие два документа дадут идентичный DOM:
 
 ```html
+<!--+ no-beautify -->
 <!DOCTYPE HTML>
 <html><head><title>О лосях</title></head><body>Правда о лосях</body></html>
 ```
@@ -225,12 +232,15 @@ IE8- не генерирует текстовые узлы, если они со
 ```html
 <!DOCTYPE HTML>
 <html>
-  <head>
-    <title>О лосях</title>
-  </head>
-  <body>
-    Правда о лосях
-  </body>
+
+<head>
+  <title>О лосях</title>
+</head>
+
+<body>
+  Правда о лосях
+</body>
+
 </html>
 ```
 
diff --git a/2-ui/1-document/4-traversing-dom/1-dom-children/task.md b/2-ui/1-document/4-traversing-dom/1-dom-children/task.md
index 9815461c..a0bfb3ca 100644
--- a/2-ui/1-document/4-traversing-dom/1-dom-children/task.md
+++ b/2-ui/1-document/4-traversing-dom/1-dom-children/task.md
@@ -7,21 +7,26 @@
 ```html
 <!DOCTYPE HTML>
 <html>
-  <head><meta charset="utf-8"></head>
-  <body>
-    <div>Пользователи:</div>
-    <ul>
-      <li>Маша</li>
-      <li>Вовочка</li>
-    </ul>
 
-    <!-- комментарий -->
+<head>
+  <meta charset="utf-8">
+</head>
 
-    <script>
-      // ... ваш код
-    </script>
+<body>
+  <div>Пользователи:</div>
+  <ul>
+    <li>Маша</li>
+    <li>Вовочка</li>
+  </ul>
+
+  <!-- комментарий -->
+
+  <script>
+    // ... ваш код
+  </script>
+
+</body>
 
-  </body>
 </html>
 ```
 
diff --git a/2-ui/1-document/4-traversing-dom/2-has-childnodes/solution.md b/2-ui/1-document/4-traversing-dom/2-has-childnodes/solution.md
index 5fec11ea..07ee2da5 100644
--- a/2-ui/1-document/4-traversing-dom/2-has-childnodes/solution.md
+++ b/2-ui/1-document/4-traversing-dom/2-has-childnodes/solution.md
@@ -1,12 +1,14 @@
 Вначале нерабочие способы, которые могут прийти на ум:
 
 ```js
+//+ no-beautify
 if (!elem) { .. }
 ```
 
 Это не работает, так как `elem` всегда есть, и является объектом. Так что проверка `if (elem)` всегда верна, вне зависимости от того, есть ли у `elem` потомки.
 
 ```js
+//+ no-beautify
 if (!elem.childNodes) { ... }
 ```
 
@@ -15,6 +17,7 @@ if (!elem.childNodes) { ... }
 Несколько рабочих способов:
 
 ```js
+//+ no-beautify
 if (!elem.childNodes.length) { ... }
 
 if (!elem.firstChild) { ... }
diff --git a/2-ui/1-document/4-traversing-dom/2-has-childnodes/task.md b/2-ui/1-document/4-traversing-dom/2-has-childnodes/task.md
index d7aa46f6..7532f1fc 100644
--- a/2-ui/1-document/4-traversing-dom/2-has-childnodes/task.md
+++ b/2-ui/1-document/4-traversing-dom/2-has-childnodes/task.md
@@ -7,6 +7,7 @@
 "Пустой" -- значит нет дочерних узлов, даже текстовых.
 
 ```js
+//+ no-beautify
 if (/*...ваш код проверки elem... */) { узел elem пуст }
 ```
 
diff --git a/2-ui/1-document/4-traversing-dom/article.md b/2-ui/1-document/4-traversing-dom/article.md
index 70734b0a..34d3c627 100644
--- a/2-ui/1-document/4-traversing-dom/article.md
+++ b/2-ui/1-document/4-traversing-dom/article.md
@@ -36,20 +36,23 @@ DOM позволяет делать что угодно с HTML-элементо
 <!--+ run -->
 <!DOCTYPE HTML>
 <html>
-  <head>
-    <script>
-*!*
-      alert("Из HEAD: " + document.body); // null, body ещё нет
-*/!*
-    </script>
-  </head>
-  <body>
-  
-    <script>
-      alert("Из BODY: " + document.body); // body есть
-    </script>
 
-  </body>
+<head>
+  <script>
+*!*
+    alert( "Из HEAD: " + document.body ); // null, body ещё нет
+*/!*
+  </script>
+</head>
+
+<body>
+
+  <script>
+    alert( "Из BODY: " + document.body ); // body есть
+  </script>
+
+</body>
+
 </html>
 ```
 [/warn]
@@ -76,6 +79,7 @@ DOM позволяет делать что угодно с HTML-элементо
 <!--+ run -->
 <!DOCTYPE HTML>
 <html>
+
 <body>
   <div>Начало</div>
 
@@ -87,13 +91,14 @@ DOM позволяет делать что угодно с HTML-элементо
 
   <script>
 *!* 
-    for(var i=0; i<document.body.childNodes.length; i++) {
+    for (var i = 0; i < document.body.childNodes.length; i++) {
       alert( document.body.childNodes[i] ); // Text, DIV, Text, UL, ..., SCRIPT
     }
 */!*
   </script>
   ...
 </body>
+
 </html>
 ```
 
@@ -146,9 +151,9 @@ elems.forEach(function(elem) { // нет такого метода!
 var elems = document.documentElement.childNodes;
 
 *!*
-[].forEach.call(elems, function(elem) { 
+[].forEach.call(elems, function(elem) {
 */!*
-  alert(elem);  // HEAD, текст, BODY
+  alert( elem ); // HEAD, текст, BODY
 });
 ```
 
@@ -166,8 +171,8 @@ var elems = document.documentElement.childNodes;
 elems = Array.prototype.slice.call(elems); // теперь elems - массив
 */!*
 
-elems.forEach(function(elem) { 
-  alert(elem.tagName);  // HEAD, текст, BODY
+elems.forEach(function(elem) {
+  alert( elem.tagName ); // HEAD, текст, BODY
 });
 ```
 
@@ -188,8 +193,8 @@ elems.forEach(function(elem) {
 //+ run
 var elems = document.documentElement.childNodes;
 
-for(var key in elems) {
-  alert(key); // 0, 1, 2, length, item
+for (var key in elems) {
+  alert( key ); // 0, 1, 2, length, item
 }
 ```
 
@@ -242,6 +247,7 @@ for(var key in elems) {
 <!--+ run -->
 <!DOCTYPE HTML>
 <html>
+
 <body>
   <div>Начало</div>
 
@@ -253,13 +259,14 @@ for(var key in elems) {
 
   <script>
 *!* 
-    for(var i=0; i<document.body.children.length; i++) {
+    for (var i = 0; i < document.body.children.length; i++) {
       alert( document.body.children[i] ); // DIV, UL, DIV, SCRIPT
     }
 */!*
   </script>
   ...
 </body>
+
 </html>
 ```
 
@@ -267,7 +274,7 @@ for(var key in elems) {
 
 ```js
 elem.firstElementChild === elem.children[0]
-elem.lastElementChild === body.children[body.children.length-1]
+elem.lastElementChild === body.children[body.children.length - 1]
 ```
 
 
diff --git a/2-ui/1-document/5-searching-elements-dom/2-tree/solution.md b/2-ui/1-document/5-searching-elements-dom/2-tree/solution.md
index 4c8a70d8..55b45737 100644
--- a/2-ui/1-document/5-searching-elements-dom/2-tree/solution.md
+++ b/2-ui/1-document/5-searching-elements-dom/2-tree/solution.md
@@ -3,7 +3,7 @@
 ```js
 var lis = document.getElementsByTagName('li');
 
-for(i=0; i<lis.length; i++) {
+for (i = 0; i < lis.length; i++) {
   ...
 }
 ```
diff --git a/2-ui/1-document/5-searching-elements-dom/article.md b/2-ui/1-document/5-searching-elements-dom/article.md
index b4dbc2c1..ebeb4ccd 100644
--- a/2-ui/1-document/5-searching-elements-dom/article.md
+++ b/2-ui/1-document/5-searching-elements-dom/article.md
@@ -102,17 +102,15 @@ var elements = document.getElementsByTagName('div');
 </table>
 
 <script>
-
 *!*
   var tableElem = document.getElementById('age-table');
   var elements = tableElem.getElementsByTagName('input');
 */!*
 
-  for (var i=0; i<elements.length; i++) {
-    var input = elements[i];  
-    alert(input.value + ': ' + input.checked);
+  for (var i = 0; i < elements.length; i++) {
+    var input = elements[i];
+    alert( input.value + ': ' + input.checked );
   }
-
 </script>
 ```
 
@@ -181,8 +179,8 @@ var elems = document.getElementsByName('age');
 <div class="long article">Длинная статья</div>
 
 <script>
-var articles = document.getElementsByClassName('article');
-alert( articles.length ); // 2, найдёт оба элемента 
+  var articles = document.getElementsByClassName('article');
+  alert( articles.length ); // 2, найдёт оба элемента
 </script>
 ```
 
@@ -214,8 +212,8 @@ alert( articles.length ); // 2, найдёт оба элемента
   var elements = document.querySelectorAll('ul > li:last-child');
 */!*
 
-  for (var i=0; i<elements.length; i++) {
-    alert(elements[i].innerHTML ); // "тест", "пройден"
+  for (var i = 0; i < elements.length; i++) {
+    alert( elements[i].innerHTML ); // "тест", "пройден"
   }
 </script>
 ```
@@ -248,11 +246,11 @@ alert( articles.length ); // 2, найдёт оба элемента
 <script>
   var elems = document.body.children;
 
-  for(var i=0; i<elems.length; i++) {
+  for (var i = 0; i < elems.length; i++) {
 *!*
-    if ( elems[i].matches('a[href$="zip"]') ) {
+    if (elems[i].matches('a[href$="zip"]')) {
 */!*
-      alert("Ссылка на архив: " + elems[i].href);
+      alert( "Ссылка на архив: " + elems[i].href );
     }
   }
 </script>
@@ -284,14 +282,14 @@ alert( articles.length ); // 2, найдёт оба элемента
   var numberSpan = document.querySelector('.num');
 
   // ближайший элемент сверху подходящий под селектор li
-  alert( numberSpan.closest('li').className ) // subchapter
-  
+  alert(numberSpan.closest('li').className) // subchapter
+
   // ближайший элемент сверху подходящий под селектор .chapter
-  alert( numberSpan.closest('.chapter').tagName ) // LI
+  alert(numberSpan.closest('.chapter').tagName) // LI
 
   // ближайший элемент сверху, подходящий под селектор span
   // это сам numberSpan, так как поиск включает в себя сам элемент
-  alert( numberSpan.closest('span') === numberSpan ) // true
+  alert(numberSpan.closest('span') === numberSpan) // true
 </script>
 ```
 
@@ -306,11 +304,12 @@ alert( articles.length ); // 2, найдёт оба элемента
 Найдем заголовки с текстом `XPath` в текущем документе:
 
 ```js
-//+ run
-var result = document.evaluate("//h2[contains(., 'XPath')]", document.documentElement, null,                  XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
+//+ run no-beautify
+var result = document.evaluate("//h2[contains(., 'XPath')]", document.documentElement, null, 
+  XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
 
-for (var i=0; i<result.snapshotLength; i++) {
-    alert(result.snapshotItem(i).outerHTML);
+for (var i = 0; i < result.snapshotLength; i++) {
+  alert( result.snapshotItem(i).outerHTML );
 }
 ```
 
diff --git a/2-ui/1-document/6-searching-elements-internals/1-collection-length-after-remove/solution.md b/2-ui/1-document/6-searching-elements-internals/1-collection-length-after-remove/solution.md
index 730cb5d7..90507daa 100644
--- a/2-ui/1-document/6-searching-elements-internals/1-collection-length-after-remove/solution.md
+++ b/2-ui/1-document/6-searching-elements-internals/1-collection-length-after-remove/solution.md
@@ -13,8 +13,8 @@
   var lis = document.body.getElementsByTagName('li');
 
   document.body.innerHTML = "";
-  
-  alert(lis.length);
+
+  alert( lis.length );
 </script>
 ```
 
@@ -36,13 +36,12 @@
   <li>Магазин</li>
 </ul>
 <script>
-
   var menu = document.getElementById('menu');
   var lis = menu.getElementsByTagName('li');
 
   document.body.innerHTML = "";
 
-  alert(lis.length);
+  alert( lis.length );
 </script>
 ```
 
diff --git a/2-ui/1-document/6-searching-elements-internals/1-collection-length-after-remove/task.md b/2-ui/1-document/6-searching-elements-internals/1-collection-length-after-remove/task.md
index ff9eeb93..79d31016 100644
--- a/2-ui/1-document/6-searching-elements-internals/1-collection-length-after-remove/task.md
+++ b/2-ui/1-document/6-searching-elements-internals/1-collection-length-after-remove/task.md
@@ -19,7 +19,7 @@ var lis = document.body.getElementsByTagName('li');
 
 document.body.innerHTML = "";
 
-alert(lis.length);
+alert( lis.length );
 ```
 
 2. А такой код (вопрос посложнее)?
@@ -30,6 +30,6 @@ var lis = menu.getElementsByTagName('li');
 
 document.body.innerHTML = "";
 
-alert(lis.length);
+alert( lis.length );
 ```
 
diff --git a/2-ui/1-document/6-searching-elements-internals/2-compare-elements-count/task.md b/2-ui/1-document/6-searching-elements-internals/2-compare-elements-count/task.md
index fd311082..8076c8f9 100644
--- a/2-ui/1-document/6-searching-elements-internals/2-compare-elements-count/task.md
+++ b/2-ui/1-document/6-searching-elements-internals/2-compare-elements-count/task.md
@@ -5,7 +5,7 @@
 Для любого документа сделаем следующее:
 
 ```js
-var aList1 = document.getElementsByTagName('a'),
+var aList1 = document.getElementsByTagName('a');
 var aList2 = document.querySelectorAll('a');
 ```
 
diff --git a/2-ui/1-document/6-searching-elements-internals/3-benchmark-search-dom/solution.md b/2-ui/1-document/6-searching-elements-internals/3-benchmark-search-dom/solution.md
index b115b3c9..c4ca86c7 100644
--- a/2-ui/1-document/6-searching-elements-internals/3-benchmark-search-dom/solution.md
+++ b/2-ui/1-document/6-searching-elements-internals/3-benchmark-search-dom/solution.md
@@ -3,7 +3,7 @@
 ```js
 function bench(f, times) {
   var d = new Date();
-  for(var i=0; i<times; i++) f();
+  for (var i = 0; i < times; i++) f();
   return new Date() - d;
 }
 ```
diff --git a/2-ui/1-document/6-searching-elements-internals/article.md b/2-ui/1-document/6-searching-elements-internals/article.md
index 2b8275ff..bc5c7cfa 100644
--- a/2-ui/1-document/6-searching-elements-internals/article.md
+++ b/2-ui/1-document/6-searching-elements-internals/article.md
@@ -42,12 +42,12 @@
   var resultGet = document.getElementsByTagName('div');
   var resultQuery = document.querySelectorAll('div');
 
-  alert(resultQuery.length + ', ' + resultGet.length); // 1, 1 
+  alert( resultQuery.length + ', ' + resultGet.length ); // 1, 1 
 
   document.body.innerHTML = ''; // удалить всё содержимое BODY
 
 *!*
-  alert(resultQuery.length + ', ' + resultGet.length); // 1, 0
+  alert( resultQuery.length + ', ' + resultGet.length ); // 1, 0
 */!*
 </script>
 ```
@@ -142,22 +142,22 @@ alert( elems.length );
 ```html
 <!--+ run -->
 <script>
-  for(var i=0; i<10000;i++) document.write('<span> </span>');
+  for (var i = 0; i < 10000; i++) document.write('<span> </span>');
 
   var elements = document.body.getElementsByTagName('span');
   var len = elements.length;
 
   var d = new Date;
 *!*
-  for(var i = 0; i<len; i++) elements[i];
+  for (var i = 0; i < len; i++) elements[i];
 */!*
-  alert("Последовательно: "+ (new Date - d) + "мс");   // (1)
+  alert( "Последовательно: " + (new Date - d) + "мс" ); // (1)
 
   var d = new Date;
 *!*
-  for(var i = 0; i<len; i+=2) elements[i], elements[len-i-1];
+  for (var i = 0; i < len; i += 2) elements[i], elements[len - i - 1];
 */!*
-  alert("Вразнобой: "+ (new Date - d) + "мс");  // (2)
+  alert( "Вразнобой: " + (new Date - d) + "мс" ); // (2)
 </script>
 ```
 
diff --git a/2-ui/1-document/7-basic-dom-node-properties/1-console-firstchild-innerhtml/solution.md b/2-ui/1-document/7-basic-dom-node-properties/1-console-firstchild-innerhtml/solution.md
index 87aba7d3..0b7e7714 100644
--- a/2-ui/1-document/7-basic-dom-node-properties/1-console-firstchild-innerhtml/solution.md
+++ b/2-ui/1-document/7-basic-dom-node-properties/1-console-firstchild-innerhtml/solution.md
@@ -7,11 +7,11 @@
 ```html
 <!--+ run -->
 <body>
-<h1>Привет, мир!</h1>
+  <h1>Привет, мир!</h1>
 
-<script>
-alert( document.body.firstChild.innerHTML ); // undefined
-</script>
+  <script>
+    alert( document.body.firstChild.innerHTML ); // undefined
+  </script>
 </body>
 ```
 
diff --git a/2-ui/1-document/7-basic-dom-node-properties/2-lastchild-nodetype-inline/solution.md b/2-ui/1-document/7-basic-dom-node-properties/2-lastchild-nodetype-inline/solution.md
index 2a0e3976..0c8dc882 100644
--- a/2-ui/1-document/7-basic-dom-node-properties/2-lastchild-nodetype-inline/solution.md
+++ b/2-ui/1-document/7-basic-dom-node-properties/2-lastchild-nodetype-inline/solution.md
@@ -5,12 +5,14 @@
 ```html
 <!--+ run height=60 -->
 <!DOCTYPE HTML>
-<html>  
-<body>  
-   <script>
-      alert(document.body.lastChild.nodeType);
-   </script>
-</body>  
+<html>
+
+<body>
+  <script>
+    alert( document.body.lastChild.nodeType );
+  </script>
+</body>
+
 </html>
 ```
 
diff --git a/2-ui/1-document/7-basic-dom-node-properties/2-lastchild-nodetype-inline/task.md b/2-ui/1-document/7-basic-dom-node-properties/2-lastchild-nodetype-inline/task.md
index 481d07f0..279b0784 100644
--- a/2-ui/1-document/7-basic-dom-node-properties/2-lastchild-nodetype-inline/task.md
+++ b/2-ui/1-document/7-basic-dom-node-properties/2-lastchild-nodetype-inline/task.md
@@ -6,12 +6,14 @@
 
 ```html
 <!DOCTYPE HTML>
-<html>  
-<body>  
-   <script>
-      alert(document.body.lastChild.nodeType);
-   </script>
-</body>  
+<html>
+
+<body>
+  <script>
+    alert( document.body.lastChild.nodeType );
+  </script>
+</body>
+
 </html>
 ```
 
diff --git a/2-ui/1-document/7-basic-dom-node-properties/3-tag-in-comment/solution.md b/2-ui/1-document/7-basic-dom-node-properties/3-tag-in-comment/solution.md
index f791b12f..6301505b 100644
--- a/2-ui/1-document/7-basic-dom-node-properties/3-tag-in-comment/solution.md
+++ b/2-ui/1-document/7-basic-dom-node-properties/3-tag-in-comment/solution.md
@@ -3,11 +3,11 @@
 ```html
 <!--+ run -->
 <script>
-var body = document.body;
+  var body = document.body;
 
-body.innerHTML = "<!--" + body.tagName + "-->"; 
+  body.innerHTML = "<!--" + body.tagName + "-->";
 
-alert(body.firstChild.data); // BODY
+  alert( body.firstChild.data ); // BODY
 </script>
 ```
 
diff --git a/2-ui/1-document/7-basic-dom-node-properties/3-tag-in-comment/task.md b/2-ui/1-document/7-basic-dom-node-properties/3-tag-in-comment/task.md
index 2e42bbc4..e2cc5b02 100644
--- a/2-ui/1-document/7-basic-dom-node-properties/3-tag-in-comment/task.md
+++ b/2-ui/1-document/7-basic-dom-node-properties/3-tag-in-comment/task.md
@@ -6,11 +6,11 @@
 
 ```html
 <script>
-var body = document.body;
+  var body = document.body;
 
-body.innerHTML = "<!--" + body.tagName + "-->";  
+  body.innerHTML = "<!--" + body.tagName + "-->";
 
-alert(body.firstChild.data); // что выведет? 
+  alert( body.firstChild.data ); // что выведет?
 </script>
 ```
 
diff --git a/2-ui/1-document/7-basic-dom-node-properties/article.md b/2-ui/1-document/7-basic-dom-node-properties/article.md
index c680fd0f..b67e96b8 100644
--- a/2-ui/1-document/7-basic-dom-node-properties/article.md
+++ b/2-ui/1-document/7-basic-dom-node-properties/article.md
@@ -45,16 +45,16 @@ alert( document.body ); // [object HTMLBodyElement]
 Вот из него выдержка:
 
 ```js
-interface HTMLInputElement : HTMLElement {
-  attribute DOMString accept; 
+interface HTMLInputElement: HTMLElement {
+  attribute DOMString accept;
   attribute DOMString alt;
   attribute DOMString autocomplete;
   attribute boolean autofocus;
   ...
   attribute DOMString value;
   ...
-  void select();   
-  ... 
+  void select();
+  ...
 }
 ```
 
@@ -84,18 +84,18 @@ interface HTMLInputElement : HTMLElement {
 ```js
 interface Node {
   // NodeType
-  const unsigned short      ELEMENT_NODE       = 1;
-  const unsigned short      ATTRIBUTE_NODE     = 2;
-  const unsigned short      TEXT_NODE          = 3;
-  const unsigned short      CDATA_SECTION_NODE = 4;
-  const unsigned short      ENTITY_REFERENCE_NODE = 5;
-  const unsigned short      ENTITY_NODE        = 6;
-  const unsigned short      PROCESSING_INSTRUCTION_NODE = 7;
-  const unsigned short      COMMENT_NODE       = 8;
-  const unsigned short      DOCUMENT_NODE      = 9;
-  const unsigned short      DOCUMENT_TYPE_NODE = 10;
-  const unsigned short      DOCUMENT_FRAGMENT_NODE = 11;
-  const unsigned short      NOTATION_NODE      = 12;   
+  const unsigned short ELEMENT_NODE = 1;
+  const unsigned short ATTRIBUTE_NODE = 2;
+  const unsigned short TEXT_NODE = 3;
+  const unsigned short CDATA_SECTION_NODE = 4;
+  const unsigned short ENTITY_REFERENCE_NODE = 5;
+  const unsigned short ENTITY_NODE = 6;
+  const unsigned short PROCESSING_INSTRUCTION_NODE = 7;
+  const unsigned short COMMENT_NODE = 8;
+  const unsigned short DOCUMENT_NODE = 9;
+  const unsigned short DOCUMENT_TYPE_NODE = 10;
+  const unsigned short DOCUMENT_FRAGMENT_NODE = 11;
+  const unsigned short NOTATION_NODE = 12;
   ...
 }
 ```
@@ -112,20 +112,20 @@ interface Node {
     <li>Вася</li>
     <li>Петя</li>
   </ul>
- 
+
   <!-- комментарий -->
 
-  <script>   
+  <script>
     var childNodes = document.body.childNodes;
 
-    for (var i=0; i<childNodes.length; i++) {
+    for (var i = 0; i < childNodes.length; i++) {
 
 *!*
       // отфильтровать не-элементы  
       if (childNodes[i].nodeType != 1) continue;
 */!*
 
-      alert(childNodes[i]);
+      alert( childNodes[i] );
 
     }
   </script>
@@ -145,8 +145,8 @@ interface Node {
 
 ```js
 //+ run
-alert( document.body.nodeName );   // BODY
-alert( document.body.tagName );   // BODY
+alert( document.body.nodeName ); // BODY
+alert( document.body.tagName ); // BODY
 ```
 
 [smart header="В XHTML `nodeName` может быть не в верхнем регистре"]
@@ -172,17 +172,18 @@ XML-режим включается, когда браузер получает
 
 ```html
 <!--+ run -->
-<body><!-- комментарий -->
+<body>
+  <!-- комментарий -->
 
-<script>
-  // для комментария
-  alert(document.body.firstChild.nodeName); // #comment
-  alert(document.body.firstChild.tagName); // undefined (в IE8- воскл. знак "!")
+  <script>
+    // для комментария
+    alert( document.body.firstChild.nodeName ); // #comment
+    alert( document.body.firstChild.tagName ); // undefined (в IE8- воскл. знак "!")
 
-  // для документа
-  alert(document.nodeName); // #document, т.к. корень DOM -- не элемент
-  alert(document.tagName); // undefined
-</script>
+    // для документа
+    alert( document.nodeName ); // #document, т.к. корень DOM -- не элемент
+    alert( document.tagName ); // undefined
+  </script>
 </body>
 ```
 
@@ -218,7 +219,7 @@ XML-режим включается, когда браузер получает
 
   <script>
     document.body.innerHTML = '<b>тест'; // незакрытый тег
-    alert(document.body.innerHTML); // <b>тест</b> (исправлено)
+    alert( document.body.innerHTML ); // <b>тест</b> (исправлено)
   </script>
 
 </body>
@@ -270,7 +271,7 @@ chatDiv.innerHTML += "Как дела?";
 
 <script>
   var elem = document.getElementById('my');
-  elem.innerHTML = 'ТЕСТ<script>alert(1);</scr'+'ipt>';
+  elem.innerHTML = 'ТЕСТ<script>alert( 1 );</scr' + 'ipt>';
 </script>
 ```
 
@@ -299,7 +300,7 @@ chatDiv.innerHTML += "Как дела?";
 <script>
   var div = document.body.children[0];
 
-  alert(div.outerHTML); // <div>Привет <b>Мир</b></div>
+  alert( div.outerHTML ); // <div>Привет <b>Мир</b></div>
 </script>
 ```
 
@@ -326,7 +327,7 @@ chatDiv.innerHTML += "Как дела?";
 *!*
   // ... но содержимое div.outerHTML осталось тем же, несмотря на "перезапись"
 */!*
-  alert(div.outerHTML);  // <div>Привет, Мир!</div>
+  alert( div.outerHTML ); // <div>Привет, Мир!</div>
 </script>
 ```
 
@@ -354,9 +355,9 @@ chatDiv.innerHTML += "Как дела?";
   Привет
   <!-- Комментарий -->
   <script>
-    for (var i=0; i<document.body.childNodes.length; i++) {
+    for (var i = 0; i < document.body.childNodes.length; i++) {
 *!*
-      alert(document.body.childNodes[i].data);
+      alert( document.body.childNodes[i].data );
 */!*
     }
   </script>
@@ -489,9 +490,9 @@ chatDiv.innerHTML += "Как дела?";
 <script>
   var input = document.body.children[0];
 
-  alert(input.type); // "text"
-  alert(input.id); // "input"
-  alert(input.value); // значение
+  alert( input.type ); // "text"
+  alert( input.id ); // "input"
+  alert( input.value ); // значение
 </script>
 ```
 
diff --git a/2-ui/1-document/8-dom-polyfill/1-polyfill-matches/solution.md b/2-ui/1-document/8-dom-polyfill/1-polyfill-matches/solution.md
index ebe0cc05..384b50de 100644
--- a/2-ui/1-document/8-dom-polyfill/1-polyfill-matches/solution.md
+++ b/2-ui/1-document/8-dom-polyfill/1-polyfill-matches/solution.md
@@ -9,9 +9,9 @@
   if (!Element.prototype.matches) {
 
     // определяем свойство
-    Element.prototype.matches = Element.prototype.matchesSelector || 
-      Element.prototype.webkitMatchesSelector || 
-      Element.prototype.mozMatchesSelector || 
+    Element.prototype.matches = Element.prototype.matchesSelector ||
+      Element.prototype.webkitMatchesSelector ||
+      Element.prototype.mozMatchesSelector ||
       Element.prototype.msMatchesSelector,
 
   }
diff --git a/2-ui/1-document/8-dom-polyfill/3-polyfill-textcontent-ie8/solution.md b/2-ui/1-document/8-dom-polyfill/3-polyfill-textcontent-ie8/solution.md
index c60bc64c..2bfa57c4 100644
--- a/2-ui/1-document/8-dom-polyfill/3-polyfill-textcontent-ie8/solution.md
+++ b/2-ui/1-document/8-dom-polyfill/3-polyfill-textcontent-ie8/solution.md
@@ -7,15 +7,14 @@
   if (document.documentElement.textContent === undefined) {
 
     // определяем свойство
-    Object.defineProperty(HtmlElement.prototype, "textContent", { 
-        get: function() {
-          return this.innerText;
-        },
-        set: function(value) {
-          this.innerText = value;
-        }
+    Object.defineProperty(HtmlElement.prototype, "textContent", {
+      get: function() {
+        return this.innerText;
+      },
+      set: function(value) {
+        this.innerText = value;
       }
-    );
+    });
   }
 
 })();
diff --git a/2-ui/1-document/8-dom-polyfill/article.md b/2-ui/1-document/8-dom-polyfill/article.md
index c9701ee0..a12678a1 100644
--- a/2-ui/1-document/8-dom-polyfill/article.md
+++ b/2-ui/1-document/8-dom-polyfill/article.md
@@ -25,20 +25,20 @@
 
 ```js
 *!*
-if( document.documentElement.firstElementChild === undefined ) { // (1)
+if (document.documentElement.firstElementChild === undefined) { // (1)
 */!*
 
 *!*
   Object.defineProperty(Element.prototype, 'firstElementChild', { // (2)
 */!*
-    get: function () { 
+    get: function() {
       var el = this.firstChild;
       do {
-        if( el.nodeType === 1 ) {
+        if (el.nodeType === 1) {
           return el;
         }
         el = el.nextSibling;
-      } while(el);
+      } while (el);
 
       return null;
     }
@@ -80,7 +80,7 @@ var div = document.createElement('div');
 var input = document.createElement('input');
 
 alert( input.value ); // пустая строка, поддержка есть
-alert( div.value );  // undefined, поддержки нет
+alert( div.value ); // undefined, поддержки нет
 ```
 
 [smart header="Поддержка значений свойств"]
@@ -98,8 +98,8 @@ alert( div.value );  // undefined, поддержки нет
 <input type="no-such-type">
 
 <script>
-  alert(document.body.children[0].type); // radio, поддерживается
-  alert(document.body.children[1].type); // text, не поддерживается
+  alert( document.body.children[0].type ); // radio, поддерживается
+  alert( document.body.children[1].type ); // text, не поддерживается
 </script>
 ```
 
@@ -136,7 +136,7 @@ alert( div.value );  // undefined, поддержки нет
 ```js
 //+ run
 Element.prototype.sayHi = function() {
-  alert("Привет от " + this);
+  alert( "Привет от " + this );
 }
 
 document.body.sayHi(); // Привет от [object HTMLBodyElement]
@@ -146,7 +146,7 @@ document.body.sayHi(); // Привет от [object HTMLBodyElement]
 
 ```js
 //+ run
-Object.defineProperty(Element.prototype, 'lowerTag', { 
+Object.defineProperty(Element.prototype, 'lowerTag', {
   get: function() {
     return this.tagName.toLowerCase();
   }
diff --git a/2-ui/1-document/9-attributes-and-custom-properties/1-get-user-attribute/solution.md b/2-ui/1-document/9-attributes-and-custom-properties/1-get-user-attribute/solution.md
index c9f355f6..90412265 100644
--- a/2-ui/1-document/9-attributes-and-custom-properties/1-get-user-attribute/solution.md
+++ b/2-ui/1-document/9-attributes-and-custom-properties/1-get-user-attribute/solution.md
@@ -8,12 +8,12 @@
 
   <script>
     var div = document.getElementById('widget');
- 
+
     var widgetName = div.getAttribute('data-widget-name');
     // или так, кроме IE10-
     var widgetName = div.dataset.widgetName;
 
-    alert( widgetName );  // "menu"
+    alert( widgetName ); // "menu"
   </script>
 </body>
 ```
diff --git a/2-ui/1-document/9-attributes-and-custom-properties/1-get-user-attribute/task.md b/2-ui/1-document/9-attributes-and-custom-properties/1-get-user-attribute/task.md
index e8a57690..8eb90666 100644
--- a/2-ui/1-document/9-attributes-and-custom-properties/1-get-user-attribute/task.md
+++ b/2-ui/1-document/9-attributes-and-custom-properties/1-get-user-attribute/task.md
@@ -13,9 +13,11 @@
 ```html
 <body>
 
-  <div id="widget" data-widget-name="menu">Выберите жанр</div>  
+  <div id="widget" data-widget-name="menu">Выберите жанр</div>
 
-  <script>/* ... */</script>
+  <script>
+    /* ... */
+  </script>
 </body>
 ```
 
diff --git a/2-ui/1-document/9-attributes-and-custom-properties/2-set-class-links/solution.md b/2-ui/1-document/9-attributes-and-custom-properties/2-set-class-links/solution.md
index 85150af6..0a69fa3a 100644
--- a/2-ui/1-document/9-attributes-and-custom-properties/2-set-class-links/solution.md
+++ b/2-ui/1-document/9-attributes-and-custom-properties/2-set-class-links/solution.md
@@ -23,19 +23,19 @@
 ```js
 var links = document.querySelectorAll('a');
 
-for(var i=0; i<links.length; i++) {
+for (var i = 0; i < links.length; i++) {
 
-    var a = links[i];
+  var a = links[i];
 
-    var href = a.getAttribute('href'); 
+  var href = a.getAttribute('href');
 
-    if (!href) continue; // нет атрибута
+  if (!href) continue; // нет атрибута
 
-    if (href.indexOf('://') == -1) continue; // без протокола 
+  if (href.indexOf('://') == -1) continue; // без протокола 
 
-    if (href.indexOf('http://internal.com') === 0) continue; // внутренняя
+  if (href.indexOf('http://internal.com') === 0) continue; // внутренняя
 
-    a.classList.add('external');
+  a.classList.add('external');
 }
 ```
 
@@ -47,7 +47,7 @@ for(var i=0; i<links.length; i++) {
 var css = 'a[href*="://"]:not([href^="http://internal.com"])';
 var links = document.querySelectorAll(css);
 
-for(var i=0; i<links.length; i++) {
+for (var i = 0; i < links.length; i++) {
   links[i].classList.add('external');
 }
 ```
diff --git a/2-ui/1-document/9-attributes-and-custom-properties/2-set-class-links/task.md b/2-ui/1-document/9-attributes-and-custom-properties/2-set-class-links/task.md
index 59b9649b..30a6af59 100644
--- a/2-ui/1-document/9-attributes-and-custom-properties/2-set-class-links/task.md
+++ b/2-ui/1-document/9-attributes-and-custom-properties/2-set-class-links/task.md
@@ -9,17 +9,19 @@
 ```html
 <!--+ run -->
 <style>
-  .external { background-color: yellow }
+  .external {
+    background-color: yellow
+  }
 </style>
 
 <a name="list">список</a>
 <ul>
- <li><a href="http://google.com">http://google.com</a></li>
- <li><a href="/tutorial">/tutorial.html</a></li>
- <li><a href="local/path">local/path</a></li>
- <li><a href="ftp://ftp.com/my.zip">ftp://ftp.com/my.zip</a></li>
- <li><a href="http://nodejs.org">http://nodejs.org</a></li>
- <li><a href="http://internal.com/test">http://internal.com/test</a></li>
+  <li><a href="http://google.com">http://google.com</a></li>
+  <li><a href="/tutorial">/tutorial.html</a></li>
+  <li><a href="local/path">local/path</a></li>
+  <li><a href="ftp://ftp.com/my.zip">ftp://ftp.com/my.zip</a></li>
+  <li><a href="http://nodejs.org">http://nodejs.org</a></li>
+  <li><a href="http://internal.com/test">http://internal.com/test</a></li>
 </ul>
 ```
 
diff --git a/2-ui/1-document/9-attributes-and-custom-properties/article.md b/2-ui/1-document/9-attributes-and-custom-properties/article.md
index faf8d359..5654e451 100644
--- a/2-ui/1-document/9-attributes-and-custom-properties/article.md
+++ b/2-ui/1-document/9-attributes-and-custom-properties/article.md
@@ -19,22 +19,22 @@
 
 ```js
 //+ run
-document.body.myData = { 
+document.body.myData = {
   name: 'Петр',
   familyName: 'Петрович'
 };
 
-alert(document.body.myData.name); // Петр
+alert( document.body.myData.name ); // Петр
 ```
 
 Можно добавить и новую функцию:
 
 ```js
 //+ run
-document.body.sayHi = function() { 
-  alert(this.nodeName);
+document.body.sayHi = function() {
+  alert( this.nodeName );
 }
- 
+
 document.body.sayHi(); // BODY, выполнилась с правильным this
 ```
 
@@ -91,13 +91,13 @@ document.body.sayHi(); // BODY, выполнилась с правильным t
 
   <script>
     alert( elem.getAttribute('About') ); // (1) 'Elephant', атрибут получен
-    
-    elem.setAttribute('Test', 123);  // (2) атрибут Test установлен
-    alert( document.body.innerHTML );  // (3) в HTML видны все атрибуты!
 
-    var attrs = elem.attributes;  // (4) можно получить коллекцию атрибутов
-    for (var i=0; i<attrs.length; i++) {
-      alert(attrs[i].name + " = " + attrs[i].value); 
+    elem.setAttribute('Test', 123); // (2) атрибут Test установлен
+    alert( document.body.innerHTML ); // (3) в HTML видны все атрибуты!
+
+    var attrs = elem.attributes; // (4) можно получить коллекцию атрибутов
+    for (var i = 0; i < attrs.length; i++) {
+      alert( attrs[i].name + " = " + attrs[i].value );
     }
   </script>
 </body>
@@ -162,7 +162,7 @@ document.body.sayHi(); // BODY, выполнилась с правильным t
   // работа с checked через атрибут
 */!*
   alert( input.getAttribute('checked') ); // пустая строка
-  input.removeAttribute('checked');  // снять галочку 
+  input.removeAttribute('checked'); // снять галочку 
 
 *!*  
   // работа с checked через свойство
@@ -189,7 +189,7 @@ document.body.sayHi(); // BODY, выполнилась с правильным t
 *!*
     input.value = 'new'; // поменяли свойство
 
-    alert(input.getAttribute('value')); // 'markup', не изменилось!
+    alert( input.getAttribute('value') ); // 'markup', не изменилось!
 */!*
   </script>
 </body>
@@ -232,10 +232,10 @@ document.body.sayHi(); // BODY, выполнилась с правильным t
 <body class="main page">
   <script>
     // прочитать класс элемента
-    alert( document.body.className );  // main page
+    alert( document.body.className ); // main page
 
     // поменять класс элемента
-    document.body.className="class1 class2"; 
+    document.body.className = "class1 class2";
   </script>
 </body>
 ```
@@ -269,16 +269,16 @@ document.body.sayHi(); // BODY, выполнилась с правильным t
   <script>
     var classList = document.body.classList;
 
-   classList.remove('page');   // удалить класс
-   classList.add('post');         // добавить класс
+    classList.remove('page'); // удалить класс
+    classList.add('post'); // добавить класс
 
-   for(var i=0; i<classList.length; i++) { // перечислить классы
-     alert(classList[i]); // main, затем post
-   }
+    for (var i = 0; i < classList.length; i++) { // перечислить классы
+      alert( classList[i] ); // main, затем post
+    }
 
-   alert( classList.contains('post') );  // проверить наличие класса
+    alert( classList.contains('post') ); // проверить наличие класса
 
-   alert( document.body.className ); // main post, тоже работает
+    alert( document.body.className ); // main post, тоже работает
   </script>
 </body>
 ```
@@ -331,9 +331,11 @@ document.body.sayHi(); // BODY, выполнилась с правильным t
   .order[order-state="new"] {
     color: green;
   }
+  
   .order[order-state="pending"] {
     color: blue;
   }
+  
   .order[order-state="canceled"] {
     color: red;
   }
@@ -364,7 +366,7 @@ div.setAttribute('order-state', 'canceled');
 Для классов -- нужно знать, какой класс у заказа сейчас. И тогда мы можем снять старый класс, и поставить новый:
 
 ```js
-div.classList.remove('order-state-new'); 
+div.classList.remove('order-state-new');
 div.classList.add('order-state-canceled');
 ```
 
@@ -417,7 +419,7 @@ div.classList.add('order-state-canceled');
 Этот атрибут должен прятать элемент, действие весьма простое, для его поддержки в HTML достаточно такого CSS:
 
 ```html
-<!--+ run height="80" -->
+<!--+ run height="80"  no-beautify -->
 <style>
 *!*
   [hidden] { display: none }
@@ -441,7 +443,7 @@ div.classList.add('order-state-canceled');
 
 
 ```html
-<!--+ run height="80" -->
+<!--+ run height="80"  no-beautify -->
 <style>
 *!*
   [hidden] { display: none }
@@ -485,7 +487,7 @@ div.classList.add('order-state-canceled');
 //+ run
 document.body.setAttribute('my', 123);
 
-alert( document.body.my );  // 123 в IE8-
+alert( document.body.my ); // 123 в IE8-
 ```
 
 При этом даже тип данных не меняется. Атрибут не становится строкой, как ему положено. 
diff --git a/2-ui/2-events-and-interfaces/1-introduction-browser-events/2-hide-self-onclick/solution.md b/2-ui/2-events-and-interfaces/1-introduction-browser-events/2-hide-self-onclick/solution.md
index 4a7904c0..77d9ca35 100644
--- a/2-ui/2-events-and-interfaces/1-introduction-browser-events/2-hide-self-onclick/solution.md
+++ b/2-ui/2-events-and-interfaces/1-introduction-browser-events/2-hide-self-onclick/solution.md
@@ -2,6 +2,6 @@
 
 ```html
 <!--+ run height=50 -->
-<input type="button" onclick="this.style.display='none'" value="Нажми, чтобы меня спрятать"/>
+<input type="button" onclick="this.style.display='none'" value="Нажми, чтобы меня спрятать" />
 ```
 
diff --git a/2-ui/2-events-and-interfaces/1-introduction-browser-events/3-which-handlers-run/solution.md b/2-ui/2-events-and-interfaces/1-introduction-browser-events/3-which-handlers-run/solution.md
index 71a45995..b6a9dbb2 100644
--- a/2-ui/2-events-and-interfaces/1-introduction-browser-events/3-which-handlers-run/solution.md
+++ b/2-ui/2-events-and-interfaces/1-introduction-browser-events/3-which-handlers-run/solution.md
@@ -5,8 +5,8 @@
 Для того, чтобы удалить функцию-обработчик, нужно где-то сохранить ссылку на неё, например так:
 
 ```js
-function handler() { 
-  alert("1"); 
+function handler() {
+  alert( "1" );
 }
 
 button.addEventListener("click", handler);
diff --git a/2-ui/2-events-and-interfaces/1-introduction-browser-events/3-which-handlers-run/task.md b/2-ui/2-events-and-interfaces/1-introduction-browser-events/3-which-handlers-run/task.md
index f6974d8a..04acb251 100644
--- a/2-ui/2-events-and-interfaces/1-introduction-browser-events/3-which-handlers-run/task.md
+++ b/2-ui/2-events-and-interfaces/1-introduction-browser-events/3-which-handlers-run/task.md
@@ -9,6 +9,7 @@
 Что будет выведено при клике после выполнения кода?
 
 ```js
+//+ no-beautify
 button.addEventListener("click", function() { alert("1"); });
 
 button.removeEventListener("click", function() { alert("1"); });
diff --git a/2-ui/2-events-and-interfaces/1-introduction-browser-events/4-sliding-menu/solution.md b/2-ui/2-events-and-interfaces/1-introduction-browser-events/4-sliding-menu/solution.md
index c4e99bb7..1496f3f8 100644
--- a/2-ui/2-events-and-interfaces/1-introduction-browser-events/4-sliding-menu/solution.md
+++ b/2-ui/2-events-and-interfaces/1-introduction-browser-events/4-sliding-menu/solution.md
@@ -1,4 +1,3 @@
-# Структура HTML/CSS
 
 Для начала, зададим структуру HTML/CSS.
 
@@ -33,41 +32,36 @@
 <span style="border: solid red 1px">[Сладости (нажми меня)!]</span>
 ```
 
-Раскрытие/закрытие делайте путём добавления/удаления класса `.menu-open` к меню, которые отвечает за стрелочку и отображение `UL`.
+Раскрытие/закрытие сделаем путём добавления/удаления класса `.menu-open` к меню, которые отвечает за стрелочку и отображение `UL`.
 
-# CSS 
-
-CSS для меню:
+Обычно меню будет закрыто:
 
 ```css
 .menu ul {
   margin: 0;
   list-style: none;
   padding-left: 20px;
-    
   display: none;
 }
-  
-.menu .title {
-  padding-left: 16px;
-  font-size: 18px;
-  cursor: pointer;
-    
-  background: url(...arrow-right.png) left center no-repeat;       
+
+.menu .title::before {
+  content: '▶ ';
+  font-size: 80%;
+  color: green;
 }
 ```
 
 Если же меню раскрыто, то есть имеет класс `.menu-open`, то стрелочка слева заголовка меняется и список детей показывается:
 
 ```css
-.menu-open .title {
-  background: url(...arrow-down.png) left center no-repeat; 
+.menu.open .title::before {
+  content: '▼ ';
 }
-  
-.menu-open ul {
+
+.menu.open ul {
   display: block;
 }
 ```
 
-Теперь сделайте JavaScript.
+Для JavaScript остался минимум работы -- только добавить/удалить класс при клике.
 
diff --git a/2-ui/2-events-and-interfaces/1-introduction-browser-events/5-hide-message/solution.view/messages.css b/2-ui/2-events-and-interfaces/1-introduction-browser-events/5-hide-message/solution.view/messages.css
index 0856c9ba..54d6f5e2 100755
--- a/2-ui/2-events-and-interfaces/1-introduction-browser-events/5-hide-message/solution.view/messages.css
+++ b/2-ui/2-events-and-interfaces/1-introduction-browser-events/5-hide-message/solution.view/messages.css
@@ -26,7 +26,7 @@ p {
   position: absolute;
   font-size: 110%;
   top: 0;
-  color: red;
+  color: darkred;
   right: 10px;
   display: block;
   width: 24px;
diff --git a/2-ui/2-events-and-interfaces/1-introduction-browser-events/5-hide-message/source.view/messages.css b/2-ui/2-events-and-interfaces/1-introduction-browser-events/5-hide-message/source.view/messages.css
index b3268b01..d58d4208 100755
--- a/2-ui/2-events-and-interfaces/1-introduction-browser-events/5-hide-message/source.view/messages.css
+++ b/2-ui/2-events-and-interfaces/1-introduction-browser-events/5-hide-message/source.view/messages.css
@@ -22,7 +22,7 @@ p {
 
 .remove-button {
   font-size: 110%;
-  color: red;
+  color: darkred;
   right: 10px;
   width: 24px;
   height: 24px;
diff --git a/2-ui/2-events-and-interfaces/1-introduction-browser-events/article.md b/2-ui/2-events-and-interfaces/1-introduction-browser-events/article.md
index f886f6d1..21f3aa8b 100644
--- a/2-ui/2-events-and-interfaces/1-introduction-browser-events/article.md
+++ b/2-ui/2-events-and-interfaces/1-introduction-browser-events/article.md
@@ -106,12 +106,12 @@
 Пример установки обработчика `click`:
 
 ```html
-<input id="elem" type="button" value="Нажми меня"/>
+<input id="elem" type="button" value="Нажми меня" />
 <script>
 *!*
-elem.onclick = function() {
-    alert('Спасибо');
-};
+  elem.onclick = function() {
+    alert( 'Спасибо' );
+  };
 */!*
 </script>
 ```
@@ -137,12 +137,12 @@ elem.onclick = function() {
 
 ```html
 <!--+ run height=50 -->
-<input type="button" id="button" value="Кнопка"/>
+<input type="button" id="button" value="Кнопка" />
 <script>
 *!*
-button.onclick = function() {
-  alert('Клик!');
-};
+  button.onclick = function() {
+    alert( 'Клик!' );
+  };
 */!*
 </script>
 ```
@@ -156,12 +156,12 @@ button.onclick = function() {
 
 ```html
 <!--+ run height=50 autorun -->
-<input type="button" id="elem" onclick="alert('До')" value="Нажми меня"/>
+<input type="button" id="elem" onclick="alert('До')" value="Нажми меня" />
 <script>
 *!*
-elem.onclick = function() { // перезапишет существующий обработчик
-  alert('После'); // выведется только это
-};
+  elem.onclick = function() { // перезапишет существующий обработчик
+    alert( 'После' ); // выведется только это
+  };
 */!*
 </script>
 ```
@@ -170,7 +170,7 @@ elem.onclick = function() { // перезапишет существующий 
 
 ```js
 function sayThanks() {
-  alert('Спасибо!');
+  alert( 'Спасибо!' );
 }
 
 elem.onclick = sayThanks;
@@ -211,7 +211,7 @@ button.onclick = sayThanks;
 ...А вот в разметке как раз скобки нужны:
 
 ```html
-<input type="button" id="button" onclick="sayThanks()"/>
+<input type="button" id="button" onclick="sayThanks()" />
 ```
 
 Это различие просто объяснить. При создании обработчика браузером из атрибута, он автоматически создает функцию из его содержимого. Поэтому последний пример -- фактически то же самое, что:
@@ -219,7 +219,7 @@ button.onclick = sayThanks;
 ```js
 button.onclick = function() {
 *!*
-  sayThanks();  // содержимое атрибута
+  sayThanks(); // содержимое атрибута
 */!*
 };
 ```
@@ -234,7 +234,7 @@ button.onclick = function() {
 Такой вызов работать не будет:
 
 ```js
-//+ run
+//+ run no-beautify
 // при нажатии на body будут ошибки 
 // потому что при назначении в атрибут функция будет преобразована в строку
 document.body.setAttribute('onclick', function() { alert(1) });
@@ -255,6 +255,7 @@ document.body.setAttribute('onclick', function() { alert(1) });
 При этом новый обработчик будет затирать предыдущий. Например, следующий код на самом деле назначает один обработчик -- последний:
 
 ```js
+//+ no-beautify
 input.onclick = function() { alert(1); }
 // ...
 input.onclick = function() { alert(2); } // заменит предыдущий обработчик
@@ -269,7 +270,7 @@ input.onclick = function() { alert(2); } // заменит предыдущий
 Назначение обработчика осуществляется вызовом `addEventListener` с тремя аргументами:
 
 ```js
-element.addEventListener( event, handler[, phase]);
+element.addEventListener(event, handler[, phase]);
 ```
 
 <dl>
@@ -285,7 +286,7 @@ element.addEventListener( event, handler[, phase]);
 
 ```js
 // передать те же аргументы, что были у addEventListener
-element.removeEventListener( event, handler[, phase]);
+element.removeEventListener(event, handler[, phase]);
 ```
 
 [warn header="Удаление требует именно ту же функцию"]
@@ -294,6 +295,7 @@ element.removeEventListener( event, handler[, phase]);
 Вот так `removeEventListener` не сработает:
 
 ```js
+//+ no-beautify
 elem.addEventListener( "click" , function() {alert('Спасибо!')});
 // .... 
 elem.removeEventListener( "click", function() {alert('Спасибо!')});
@@ -305,12 +307,12 @@ elem.removeEventListener( "click", function() {alert('Спасибо!')});
 
 ```js
 function handler() {
-  alert('Спасибо!');
+  alert( 'Спасибо!' );
 }
 
-input.addEventListener( "click", handler);
+input.addEventListener("click", handler);
 // .... 
-input.removeEventListener( "click", handler);
+input.removeEventListener("click", handler);
 ```
 
 Обратим внимание -- если функцию не сохранить где-либо, а просто передать в `addEventListener`, как в предыдущем коде, то потом получить её обратно, чтобы снять обработчик, будет невозможно. Нет метода, который позволяет считать обработчики событий, назанченные через `addEventListener`.
@@ -319,7 +321,7 @@ input.removeEventListener( "click", handler);
 Метод `addEventListener` позволяет добавлять несколько обработчиков на одно событие одного элемента, например:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <input id="elem" type="button" value="Нажми меня"/>
 
 <script>
@@ -357,6 +359,7 @@ input.removeEventListener( "click", handler);
     transition: width 1s;
     width: 100px;
   }
+  
   .wide {
     width: 300px;
   }
@@ -367,14 +370,14 @@ input.removeEventListener( "click", handler);
 </button>
 
 <script>
-  elem.ontransitionend = function() { 
-    alert("ontransitionend");  // не сработает
+  elem.ontransitionend = function() {
+    alert( "ontransitionend" ); // не сработает
   };
 
 *!*
   elem.addEventListener("transitionend", function() {
-    alert("addEventListener"); // сработает по окончании анимации
-  }, false);
+    alert( "addEventListener" ); // сработает по окончании анимации
+  });
 */!*
 </script>
 ```
@@ -390,24 +393,24 @@ input.removeEventListener( "click", handler);
 Назначение обработчика осуществляется вызовом `attachEvent`:
 
 ```js
-element.attachEvent( "on"+event, handler);
+element.attachEvent("on" + event, handler);
 ```
 
 Удаление обработчика -- вызовом `detachEvent`:
 
 ```js
-element.detachEvent( "on"+event, handler);
+element.detachEvent("on" + event, handler);
 ```
 
 Например:
 
 ```js
 function handler() {
-    alert('Спасибо!');
+  alert( 'Спасибо!' );
 }
-button.attachEvent( "onclick" , handler) // Назначение обработчика
-// .... 
-button.detachEvent( "onclick", handler) // Удаление обработчика
+button.attachEvent("onclick", handler) // Назначение обработчика
+  // .... 
+button.detachEvent("onclick", handler) // Удаление обработчика
 ```
 
 Как видите, почти то же самое, только событие должно включать префикс `on`.
diff --git a/2-ui/2-events-and-interfaces/2-events-and-timing-depth/article.md b/2-ui/2-events-and-interfaces/2-events-and-timing-depth/article.md
index 5c719796..831bd230 100644
--- a/2-ui/2-events-and-interfaces/2-events-and-timing-depth/article.md
+++ b/2-ui/2-events-and-interfaces/2-events-and-timing-depth/article.md
@@ -50,7 +50,7 @@
 В действии:
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <textarea rows="6" cols="40" id="area">Кликни меня
 </textarea>
 
@@ -103,7 +103,7 @@
 При этом обработчик `onclick` вызовет метод `focus()` на текстовом поле `text`. Код обработчика `onfocus`, который при этом запустится, сработает синхронно, прямо сейчас, до завершения `onclick`.
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <input type="button" id="button" value="Нажми меня">
 <input type="text" id="text" size="60">
 
@@ -147,7 +147,6 @@
 <input type="text" id="text" size="60">
 
 <script>
-
   button.onclick = function() {
     text.value += ' ->в onclick ';
 
@@ -156,10 +155,10 @@
       text.focus(); // сработает после onclick
     }, 0);
 */!*
-   
+
     text.value += ' из onclick-> ';
   };
- 
+
   text.onfocus = function() {
     text.value += ' !focus! ';
   };
diff --git a/2-ui/2-events-and-interfaces/3-obtaining-event-object/article.md b/2-ui/2-events-and-interfaces/3-obtaining-event-object/article.md
index 8e8f472f..d54cdaf0 100644
--- a/2-ui/2-events-and-interfaces/3-obtaining-event-object/article.md
+++ b/2-ui/2-events-and-interfaces/3-obtaining-event-object/article.md
@@ -76,7 +76,7 @@ element.onclick = function(event) {
 
 ```js
 element.onclick = function(e) {
-  e = e || event; 
+  e = e || event;
 
   // Теперь e - объект события во всех браузерах.
 };
@@ -93,9 +93,9 @@ element.onclick = function(e) {
 
 ```js
 element.onclick = function(event) {
-    event = event || window.event;
+  event = event || window.event;
 
-    // Теперь event - объект события во всех браузерах.
+  // Теперь event - объект события во всех браузерах.
 };
 ```
 
@@ -103,8 +103,8 @@ element.onclick = function(event) {
 
 ```js
 element.onclick = function(e) {
-    e = e || event; // если нет другой внешней переменной event
-    ...
+  e = e || event; // если нет другой внешней переменной event
+  ...
 };
 ```
 
diff --git a/2-ui/2-events-and-interfaces/4-event-bubbling/article.md b/2-ui/2-events-and-interfaces/4-event-bubbling/article.md
index bc3ba0ce..e1e8265f 100644
--- a/2-ui/2-events-and-interfaces/4-event-bubbling/article.md
+++ b/2-ui/2-events-and-interfaces/4-event-bubbling/article.md
@@ -24,13 +24,16 @@
 ```html
 <!--+ run autorun -->
 <style>
-  body * { margin: 10px; border: 1px solid blue; }
+  body * {
+    margin: 10px;
+    border: 1px solid blue;
+  }
 </style>
 
 <form onclick="alert('form')">FORM
-    <div onclick="alert('div')">DIV
-        <p onclick="alert('p')">P</p>
-    </div>
+  <div onclick="alert('div')">DIV
+    <p onclick="alert('p')">P</p>
+  </div>
 </form>
 ```
 
@@ -166,7 +169,7 @@ JS-код здесь такой:
 var elems = document.querySelectorAll('form,div,p');
 
 // на каждый элемент повесить обработчик на стадии перехвата
-for(var i=0; i<elems.length; i++) {
+for (var i = 0; i < elems.length; i++) {
   elems[i].addEventListener("click", highlightThis, true);
 }
 ```
@@ -176,7 +179,7 @@ for(var i=0; i<elems.length; i++) {
 ```js
 var elems = document.querySelectorAll('form,div,p');
 
-for(var i=0; i<elems.length; i++) {
+for (var i = 0; i < elems.length; i++) {
   elems[i].addEventListener("click", highlightThis, true);
   elems[i].addEventListener("click", highlightThis, false);
 }
@@ -218,6 +221,7 @@ elem.onclick = function(event) {
 <dd>Кросс-браузерно остановить всплытие можно так:
 
 ```js
+//+ no-beautify
 event.stopPropagation ? event.stopPropagation() : (event.cancelBubble=true);
 ```
 
diff --git a/2-ui/2-events-and-interfaces/5-event-delegation/1-hide-message-delegate/solution.view/messages.css b/2-ui/2-events-and-interfaces/5-event-delegation/1-hide-message-delegate/solution.view/messages.css
index f6e6a0e0..469b5769 100755
--- a/2-ui/2-events-and-interfaces/5-event-delegation/1-hide-message-delegate/solution.view/messages.css
+++ b/2-ui/2-events-and-interfaces/5-event-delegation/1-hide-message-delegate/solution.view/messages.css
@@ -26,7 +26,7 @@ p {
   position: absolute;
   font-size: 110%;
   top: 0;
-  color: red;
+  color: darkred;
   right: 10px;
   display: block;
   width: 24px;
diff --git a/2-ui/2-events-and-interfaces/5-event-delegation/1-hide-message-delegate/source.view/messages.css b/2-ui/2-events-and-interfaces/5-event-delegation/1-hide-message-delegate/source.view/messages.css
index 0379abe8..6588f729 100755
--- a/2-ui/2-events-and-interfaces/5-event-delegation/1-hide-message-delegate/source.view/messages.css
+++ b/2-ui/2-events-and-interfaces/5-event-delegation/1-hide-message-delegate/source.view/messages.css
@@ -22,7 +22,7 @@ p {
 
 .remove-button {
   font-size: 110%;
-  color: red;
+  color: darkred;
   right: 10px;
   width: 24px;
   height: 24px;
diff --git a/2-ui/2-events-and-interfaces/5-event-delegation/2-sliding-tree/solution.md b/2-ui/2-events-and-interfaces/5-event-delegation/2-sliding-tree/solution.md
index dd6daa3d..2dd5aae6 100644
--- a/2-ui/2-events-and-interfaces/5-event-delegation/2-sliding-tree/solution.md
+++ b/2-ui/2-events-and-interfaces/5-event-delegation/2-sliding-tree/solution.md
@@ -11,18 +11,20 @@
 ```html
 <!--+ autorun height=190 untrusted -->
 <style>
-li { border: 1px solid green; }
+  li {
+    border: 1px solid green;
+  }
 </style>
 
 <ul onclick="alert(event.target)">
-<li>Млекопетающие
-  <ul>
-    <li>Коровы</li>
-    <li>Ослы</li>
-    <li>Собаки</li>
-    <li>Тигры</li>
-  </ul>
-</li>
+  <li>Млекопетающие
+    <ul>
+      <li>Коровы</li>
+      <li>Ослы</li>
+      <li>Собаки</li>
+      <li>Тигры</li>
+    </ul>
+  </li>
 </ul>
 ```
 
@@ -41,9 +43,9 @@ var treeUl = document.getElementsByTagName('ul')[0];
 
 var treeLis = treeUl.getElementsByTagName('li');
 
-for(var i=0; i<treeLis.length; i++) {
+for (var i = 0; i < treeLis.length; i++) {
   var li = treeLis[i];
-  
+
   var span = document.createElement('span');
   li.insertBefore(span, li.firstChild); // добавить пустой SPAN
   span.appendChild(span.nextSibling); // переместить в него заголовок
@@ -57,18 +59,20 @@ for(var i=0; i<treeLis.length; i++) {
 ```html
 <!--+ autorun height=190 untrusted -->
 <style>
-span { border: 1px solid red; }
+  span {
+    border: 1px solid red;
+  }
 </style>
 
 <ul onclick="alert(event.target.tagName)">
-<li><span>Млекопетающие</span>
-  <ul>
-    <li><span>Коровы</span></li>
-    <li><span>Ослы</span></li>
-    <li><span>Собаки</span></li>
-    <li><span>Тигры</span></li>
-  </ul>
-</li>
+  <li><span>Млекопетающие</span>
+    <ul>
+      <li><span>Коровы</span></li>
+      <li><span>Ослы</span></li>
+      <li><span>Собаки</span></li>
+      <li><span>Тигры</span></li>
+    </ul>
+  </li>
 </ul>
 ```
 
@@ -88,10 +92,10 @@ var tree = document.getElementsByTagName('ul')[0];
 tree.onclick = function(event) {
   var target = event.target;
 
-  if (target.tagName != 'SPAN') {    
+  if (target.tagName != 'SPAN') {
     return; // клик был не на заголовке
   }
-    
+
   var li = target.parentNode; // получить родительский LI
 
   // получить UL с потомками -- это первый UL внутри LI
diff --git a/2-ui/2-events-and-interfaces/5-event-delegation/article.md b/2-ui/2-events-and-interfaces/5-event-delegation/article.md
index 370fd03c..ef3c45fc 100644
--- a/2-ui/2-events-and-interfaces/5-event-delegation/article.md
+++ b/2-ui/2-events-and-interfaces/5-event-delegation/article.md
@@ -19,9 +19,9 @@
     <th colspan="3"><em>Bagua</em> Chart: Direction, Element, Color, Meaning</th>
   </tr>
   <tr>
-     <td>...<strong>Northwest</strong>...</td>
-     <td>...</td>
-     <td>...</td>
+    <td>...<strong>Northwest</strong>...</td>
+    <td>...</td>
+    <td>...</td>
   </tr>
   <tr>...еще 2 строки такого же вида...</tr>
   <tr>...еще 2 строки такого же вида...</tr>
@@ -44,7 +44,7 @@ var selectedTd;
 *!*
 table.onclick = function(event) {
   var target = event.target; // где был клик?
-  
+
   if (target.tagName != 'TD') return; // не на TD? тогда не интересует
 
   highlight(target); // подсветить TD
@@ -94,13 +94,13 @@ function highlight(node) {
 ```js
 table.onclick = function(event) {
   var target = event.target;
-  
+
   // цикл двигается вверх от target к родителям до table
-  while(target != table) { 
+  while (target != table) {
     if (target.tagName == 'TD') {
-       // нашли элемент, который нас интересует!
-       highlight(target);
-       return;
+      // нашли элемент, который нас интересует!
+      highlight(target);
+      return;
     }
     target = target.parentNode;
   }
@@ -115,7 +115,7 @@ table.onclick = function(event) {
 Кстати, в проверке `while` можно бы было использовать `this` вместо `table`:
 
 ```js
-while(target != this) {
+while (target != this) {
   // ...
 }
 ```
@@ -128,13 +128,13 @@ while(target != this) {
 ```js
 table.onclick = function(event) {
   var target = event.target;
-  
+
   var td = event.target.closest('td');
   if (!td) return; // клик вне <td>, не интересует
 
   // если клик на td, но вне этой таблицы (возможно при вложенных таблицах)
   // то не интересует
-  if (!table.contains(td)) return; 
+  if (!table.contains(td)) return;
 
   // нашли элемент, который нас интересует!
   highlight(td);
@@ -172,25 +172,31 @@ table.onclick = function(event) {
 </div>
 
 <script>
-function Menu(elem) {
-  this.save = function() { alert('сохраняю'); };
-  this.load = function() { alert('загружаю'); };
-  this.search = function() { alert('ищу'); };
+  function Menu(elem) {
+    this.save = function() {
+      alert( 'сохраняю' );
+    };
+    this.load = function() {
+      alert( 'загружаю' );
+    };
+    this.search = function() {
+      alert( 'ищу' );
+    };
 
-  var self = this;
+    var self = this;
 
-  elem.onclick = function(e) {
-    var target = e.target;
+    elem.onclick = function(e) {
+      var target = e.target;
 *!*
-    var action = target.getAttribute('data-action');
-    if (action) {
-      self[action]();
-    }
+      var action = target.getAttribute('data-action');
+      if (action) {
+        self[action]();
+      }
 */!*
-  };
-}
+    };
+  }
 
-new Menu(menu);
+  new Menu(menu);
 </script>
 ```
 
diff --git a/2-ui/2-events-and-interfaces/7-default-browser-action/1-why-return-false-fails/solution.md b/2-ui/2-events-and-interfaces/7-default-browser-action/1-why-return-false-fails/solution.md
index fcfccc4a..27e91612 100644
--- a/2-ui/2-events-and-interfaces/7-default-browser-action/1-why-return-false-fails/solution.md
+++ b/2-ui/2-events-and-interfaces/7-default-browser-action/1-why-return-false-fails/solution.md
@@ -4,7 +4,7 @@
 
 ```js
 function(event) {
-  handler()  // тело взято из атрибута onclick
+  handler() // тело взято из атрибута onclick
 }
 ```
 
diff --git a/2-ui/2-events-and-interfaces/7-default-browser-action/1-why-return-false-fails/task.md b/2-ui/2-events-and-interfaces/7-default-browser-action/1-why-return-false-fails/task.md
index a7a13551..a2ef7979 100644
--- a/2-ui/2-events-and-interfaces/7-default-browser-action/1-why-return-false-fails/task.md
+++ b/2-ui/2-events-and-interfaces/7-default-browser-action/1-why-return-false-fails/task.md
@@ -8,7 +8,7 @@
 <!--+ autorun run -->
 <script>
   function handler() {
-    alert("...");
+    alert( "..." );
     return false;
   }
 </script>
diff --git a/2-ui/2-events-and-interfaces/7-default-browser-action/2-catch-link-navigation/solution.md b/2-ui/2-events-and-interfaces/7-default-browser-action/2-catch-link-navigation/solution.md
index b653e648..a10433d7 100644
--- a/2-ui/2-events-and-interfaces/7-default-browser-action/2-catch-link-navigation/solution.md
+++ b/2-ui/2-events-and-interfaces/7-default-browser-action/2-catch-link-navigation/solution.md
@@ -8,12 +8,12 @@
 contents.onclick = function(evt) {
   var target = evt.target;
 
-  function handleLink(href) {    
-    var isLeaving = confirm('Уйти на '+href+'?');    
+  function handleLink(href) {
+    var isLeaving = confirm('Уйти на ' + href + '?');
     if (!isLeaving) return false;
   }
-    
-  while(target != this) {
+
+  while (target != this) {
     if (target.nodeName == 'A') {
 *!*
       return handleLink(target.getAttribute('href')); // (*)
diff --git a/2-ui/2-events-and-interfaces/7-default-browser-action/3-image-gallery/solution.md b/2-ui/2-events-and-interfaces/7-default-browser-action/3-image-gallery/solution.md
index 728e9af9..40f8e09c 100644
--- a/2-ui/2-events-and-interfaces/7-default-browser-action/3-image-gallery/solution.md
+++ b/2-ui/2-events-and-interfaces/7-default-browser-action/3-image-gallery/solution.md
@@ -10,7 +10,7 @@ var largeImg = document.getElementById('largeImg');
 document.getElementById('thumbs').onclick = function(e) {
   var target = e.target;
 
-  while(target != this) {
+  while (target != this) {
 
     if (target.nodeName == 'A') {
       showThumbnail(target.href, target.title);
@@ -34,11 +34,11 @@ function showThumbnail(href, title) {
 
 ```js
 var imgs = thumbs.getElementsByTagName('img');
-for(var i=0; i<imgs.length; i++) {
+for (var i = 0; i < imgs.length; i++) {
   var url = imgs[i].parentNode.href;
 
 *!*
-  var img = document.createElement('img');  
+  var img = document.createElement('img');
   img.src = url;
 */!*
 }
diff --git a/2-ui/2-events-and-interfaces/7-default-browser-action/article.md b/2-ui/2-events-and-interfaces/7-default-browser-action/article.md
index 41079161..4527ba1f 100644
--- a/2-ui/2-events-and-interfaces/7-default-browser-action/article.md
+++ b/2-ui/2-events-and-interfaces/7-default-browser-action/article.md
@@ -24,7 +24,7 @@
 В следующем примере при клике по ссылке переход не произойдет:
 
 ```html
-<!--+ autorun height=60 -->
+<!--+ autorun height=60  no-beautify -->
 <a href="/" onclick="return false">Нажми здесь</a>
 или
 <a href="/" onclick="event.preventDefault()">здесь</a>
@@ -68,7 +68,7 @@ menu.onclick = function(event) {
   if (event.target.nodeName != 'A') return;
 
   var href = event.target.getAttribute('href');
-  alert(href); // может быть подгрузка с сервера, генерация интерфейса и т.п.
+  alert( href ); // может быть подгрузка с сервера, генерация интерфейса и т.п.
 
 *!*
   return false; // отменить переход по url
@@ -127,7 +127,7 @@ menu.onclick = function(event) {
 element.onclick = function(event) {
   event = event || window.event;
 
-  if (event.preventDefault) {  // если метод существует
+  if (event.preventDefault) { // если метод существует
     event.preventDefault(); // то вызвать его
   } else { // иначе вариант IE8-:
     event.returnValue = false;
@@ -138,6 +138,7 @@ element.onclick = function(event) {
 Можно записать в одну строку:
 
 ```js
+//+ no-beautify
 ...
 event.preventDefault ? event.preventDefault() : (event.returnValue=false);
 ...
diff --git a/2-ui/2-events-and-interfaces/8-dispatch-events/article.md b/2-ui/2-events-and-interfaces/8-dispatch-events/article.md
index 9a34c5be..f9b8c5ce 100644
--- a/2-ui/2-events-and-interfaces/8-dispatch-events/article.md
+++ b/2-ui/2-events-and-interfaces/8-dispatch-events/article.md
@@ -37,7 +37,7 @@ var event = new Event(тип события[, флаги]);
 При просмотре примера ниже кнопка обработчик `onclick` на кнопке сработает сам по себе, событие генерируется скриптом:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <button id="elem" onclick="alert('Клик');">Автоклик</button>
 
 <script>
@@ -74,15 +74,17 @@ var event = new Event(тип события[, флаги]);
   setTimeout(hide, 2000);
 
   function hide() {
-    var event = new Event("hide", {cancelable: true});
+    var event = new Event("hide", {
+      cancelable: true
+    });
     if (!rabbit.dispatchEvent(event)) {
-      alert('действие отменено');
+      alert( 'действие отменено' );
     } else {
       rabbit.hidden = true;
     }
   }
 
-  rabbit.addEventListener('hide',  function(event) {
+  rabbit.addEventListener('hide', function(event) {
     if (confirm("Вызвать preventDefault?")) {
       event.preventDefault();
     }
@@ -112,6 +114,7 @@ var event = new Event(тип события[, флаги]);
 Другие свойства события, если они нужны, например координаты для события мыши -- можно присвоить в объект события позже, например:
 
 ```js
+//+ no-beautify
 var event = new Event("click", {bubbles: true, cancelable: false});
 event.clientX = 100;
 event.clientY = 100;
@@ -124,7 +127,7 @@ event.clientY = 100;
 Всё, что для этого нужно -- это флаг `bubbles`:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <h1 id="elem">Привет от скрипта!</h1>
 
 <script>
@@ -179,7 +182,7 @@ var e = new MouseEvent("click", {
 });
 
 *!*
-alert(e.clientX); // 100
+alert( e.clientX ); // 100
 */!*
 ```
 
@@ -195,7 +198,7 @@ var e = new Event("click", {
 });
 
 *!*
-alert(e.clientX); // undefined, свойство не присвоено!
+alert( e.clientX ); // undefined, свойство не присвоено!
 */!*
 ```
 
@@ -275,7 +278,10 @@ event.initEvent(type, boolean bubbles, boolean cancelable);
 
 ```js
 // современный стандарт
-var event = new Event("click", { bubbles: true, cancelable: true });
+var event = new Event("click", {
+  bubbles: true,
+  cancelable: true
+});
 
 // старый стандарт
 var event = document.createEvent("Event");
@@ -291,9 +297,9 @@ event.initEvent("click", true, true);
 <h1 id="elem">Привет от скрипта!</h1>
 
 <script>
-  document.addEventListener("hello", function(event) { 
-    alert("Привет");
-    event.preventDefault();  
+  document.addEventListener("hello", function(event) {
+    alert( "Привет" );
+    event.preventDefault();
   }, false);
 
 *!*
@@ -302,9 +308,8 @@ event.initEvent("click", true, true);
 */!*
 
   if (elem.dispatchEvent(event) === false) {
-    alert('Событие было отменено preventDefault');
+    alert( 'Событие было отменено preventDefault' );
   }
-
 </script>
 ```
 
@@ -318,22 +323,22 @@ event.initEvent("click", true, true);
 Выглядят они немного страшновато, например (взято из [спецификации](http://www.w3.org/TR/DOM-Level-3-Events/#idl-interface-MouseEvent-initializers)):
 
 ```js
-void initMouseEvent ( 
-  DOMString typeArg,  // тип
-  boolean bubblesArg,  // всплывает?
-  boolean cancelableArg,  // можно отменить?
-  AbstractView? viewArg, // объект window, null означает текущее окно
-  long detailArg,   // свойство detail и другие...
-  long screenXArg,   
-  long screenYArg,  
-  long clientXArg,  
-  long clientYArg, 
-  boolean ctrlKeyArg, 
-  boolean altKeyArg, 
-  boolean shiftKeyArg, 
-  boolean metaKeyArg, 
-  unsigned short buttonArg, 
-  EventTarget? relatedTargetArg);
+void initMouseEvent(
+  DOMString typeArg, // тип
+  boolean bubblesArg, // всплывает?
+  boolean cancelableArg, // можно отменить?
+  AbstractView ? viewArg, // объект window, null означает текущее окно
+  long detailArg, // свойство detail и другие...
+  long screenXArg,
+  long screenYArg,
+  long clientXArg,
+  long clientYArg,
+  boolean ctrlKeyArg,
+  boolean altKeyArg,
+  boolean shiftKeyArg,
+  boolean metaKeyArg,
+  unsigned short buttonArg,
+  EventTarget ? relatedTargetArg);
 };
 ```
 
@@ -345,7 +350,7 @@ void initMouseEvent (
 
 <script>
   elem.onclick = function(e) {
-    alert('Клик на координатах ' + e.clientX + ':' + e.clientY);
+    alert( 'Клик на координатах ' + e.clientX + ':' + e.clientY );
   };
 
   var event = document.createEvent("MouseEvent");
@@ -371,9 +376,9 @@ try {
   window.CustomEvent = function(event, params) {
     var evt;
     params = params || {
-      bubbles:    false,
+      bubbles: false,
       cancelable: false,
-      detail:     undefined
+      detail: undefined
     };
     evt = document.createEvent("CustomEvent");
     evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
@@ -399,15 +404,15 @@ try {
 
 <script>
   document.body.onclick = function() {
-    alert("Клик, event.type=" + event.type);
+    alert( "Клик, event.type=" + event.type );
     return false;
   };
 
 *!*
   var event = document.createEventObject();
-  if( !elem.fireEvent("onclick", event) ) {
-    alert('Событие было отменено');
-  } 
+  if (!elem.fireEvent("onclick", event)) {
+    alert( 'Событие было отменено' );
+  }
 */!*
 </script>
 ```
diff --git a/2-ui/3-event-details/1-mouse-clicks/article.md b/2-ui/3-event-details/1-mouse-clicks/article.md
index af3f0dbc..1478db2c 100644
--- a/2-ui/3-event-details/1-mouse-clicks/article.md
+++ b/2-ui/3-event-details/1-mouse-clicks/article.md
@@ -77,7 +77,7 @@
 Это событие срабатывает при клике правой кнопкой мыши:
 
 ```html
-<!--+ autorun height=80 -->
+<!--+ autorun height=80  no-beautify -->
 <div>Правый клик на этой кнопке выведет "Клик".</div>
 <button oncontextmenu="alert('Клик!');">Правый клик сюда</button>
 ```
@@ -89,7 +89,7 @@
 В примере ниже встроенное меню показано не будет:
 
 ```html
-<!--+ autorun height=60 -->
+<!--+ autorun height=60  no-beautify -->
 <button oncontextmenu="alert('Клик!');return false">Правый клик сюда</button>
 ```
 
@@ -116,7 +116,7 @@
 *!*
     if (!e.altKey || !e.shiftKey) return;
 */!*
-    alert('Ура!');
+    alert( 'Ура!' );
   }
 </script>
 ```
@@ -230,7 +230,7 @@
 ```js
 function fixWhich(e) {
   if (!e.which && e.button) { // если which нет, но есть button... (IE8-)
-    if (e.button & 1) e.which = 1;      // левая кнопка
+    if (e.button & 1) e.which = 1; // левая кнопка
     else if (e.button & 4) e.which = 2; // средняя кнопка
     else if (e.button & 2) e.which = 3; // правая кнопка
   }
@@ -247,13 +247,13 @@ function fixWhich(e) {
 
 ```js
 function fixPageXY(e) {
-  if (e.pageX == null && e.clientX != null ) { // если нет pageX..
+  if (e.pageX == null && e.clientX != null) { // если нет pageX..
     var html = document.documentElement;
     var body = document.body;
 
     e.pageX = e.clientX + (html.scrollLeft || body && body.scrollLeft || 0);
     e.pageX -= html.clientLeft || 0;
-    
+
     e.pageY = e.clientY + (html.scrollTop || body && body.scrollTop || 0);
     e.pageY -= html.clientTop || 0;
   }
diff --git a/2-ui/3-event-details/10-onload-ondomcontentloaded/article.md b/2-ui/3-event-details/10-onload-ondomcontentloaded/article.md
index 219db890..ec5bb970 100644
--- a/2-ui/3-event-details/10-onload-ondomcontentloaded/article.md
+++ b/2-ui/3-event-details/10-onload-ondomcontentloaded/article.md
@@ -33,14 +33,14 @@ document.addEventListener("DOMContentLoaded", ready);
 <!--+ run height=150 -->
 <script>
   function ready() {
-    alert('DOM готов');
-    alert("Размеры картинки: " + img.offsetWidth + "x" + img.offsetHeight);
+    alert( 'DOM готов' );
+    alert( "Размеры картинки: " + img.offsetWidth + "x" + img.offsetHeight );
   }
- 
+
 *!*
   document.addEventListener("DOMContentLoaded", ready);
 */!*
-</script>  
+</script>
 
 <img id="img" src="https://js.cx/clipart/yozhik.jpg?speed=1">
 ```
@@ -69,7 +69,7 @@ document.addEventListener("DOMContentLoaded", ready);
 
 ```html
 <link type="text/css" rel="stylesheet" href="style.css">
-<script>  
+<script>
   // сработает после загрузки style.css
 </script>
 ```
@@ -99,7 +99,7 @@ Firefox/Chrome/Opera автозаполняют формы по `DOMContentLoade
 <script>
 *!*
   window.onload = function() {
-    alert('Документ и все ресурсы загружены');
+    alert( 'Документ и все ресурсы загружены' );
   };
 */!*
 </script>
@@ -144,9 +144,9 @@ Firefox игнорирует текст, а всегда показывает с
 ```html
 <body>
   ...
-<script>
-  init();
-</script>
+  <script>
+    init();
+  </script>
 </body>
 ```
 
@@ -166,7 +166,7 @@ Firefox игнорирует текст, а всегда показывает с
 <script>
 *!*
   $(function() {
-    alert("DOMContentLoaded");
+    alert( "DOMContentLoaded" );
   });
 */!*
 </script>
diff --git a/2-ui/3-event-details/11-onload-onerror/3-script-callback/task.md b/2-ui/3-event-details/11-onload-onerror/3-script-callback/task.md
index 5e984aab..e20c2320 100644
--- a/2-ui/3-event-details/11-onload-onerror/3-script-callback/task.md
+++ b/2-ui/3-event-details/11-onload-onerror/3-script-callback/task.md
@@ -11,7 +11,7 @@
 ```js
 // go.js содержит функцию go()
 addScript("go.js", function() {
- go();
+  go();
 });
 ```
 
diff --git a/2-ui/3-event-details/11-onload-onerror/4-scripts-callback/task.md b/2-ui/3-event-details/11-onload-onerror/4-scripts-callback/task.md
index de6c4e6c..f286dfc2 100644
--- a/2-ui/3-event-details/11-onload-onerror/4-scripts-callback/task.md
+++ b/2-ui/3-event-details/11-onload-onerror/4-scripts-callback/task.md
@@ -9,6 +9,7 @@
 Пример использования:
 
 ```js
+//+ no-beautify
 addScripts(["a.js", "b.js", "c.js"], function() { a() });
 /* функция a() описана в a.js и использует b.js,c.js */
 ```
diff --git a/2-ui/3-event-details/11-onload-onerror/article.md b/2-ui/3-event-details/11-onload-onerror/article.md
index 0836272d..03b4bb41 100644
--- a/2-ui/3-event-details/11-onload-onerror/article.md
+++ b/2-ui/3-event-details/11-onload-onerror/article.md
@@ -39,9 +39,9 @@ document.body.appendChild(script);
 
 *!*
 script.onload = function() {
-  // после выполнения скрипта становится доступна функция _
-  alert(_); // её код
-}
+    // после выполнения скрипта становится доступна функция _
+    alert( _ ); // её код
+  }
 */!*
 ```
 
@@ -65,7 +65,7 @@ document.body.appendChild(script);
 
 *!*
 script.onerror = function() {
-  alert("Ошибка: " + this.src); 
+  alert( "Ошибка: " + this.src );
 };
 */!*
 ```
@@ -89,7 +89,7 @@ script.onerror = function() {
 Например, рабочий скрипт:
 
 ```js
-//+ run
+//+ run no-beautify
 var script = document.createElement('script');
 script.src = "https://code.jquery.com/jquery.js";
 document.documentElement.appendChild(script);
@@ -104,7 +104,7 @@ script.onreadystatechange = function() {
 Скрипт с ошибкой:
 
 ```js
-//+ run
+//+ run no-beautify
 var script = document.createElement('script');
 script.src = "http://ajax.googleapis.com/404.js";
 document.documentElement.appendChild(script);
@@ -132,7 +132,7 @@ script.onreadystatechange = function() {
 Пример ниже вызывает `afterLoad` после загрузки скрипта и работает только в IE:
 
 ```js
-//+ run
+//+ run no-beautify
 var script = document.createElement('script');
 script.src = "https://code.jquery.com/jquery.js";
 document.documentElement.appendChild(script);
@@ -176,7 +176,7 @@ script.src = "https://code.jquery.com/jquery.js";
 document.documentElement.appendChild(script);
 
 function afterLoad() {
-  alert("Загрузка завершена: " + typeof(jQuery));
+  alert( "Загрузка завершена: " + typeof(jQuery) );
 }
 
 script.onload = script.onerror = function() {
@@ -189,7 +189,9 @@ script.onload = script.onerror = function() {
 script.onreadystatechange = function() {
   var self = this;
   if (this.readyState == "complete" || this.readyState == "loaded") {
-    setTimeout(function() { self.onload() }, 0);// сохранить "this" для onload
+    setTimeout(function() {
+      self.onload()
+    }, 0); // сохранить "this" для onload
   }
 };
 ```
@@ -221,6 +223,7 @@ script.onreadystatechange = function() {
 <dd>Ставим обработчики на `onload` + `onerror`
 
 ```js
+//+ no-beautify
 var img = document.createElement('img');
 img.onload = function() { alert("Успех "+this.src };
 img.onerror = function() { alert("Ошибка "+this.src };
diff --git a/2-ui/3-event-details/2-unselectable/article.md b/2-ui/3-event-details/2-unselectable/article.md
index f037c744..66133de3 100644
--- a/2-ui/3-event-details/2-unselectable/article.md
+++ b/2-ui/3-event-details/2-unselectable/article.md
@@ -98,11 +98,15 @@
 ```html
 <!--+ autorun height=auto -->
 <style>
-b {
-  -webkit-user-select: none; /* user-select -- это нестандартное свойство */
-  -moz-user-select: none;    /* поэтому нужны префиксы */
-  -ms-user-select: none;    
-}
+  b {
+    -webkit-user-select: none;
+    /* user-select -- это нестандартное свойство */
+    
+    -moz-user-select: none;
+    /* поэтому нужны префиксы */
+    
+    -ms-user-select: none;
+  }
 </style>
 
 Строка до..
@@ -151,7 +155,7 @@ b {
 <li>Отмена действий на `mousedown` и `selectstart`:
 
 ```js
-elem.onmousedown = elem.onselectstart = function() { 
+elem.onmousedown = elem.onselectstart = function() {
   return false;
 };
 ```
@@ -171,7 +175,7 @@ elem.onmousedown = elem.onselectstart = function() {
 Если уж хочется запретить копирование -- можно использовать событие `oncopy`:
 
 ```html
-<!--+ autorun height=80 -->
+<!--+ autorun height=80  no-beautify -->
 <div oncopy="alert('Копирование запрещено');return false">
   Уважаемый копирователь, 
   почему-то автор хочет заставить вас покопаться в исходном коде этой страницы.
diff --git a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/2-hoverintent/task.md b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/2-hoverintent/task.md
index 3bb9a2d8..426d4d7d 100644
--- a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/2-hoverintent/task.md
+++ b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/2-hoverintent/task.md
@@ -24,7 +24,7 @@ tooltip.innerHTML = "Подсказка";
 
 // при "наведении на элемент" показать подсказку
 new HoverIntent({
-  elem: elem, 
+  elem: elem,
   over: function() {
     tooltip.style.left = this.getBoundingClientRect().left + 'px';
     tooltip.style.top = this.getBoundingClientRect().bottom + 5 + 'px';
diff --git a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/article.md b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/article.md
index 3dce9eb5..f28d33df 100644
--- a/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/article.md
+++ b/2-ui/3-event-details/3-mousemove-mouseover-mouseout-mouseenter-mouseleave/article.md
@@ -161,12 +161,12 @@
 
 ```js
 table.onmouseover = function(event) {
-  var target = event.target; 
+  var target = event.target;
   target.style.background = 'pink';
 };
 
 table.onmouseout = function(event) {
-  var target = event.target; 
+  var target = event.target;
   target.style.background = '';
 };
 ```
diff --git a/2-ui/3-event-details/4-drag-and-drop/article.md b/2-ui/3-event-details/4-drag-and-drop/article.md
index 80d22846..60316bcb 100644
--- a/2-ui/3-event-details/4-drag-and-drop/article.md
+++ b/2-ui/3-event-details/4-drag-and-drop/article.md
@@ -38,19 +38,19 @@ ball.onmousedown = function(e) { // 1. отследить нажатие*!*
 
   // подготовить к перемещению
   // 2. разместить на том же месте, но в абсолютных координатах*!*
-  ball.style.position = 'absolute'; 
+  ball.style.position = 'absolute';
   moveAt(e);
   // переместим в body, чтобы мяч был точно не внутри position:relative
-  document.body.appendChild(ball); 
+  document.body.appendChild(ball);
 
   ball.style.zIndex = 1000; // показывать мяч над другими элементами
-  
+
   // передвинуть мяч под координаты курсора 
   // и сдвинуть на половину ширины/высоты для центрирования
   function moveAt(e) {
-    ball.style.left = e.pageX - ball.offsetWidth/2 + 'px'; 
-    ball.style.top = e.pageY - ball.offsetHeight/2 + 'px'; 
-   }
+    ball.style.left = e.pageX - ball.offsetWidth / 2 + 'px';
+    ball.style.top = e.pageY - ball.offsetHeight / 2 + 'px';
+  }
 
   // 3, перемещать по экрану*!*
   document.onmousemove = function(e) {
@@ -78,8 +78,8 @@ ball.onmousedown = function(e) { // 1. отследить нажатие*!*
 Его нужно отключить:
 
 ```js
-ball.ondragstart = function() { 
-  return false; 
+ball.ondragstart = function() {
+  return false;
 };
 ```
 
@@ -106,8 +106,8 @@ ball.ondragstart = function() {
 В примерах выше мяч позиционируется в центре под курсором мыши:
 
 ```js
-self.style.left = e.pageX - ball.offsetWidth/2 + 'px';
-self.style.top = e.pageY - ball.offsetHeight/2 + 'px';
+self.style.left = e.pageX - ball.offsetWidth / 2 + 'px';
+self.style.top = e.pageY - ball.offsetHeight / 2 + 'px';
 ```
 
 Если поставить `left/top` ровно в `pageX/pageY`, то мячик прилипнет верхним-левым углом к курсору мыши. Будет некрасиво. Поэтому мы сдвигаем его на половину высоты/ширины, чтобы был центром под мышью. Уже лучше.
diff --git a/2-ui/3-event-details/5-drag-and-drop-objects/article.md b/2-ui/3-event-details/5-drag-and-drop-objects/article.md
index e4c236d4..3653dc8e 100644
--- a/2-ui/3-event-details/5-drag-and-drop-objects/article.md
+++ b/2-ui/3-event-details/5-drag-and-drop-objects/article.md
@@ -60,7 +60,7 @@
 Код обработчика `mousedown`:
 
 ```js
-var dragObject = {}; 
+var dragObject = {};
 
 document.onmousedown = function(e) {
 
@@ -103,8 +103,8 @@ document.onmousedown = function(e) {
 document.onmousemove = function(e) {
   if (!dragObject.elem) return; // элемент не зажат
 
-  if ( !dragObject.avatar ) { // элемент нажат, но пока не начали его двигать
-    ... начать перенос, присвоить dragObject.avatar = переносимый элемент
+  if (!dragObject.avatar) { // элемент нажат, но пока не начали его двигать
+    ...начать перенос, присвоить dragObject.avatar = переносимый элемент
   }
 
   ...отобразить перенос элемента...
@@ -131,7 +131,7 @@ document.onmousemove = function(e) {
 
 ```js
 // в начале переноса:
-if (avatar.parentNode != document.body) { 
+if (avatar.parentNode != document.body) {
   document.body.appendChild(avatar); // переместить в BODY, если надо
 }
 avatar.style.zIndex = 9999; // сделать, чтобы элемент был над другими
@@ -356,6 +356,7 @@ function findDroppable(event) {
 Для его создания используем не обычный синтаксис `{...}`, а вызов `new function`. Это позволит прямо при создании объявить дополнительные переменные и функции в замыкании, которыми могут пользоваться методы объекта, а также назначить обработчики:
 
 ```js
+//+ no-beautify
 var DragManager = new function() {
   
   var dragObject = {};
@@ -400,6 +401,7 @@ var DragManager = new function() {
 С использованием `DragManager` пример, с которого начиналась эта глава -- перенос иконок браузеров в компьютер, реализуется совсем просто:
 
 ```js
+//+ no-beautify
 DragManager.onDragEnd = function(dragObject, dropElem) {
 
   // скрыть/удалить переносимый объект
diff --git a/2-ui/3-event-details/6-mousewheel/article.md b/2-ui/3-event-details/6-mousewheel/article.md
index ca3c4331..dbd5cff2 100644
--- a/2-ui/3-event-details/6-mousewheel/article.md
+++ b/2-ui/3-event-details/6-mousewheel/article.md
@@ -9,7 +9,7 @@
 Несмотря на то, что колёсико мыши обычно ассоциируется с прокруткой, это совсем разные вещи.
 
 <ul>
-<li>При прокрутке срабатывает событие [onscroll](/event-onscroll) -- рассмотрим его в дальнейшем. Оно произойдёт *при любой прокрутке*, в том числе через клавиатурy, но *только на прокручиваемых элементах*. Например, элемент с `overflow:hidden` в принципе не может сгенерировать `onscroll`.</li>
+<li>При прокрутке срабатывает событие [onscroll](/onscroll) -- рассмотрим его в дальнейшем. Оно произойдёт *при любой прокрутке*, в том числе через клавиатурy, но *только на прокручиваемых элементах*. Например, элемент с `overflow:hidden` в принципе не может сгенерировать `onscroll`.</li>
 <li>А событие `wheel` является чисто "мышиным". Оно генерируется *над любым элементом* при передвижении колеса мыши. При этом не важно, прокручиваемый он или нет. В частности, `overflow:hidden` никак не препятствует обработке колеса мыши.</li>
 </ul>
 
@@ -39,16 +39,16 @@
 if (elem.addEventListener) {
   if ('onwheel' in document) {
     // IE9+, FF17+, Ch31+
-    elem.addEventListener ("wheel", onWheel);
+    elem.addEventListener("wheel", onWheel);
   } else if ('onmousewheel' in document) {
     // устаревший вариант события
-    elem.addEventListener ("mousewheel", onWheel);
+    elem.addEventListener("mousewheel", onWheel);
   } else {
     // Firefox < 17
-    elem.addEventListener ("MozMousePixelScroll", onWheel);
+    elem.addEventListener("MozMousePixelScroll", onWheel);
   }
 } else { // IE8-
-  elem.attachEvent ("onmousewheel", onWheel);
+  elem.attachEvent("onmousewheel", onWheel);
 }
 
 function onWheel(e) {
diff --git a/2-ui/3-event-details/7-fixevent/article.md b/2-ui/3-event-details/7-fixevent/article.md
index 62e46576..bc9eaf50 100644
--- a/2-ui/3-event-details/7-fixevent/article.md
+++ b/2-ui/3-event-details/7-fixevent/article.md
@@ -18,7 +18,7 @@
 elem.onclick = function(event) {
 *!*
   // если IE8-, то получить объект события window.event и исправить его
-  event = event || fixEvent.call(this, window.event); 
+  event = event || fixEvent.call(this, window.event);
 */!*
   ...
 }
@@ -40,11 +40,11 @@ function fixEvent(e) {
 
   e.currentTarget = this;
   e.target = e.srcElement;
-  
+
   if (e.type == 'mouseover' || e.type == 'mouseenter') e.relatedTarget = e.fromElement;
   if (e.type == 'mouseout' || e.type == 'mouseleave') e.relatedTarget = e.toElement;
-  
-  if (e.pageX == null && e.clientX != null ) {
+
+  if (e.pageX == null && e.clientX != null) {
     var html = document.documentElement;
     var body = document.body;
 
@@ -56,7 +56,7 @@ function fixEvent(e) {
   }
 
   if (!e.which && e.button) {
-    e.which = e.button & 1 ? 1 : ( e.button & 2 ? 3 : (e.button & 4 ? 2 : 0) );
+    e.which = e.button & 1 ? 1 : (e.button & 2 ? 3 : (e.button & 4 ? 2 : 0));
   }
 
   return e;
diff --git a/2-ui/3-event-details/8-onscroll/2-updown-button/solution.md b/2-ui/3-event-details/8-onscroll/2-updown-button/solution.md
index ae85065b..8fa8c587 100644
--- a/2-ui/3-event-details/8-onscroll/2-updown-button/solution.md
+++ b/2-ui/3-event-details/8-onscroll/2-updown-button/solution.md
@@ -47,7 +47,7 @@ window.onscroll = function() {
   var pageY = window.pageYOffset || document.documentElement.scrollTop;
   var innerHeight = document.documentElement.clientHeight;
 
-  switch(updownElem.className) {
+  switch (updownElem.className) {
     case '':
       if (pageY > innerHeight) {
         updownElem.className = 'up';
@@ -77,7 +77,7 @@ var pageYLabel = 0;
 updownElem.onclick = function() {
   var pageY = window.pageYOffset || document.documentElement.scrollTop;
 
-  switch(this.className) {
+  switch (this.className) {
     case 'up':
       pageYLabel = pageY;
       window.scrollTo(0, 0);
diff --git a/2-ui/3-event-details/8-onscroll/3-load-visible-img/solution.md b/2-ui/3-event-details/8-onscroll/3-load-visible-img/solution.md
index d43306ff..1608bab1 100644
--- a/2-ui/3-event-details/8-onscroll/3-load-visible-img/solution.md
+++ b/2-ui/3-event-details/8-onscroll/3-load-visible-img/solution.md
@@ -3,7 +3,7 @@
 Она должна срабатывать не только при прокрутке, но и при загрузке. Вполне достаточно для этого -- указать ее вызов в скрипте под страницей, вот так:
 
 ```js
-... страница ...
+...страница...
 
 function isVisible(elem) {
 
@@ -20,7 +20,7 @@ function isVisible(elem) {
 
 
 *!*
-showVisible(); 
+showVisible();
 window.onscroll = showVisible;
 */!*
 ```
diff --git a/2-ui/3-event-details/8-onscroll/article.md b/2-ui/3-event-details/8-onscroll/article.md
index df24ac01..da325c24 100644
--- a/2-ui/3-event-details/8-onscroll/article.md
+++ b/2-ui/3-event-details/8-onscroll/article.md
@@ -9,7 +9,7 @@
 
 ```js
 //+ autorun
-window.onscroll = function() { 
+window.onscroll = function() {
   var scrolled = window.pageYOffset || document.documentElement.scrollTop;
   document.getElementById('showScroll').innerHTML = scrolled + 'px';
 }
diff --git a/2-ui/3-event-details/9-keyboard-events/1-numeric-input/solution.md b/2-ui/3-event-details/9-keyboard-events/1-numeric-input/solution.md
index d7de0b52..35f6c937 100644
--- a/2-ui/3-event-details/9-keyboard-events/1-numeric-input/solution.md
+++ b/2-ui/3-event-details/9-keyboard-events/1-numeric-input/solution.md
@@ -17,8 +17,8 @@
 ```js
 input.onkeypress = function(e) {
   e = e || event;
-  
-  if (e.ctrlKey || e.altKey || e.metaKey) return;  
+
+  if (e.ctrlKey || e.altKey || e.metaKey) return;
 
   var chr = getChar(e);
 
@@ -26,7 +26,7 @@ input.onkeypress = function(e) {
   // т.к. например null >= '0' => true
   // на всякий случай лучше вынести проверку chr == null отдельно
   if (chr == null) return;
-  
+
   if (chr < '0' || chr > '9') {
     return false;
   }
diff --git a/2-ui/3-event-details/9-keyboard-events/2-check-sync-keydown/task.md b/2-ui/3-event-details/9-keyboard-events/2-check-sync-keydown/task.md
index d3884444..285e4f92 100644
--- a/2-ui/3-event-details/9-keyboard-events/2-check-sync-keydown/task.md
+++ b/2-ui/3-event-details/9-keyboard-events/2-check-sync-keydown/task.md
@@ -7,6 +7,7 @@
 Например, код ниже выведет `alert` при одновременном нажатии клавиш `"Q"` и `"W"` (в любом регистре, в любой раскладке)
 
 ```js
+//+ no-beautify
 runOnKeys(
   function() { alert("Привет!") }, 
   "Q".charCodeAt(0), 
diff --git a/2-ui/3-event-details/9-keyboard-events/article.md b/2-ui/3-event-details/9-keyboard-events/article.md
index 31ce098a..a0ea7019 100644
--- a/2-ui/3-event-details/9-keyboard-events/article.md
+++ b/2-ui/3-event-details/9-keyboard-events/article.md
@@ -79,15 +79,15 @@
 //+ autorun
 // event.type должен быть keypress
 function getChar(event) {
-  if (event.which == null) {  // IE
+  if (event.which == null) { // IE
     if (event.keyCode < 32) return null; // спец. символ
-    return String.fromCharCode(event.keyCode) 
-  } 
+    return String.fromCharCode(event.keyCode)
+  }
 
-  if (event.which!=0 && event.charCode!=0) { // все кроме IE
+  if (event.which != 0 && event.charCode != 0) { // все кроме IE
     if (event.which < 32) return null; // спец. символ
     return String.fromCharCode(event.which); // остальные
-  } 
+  }
 
   return null; // спец. символ
 }
@@ -179,18 +179,18 @@ function getChar(event) {
 ```html
 <input id="only-upper" type="text" size="2">
 <script>
-document.getElementById('only-upper').onkeypress = function(e) {  
-  // спец. сочетание - не обрабатываем  
-  if (e.ctrlKey || e.altKey || e.metaKey) return;
-  
-  var char = getChar(e);  
+  document.getElementById('only-upper').onkeypress = function(e) {
+    // спец. сочетание - не обрабатываем  
+    if (e.ctrlKey || e.altKey || e.metaKey) return;
 
-  if (!char) return; // спец. символ - не обрабатываем
-  
-  this.value = char.toUpperCase();
-  
-  return false;
-};
+    var char = getChar(e);
+
+    if (!char) return; // спец. символ - не обрабатываем
+
+    this.value = char.toUpperCase();
+
+    return false;
+  };
 </script>
 ```
 
diff --git a/2-ui/4-forms-controls/1-form-elements/1-add-select-option/solution.md b/2-ui/4-forms-controls/1-form-elements/1-add-select-option/solution.md
index cdf6dffb..4ec1dec3 100644
--- a/2-ui/4-forms-controls/1-form-elements/1-add-select-option/solution.md
+++ b/2-ui/4-forms-controls/1-form-elements/1-add-select-option/solution.md
@@ -12,12 +12,12 @@
 
   // 1) 
   var selectedOption = select.options[select.selectedIndex];
-  alert(selectedOption.value);
+  alert( selectedOption.value );
 
   // 2)
   var newOption = new Option("Classic", "Классика");
   select.appendChild(newOption);
- 
+
   // 3)
   newOption.selected = true;
 </script>
diff --git a/2-ui/4-forms-controls/1-form-elements/article.md b/2-ui/4-forms-controls/1-form-elements/article.md
index 6ad537e6..82f9280d 100644
--- a/2-ui/4-forms-controls/1-form-elements/article.md
+++ b/2-ui/4-forms-controls/1-form-elements/article.md
@@ -11,6 +11,7 @@
 Например:
 
 ```js
+//+ no-beautify
 document.forms.my -- форма с именем 'my'
 document.forms[0] -- первая форма в документе
 ```
@@ -24,18 +25,18 @@ document.forms[0] -- первая форма в документе
 ```html
 <!--+ run height=40 -->
 <body>
-<form name="my">
-  <input name="one" value="1">
-  <input name="two" value="2">
-</form>
+  <form name="my">
+    <input name="one" value="1">
+    <input name="two" value="2">
+  </form>
 
-<script>
-var form = document.forms.my; // можно document.forms[0]
+  <script>
+    var form = document.forms.my; // можно document.forms[0]
 
-var elem = form.elements.one;  // можно form.elements[0]
+    var elem = form.elements.one; // можно form.elements[0]
 
-alert(elem.value); // "один"
-</script>
+    alert( elem.value ); // "один"
+  </script>
 </body>
 ```
 
@@ -67,24 +68,25 @@ alert(elems[0].value); // 10, первый input
 ```html
 <!--+ run height=80 -->
 <body>
-<form>
-  <fieldset name="set"><legend>fieldset</legend>
+  <form>
+    <fieldset name="set">
+      <legend>fieldset</legend>
       <input name="text" type="text">
-  </fieldset>
-</form>
+    </fieldset>
+  </form>
 
-<script>
-var form = document.forms[0];
+  <script>
+    var form = document.forms[0];
 
-alert( form.elements.text ); // INPUT
+    alert( form.elements.text ); // INPUT
 *!*
-alert( form.elements.set.elements.text ); // INPUT
+    alert( form.elements.set.elements.text ); // INPUT
 */!*
-</script>
+  </script>
 </body>
 ```
 
-Спецификация: [HTML5 Forms](http://www.w3.org/TR/html5/forms.html).
+Спецификация: [HTML5 Forms](https://html.spec.whatwg.org/multipage/forms.html).
 
 [warn header="Доступ `form.name` тоже работает, но с особенностями"]
 Получить доступ к элементам формы можно не только через `form.elements[name/index]`, но и проще: `form[index/name]`.
@@ -95,19 +97,21 @@ alert( form.elements.set.elements.text ); // INPUT
 
 ```html
 <!--+ run height=40 -->
-<form name="myform"> <input name="text"> </form>
+<form name="myform">
+  <input name="text">
+</form>
 
 <script>
-var form = document.forms.myform;
+  var form = document.forms.myform;
 
-alert(form.elements.text == form.text); // true, это тот самый INPUT
+  alert( form.elements.text == form.text ); // true, это тот самый INPUT
 
-form.text.name = "new-name"; // меняем name ему
+  form.text.name = "new-name"; // меняем name ему
 
-// нет больше элемента с таким именем
-alert(form.elements.text); // undefined
+  // нет больше элемента с таким именем
+  alert( form.elements.text ); // undefined
 
-alert(form.text); //  INPUT (а должно быть undefined!)
+  alert( form.text ); //  INPUT (а должно быть undefined!)
 </script>
 ```
 
@@ -138,7 +142,7 @@ alert(elem.form == form); // true
 </body>
 ```
 
-Познакомиться с другими свойствами элементов можно в спецификации [HTML5 Forms](http://www.w3.org/TR/html5/forms.html).
+Познакомиться с другими свойствами элементов можно в спецификации [HTML5 Forms](https://html.spec.whatwg.org/multipage/forms.html).
 
 ## Элемент label
 
@@ -157,12 +161,20 @@ alert(elem.form == form); // true
 <!--+ autorun -->
 <table>
   <tr>
-    <td><label for="agree">Согласен с правилами</label></td>
-    <td><input id="agree" type="checkbox"></td>
+    <td>
+      <label for="agree">Согласен с правилами</label>
+    </td>
+    <td>
+      <input id="agree" type="checkbox">
+    </td>
   </tr>
   <tr>
-    <td><label for="not-a-robot">Я не робот</label></td>
-    <td><input id="not-a-robot" type="checkbox"></td>
+    <td>
+      <label for="not-a-robot">Я не робот</label>
+    </td>
+    <td>
+      <input id="not-a-robot" type="checkbox">
+    </td>
   </tr>
 </table>
 ```
@@ -171,7 +183,7 @@ alert(elem.form == form); // true
 <li>Завернуть элемент в `label`. В этом случае можно обойтись без дополнительных атрибутов:
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <label>Кликни меня <input type="checkbox"></label>
 ```
 
@@ -196,8 +208,8 @@ textarea.value = "Новый текст";
 **Текущее "отмеченное" состояние для `checkbox` и `radio` находится в свойстве `checked` (`true/false`).**
 
 ```js
-if (input.checked) { 
-  alert("Чекбокс выбран");
+if (input.checked) {
+  alert( "Чекбокс выбран" );
 }
 ```
 
@@ -242,13 +254,13 @@ for (var i=0; i<select.options.length; i++) {
 </script>
 ```
 
-Спецификация: <a href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-94282980">HTMLSelectElement</a>.
+Спецификация: [the select element](https://html.spec.whatwg.org/multipage/forms.html#the-select-element).
 
 [smart header="`new Option`"]
-В стандарте [the Option Element](http://dev.w3.org/html5/spec/the-option-element.html#the-option-element) есть любопытный короткий синтаксис для создания элемента с тегом `option`:
+В стандарте [the option element](https://html.spec.whatwg.org/multipage/forms.html#the-option-element) есть любопытный короткий синтаксис для создания элемента с тегом `option`:
 
 ```js
-option = new Option( text, value, defaultSelected, selected);
+option = new Option(text, value, defaultSelected, selected);
 ```
 
 Параметры:
@@ -261,7 +273,7 @@ option = new Option( text, value, defaultSelected, selected);
 Его можно использовать вместо `document.createElement('option')`, например:
 
 ```js
-var option = new Option("Текст", "value"); 
+var option = new Option("Текст", "value");
 // создаст <option value="value">Текст</option>
 ```
 
@@ -275,7 +287,7 @@ var option = new Option("Текст", "value", true, true);
 
 [smart header="Дополнительные свойства `option`"]
 
-У элементов `option` также есть особые свойства, которые могут оказаться полезными (см. [The Option Element](http://dev.w3.org/html5/spec/the-option-element.html#the-option-element)):
+У элементов `option` также есть особые свойства, которые могут оказаться полезными (см. [the option element](https://html.spec.whatwg.org/multipage/forms.html#the-option-element)):
 
 <dl>
 <dt>`selected`</dt>
diff --git a/2-ui/4-forms-controls/2-focus-blur/3-hotkeys/solution.md b/2-ui/4-forms-controls/2-focus-blur/3-hotkeys/solution.md
index cb0173e2..71bccf8b 100644
--- a/2-ui/4-forms-controls/2-focus-blur/3-hotkeys/solution.md
+++ b/2-ui/4-forms-controls/2-focus-blur/3-hotkeys/solution.md
@@ -5,7 +5,8 @@
 Так как мы преобразуем `<div>` в `<textarea>` и обратно, нам нужно сделать их практически одинаковыми с виду:
 
 ```css
-#view, #area {
+#view,
+#area {
   height: 150px;
   width: 400px;
   font-family: arial;
@@ -18,10 +19,11 @@
 Для того, чтобы сделать размер `#area` таким же, как и `#view`, добавим поля(padding):
 
 ```css
-#view {  
+#view {
   /* padding + border = 3px */
-  padding: 2px; 
-  border:1px solid black; 
+  
+  padding: 2px;
+  border: 1px solid black;
 }
 ```
 
@@ -29,16 +31,16 @@ CSS для `#area` заменяет поля границами:
 
 ```css
 #area {
-  border: 3px groove blue;  
+  border: 3px groove blue;
   padding: 0px;
-
-  display:none;
+  display: none;
 }
 ```
 
 По умолчанию, текстовое поле скрыто. Кстати, этот код убирает дополнительную рамку в ряде браузеров, которая появляется вокруг поля, когда на него попадает фокус:
 
 ```css
+/*+ no-beautify */
 #area:focus { 
   outline: none; /* убирает рамку при фокусе */
 }
@@ -77,21 +79,21 @@ document.onkeydown = function(e) {
 
 ```js
 function edit() {
-    view.style.display = 'none';
-    area.value = view.innerHTML;
-    area.style.display = 'block';
-    area.focus();
+  view.style.display = 'none';
+  area.value = view.innerHTML;
+  area.style.display = 'block';
+  area.focus();
 }
 
 function save() {
-    area.style.display = 'none';
-    view.innerHTML = area.value;
-    view.style.display = 'block';
+  area.style.display = 'none';
+  view.innerHTML = area.value;
+  view.style.display = 'block';
 }
 
 function cancel() {
-    area.style.display = 'none';
-    view.style.display = 'block';
+  area.style.display = 'none';
+  view.style.display = 'block';
 }
 ```
 
diff --git a/2-ui/4-forms-controls/2-focus-blur/7-capslock-warning-field/solution.md b/2-ui/4-forms-controls/2-focus-blur/7-capslock-warning-field/solution.md
index 576e2ede..c9c69646 100644
--- a/2-ui/4-forms-controls/2-focus-blur/7-capslock-warning-field/solution.md
+++ b/2-ui/4-forms-controls/2-focus-blur/7-capslock-warning-field/solution.md
@@ -46,8 +46,8 @@ document.onkeypress = function(e) {
 Например, когда пользователь открыл страницу, мы не знаем, включен ли [key CapsLock]. Затем, мы получаем событие `keydown` для [key CapsLock]. Но мы все равно не знаем его состояния, был ли [key CapsLock] *выключен* или, наоборот, включен.
 
 ```js
-if (navigator.platform.substr(0,3) != 'Mac') { // событие для CapsLock глючит под Mac
-  document.onkeydown = function(e) {  
+if (navigator.platform.substr(0, 3) != 'Mac') { // событие для CapsLock глючит под Mac
+  document.onkeydown = function(e) {
     if (e.keyCode == 20 && capsLockEnabled !== null) {
       capsLockEnabled = !capsLockEnabled;
     }
@@ -73,18 +73,18 @@ if (navigator.platform.substr(0,3) != 'Mac') { // событие для CapsLock
 Код проверки поля:
 
 ```html
-<input type="text" onkeyup="checkCapsWarning(event)" onfocus="checkCapsWarning(event)" onblur="removeCapsWarning()"/>
+<input type="text" onkeyup="checkCapsWarning(event)" onfocus="checkCapsWarning(event)" onblur="removeCapsWarning()" />
 
 <div style="display:none;color:red" id="caps">Внимание: нажат CapsLock!</div>
 
 <script>
-function checkCapsWarning() {
-  document.getElementById('caps').style.display = capsLockEnabled ? 'block' : 'none';
-}
+  function checkCapsWarning() {
+    document.getElementById('caps').style.display = capsLockEnabled ? 'block' : 'none';
+  }
 
-function removeCapsWarning() {
-  document.getElementById('caps').style.display = 'none';
-}
+  function removeCapsWarning() {
+    document.getElementById('caps').style.display = 'none';
+  }
 </script>
 ```
 
diff --git a/2-ui/4-forms-controls/2-focus-blur/article.md b/2-ui/4-forms-controls/2-focus-blur/article.md
index 7a6991f4..4350af5f 100644
--- a/2-ui/4-forms-controls/2-focus-blur/article.md
+++ b/2-ui/4-forms-controls/2-focus-blur/article.md
@@ -57,23 +57,32 @@
 
 ```html
 <!--+ run autorun height=80 -->
-<style> .error { background: red; } </style>
+<style>
+  .error {
+    background: red;
+  }
+</style>
 
-<div>Возраст: <input type="text" id="age"></div>
-  
-<div>Имя: <input type="text"></div>
+<div>Возраст:
+  <input type="text" id="age">
+</div>
+
+<div>Имя:
+  <input type="text">
+</div>
 
 <script>
-age.onblur = function() {
-  if (isNaN(this.value)) { // введено не число
-    // показать ошибку
-    this.classList.add("error");
-    age.focus();*!*
-  } else {
-    this.classList.remove("error");
-  }
-};
-
+  age.onblur = function() {
+    if (isNaN(this.value)) { // введено не число
+      // показать ошибку
+      this.classList.add("error");
+*!*
+      age.focus();
+*/!* 
+    } else {
+      this.classList.remove("error");
+    }
+  };
 </script>
 ```
 
@@ -117,7 +126,7 @@ age.onblur = function() {
 
 ```html
 <input type="text" name="search">
-<script> 
+<script>
   document.getElementsByName('search')[0].focus();
 </script>
 ```
@@ -175,7 +184,7 @@ age.onblur = function() {
 В примере ниже есть список элементов. Кликните на любой из них и нажмите "tab".
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 Кликните на первый элемент списка и нажмите Tab. Внимание! Дальнейшие нажатия Tab могут вывести за границы iframe'а с примером.
 <ul>
   <li tabindex="1">Один</li>
@@ -225,7 +234,11 @@ age.onblur = function() {
   <input type="text" name="surname" value="Ваша фамилия">
 </form>
 
-<style> .focused { outline: 1px solid red; } </style>
+<style>
+  .focused {
+    outline: 1px solid red;
+  }
+</style>
 
 <script>
 *!*
@@ -262,22 +275,29 @@ age.onblur = function() {
   <input type="text" name="surname" value="Ваша фамилия">
 </form>
 <style>
-.focused { outline: 1px solid red; }
+  .focused {
+    outline: 1px solid red;
+  }
 </style>
 
 <script>
-function onFormFocus() { this.className = 'focused'; }
-function onFormBlur() { this.className = ''; }
+  function onFormFocus() {
+    this.className = 'focused';
+  }
 
-var form = document.forms.form;
+  function onFormBlur() {
+    this.className = '';
+  }
 
-if (form.addEventListener) { 
-  form.addEventListener('focus', onFormFocus, true); 
-  form.addEventListener('blur', onFormBlur, true); 
-} else {  // IE8-
-  form.onfocusin = onFormFocus;
-  form.onfocusout = onFormBlur;
-}
+  var form = document.forms.form;
+
+  if (form.addEventListener) {
+    form.addEventListener('focus', onFormFocus, true);
+    form.addEventListener('blur', onFormBlur, true);
+  } else { // IE8-
+    form.onfocusin = onFormFocus;
+    form.onfocusout = onFormBlur;
+  }
 </script>
 ```
 
diff --git a/2-ui/4-forms-controls/3-events-change/article.md b/2-ui/4-forms-controls/3-events-change/article.md
index 72cc1474..a0b18054 100644
--- a/2-ui/4-forms-controls/3-events-change/article.md
+++ b/2-ui/4-forms-controls/3-events-change/article.md
@@ -36,11 +36,11 @@
 <!--+ autorun height=40 -->
 <input type="text"> oninput: <span id="result"></span>
 <script>
-var input = document.body.children[0];
+  var input = document.body.children[0];
 
-input.oninput = function() {
-  document.getElementById('result').innerHTML = input.value;
-};
+  input.oninput = function() {
+    document.getElementById('result').innerHTML = input.value;
+  };
 </script>
 ```
 
@@ -58,24 +58,24 @@ input.oninput = function() {
 <!--+ autorun height=40 -->
 <input type="checkbox"> Чекбокс с "onchange", работающим везде одинаково
 <script>
-var checkbox = document.body.children[0];
+  var checkbox = document.body.children[0];
 
-if("onpropertychange" in checkbox) { 
-  // старый IE
+  if ("onpropertychange" in checkbox) {
+    // старый IE
 *!*
-  checkbox.onpropertychange = function() {
-    // проверим имя изменённого свойства
-    if (event.propertyName == "checked") { 
-      alert(checkbox.checked);
-    }
-  };
+    checkbox.onpropertychange = function() {
+      // проверим имя изменённого свойства
+      if (event.propertyName == "checked") {
+        alert( checkbox.checked );
+      }
+    };
 */!*
-} else {
-  // остальные браузеры
-  checkbox.onchange = function() {
-    alert(checkbox.checked);
-  };
-}
+  } else {
+    // остальные браузеры
+    checkbox.onchange = function() {
+      alert( checkbox.checked );
+    };
+  }
 </script>
 ```
 
@@ -127,18 +127,17 @@ if("onpropertychange" in checkbox) {
 <!--+ autorun run height=60 -->
 <input type="text" id="sms"> символов: <span id="result"></span>
 <script>
+  function showCount() {
+    result.innerHTML = sms.value.length;
+  }
 
-function showCount() {
-  result.innerHTML = sms.value.length;
-}
-
-sms.onkeyup = sms.oninput = showCount;
-sms.onpropertychange = function() {
-  if (event.propertyName == "value") showCount();
-}
-sms.oncut = function() {
-  setTimeout(showCount, 0); // на момент oncut значение еще старое
-};
+  sms.onkeyup = sms.oninput = showCount;
+  sms.onpropertychange = function() {
+    if (event.propertyName == "value") showCount();
+  }
+  sms.oncut = function() {
+    setTimeout(showCount, 0); // на момент oncut значение еще старое
+  };
 </script>
 ```
 
@@ -153,26 +152,26 @@ sms.oncut = function() {
 <input type="text" id="sms"> символов: <span id="result"></span>
 
 <script>
-var timerId;
+  var timerId;
 
-sms.onfocus = function() {
+  sms.onfocus = function() {
 
-  var lastValue = sms.value;
-  timerId = setInterval(function() {
-    if (sms.value != lastValue) {
-      showCount();
-      lastValue = sms.value;
-    }
-  }, 20);
-};
+    var lastValue = sms.value;
+    timerId = setInterval(function() {
+      if (sms.value != lastValue) {
+        showCount();
+        lastValue = sms.value;
+      }
+    }, 20);
+  };
 
-sms.onblur = function() {
-  clearInterval(timerId);
-};
+  sms.onblur = function() {
+    clearInterval(timerId);
+  };
 
-function showCount() {
-  result.innerHTML = sms.value.length;
-}
+  function showCount() {
+    result.innerHTML = sms.value.length;
+  }
 </script>
 ```
 
diff --git a/2-ui/4-forms-controls/4-forms-submit/1-modal-dialog/task.md b/2-ui/4-forms-controls/4-forms-submit/1-modal-dialog/task.md
index 31b4bad9..ff5cd1a1 100644
--- a/2-ui/4-forms-controls/4-forms-submit/1-modal-dialog/task.md
+++ b/2-ui/4-forms-controls/4-forms-submit/1-modal-dialog/task.md
@@ -22,7 +22,7 @@
 
 ```js
 showPrompt("Введите что-нибудь<br>... умное :)", function(value) {
-  alert(value);
+  alert( value );
 });
 ```
 
diff --git a/2-ui/4-forms-controls/4-forms-submit/article.md b/2-ui/4-forms-controls/4-forms-submit/article.md
index a2f354da..fb9dcc6e 100644
--- a/2-ui/4-forms-controls/4-forms-submit/article.md
+++ b/2-ui/4-forms-controls/4-forms-submit/article.md
@@ -18,7 +18,7 @@
 Например, в таком HTML оба способа выведут `alert`, форма не будет отправлена:
 
 ```html
-<!--+ autorun height=80 -->
+<!--+ autorun height=80  no-beautify -->
 <form onsubmit="alert('submit!');return false">
   Первый: Enter в текстовом поле <input type="text" value="Текст"><br>
   Второй: Нажать на "Отправить": <input type="submit" value="Отправить">
diff --git a/2-ui/5-widgets/2-widgets-structure/1-clock/task.md b/2-ui/5-widgets/2-widgets-structure/1-clock/task.md
index 111b60be..1a89730e 100644
--- a/2-ui/5-widgets/2-widgets-structure/1-clock/task.md
+++ b/2-ui/5-widgets/2-widgets-structure/1-clock/task.md
@@ -12,7 +12,7 @@ var clock = new Clock({
 });
 
 clock.start(); // старт
-clock.stop();  // стоп
+clock.stop(); // стоп
 ```
 
 Остальные методы, если нужны, должны быть приватными.
diff --git a/2-ui/5-widgets/2-widgets-structure/6-voter-add-step/task.md b/2-ui/5-widgets/2-widgets-structure/6-voter-add-step/task.md
index d524af47..a0e71be3 100644
--- a/2-ui/5-widgets/2-widgets-structure/6-voter-add-step/task.md
+++ b/2-ui/5-widgets/2-widgets-structure/6-voter-add-step/task.md
@@ -9,7 +9,7 @@
 ```js
 var voter = new StepVoter({
   elem: document.getElementById('voter'),
-  step: 2  // увеличивать/уменьшать сразу на 2 пункта
+  step: 2 // увеличивать/уменьшать сразу на 2 пункта
 });
 ```
 
diff --git a/2-ui/5-widgets/2-widgets-structure/article.md b/2-ui/5-widgets/2-widgets-structure/article.md
index 68ee24dd..b7ad7507 100644
--- a/2-ui/5-widgets/2-widgets-structure/article.md
+++ b/2-ui/5-widgets/2-widgets-structure/article.md
@@ -47,7 +47,9 @@
 function Menu(options) {
   var elem = options.elem;
 
-  elem.onmousedown = function() { return false; }
+  elem.onmousedown = function() {
+    return false;
+  }
 
   elem.onclick = function(event) {
     if (event.target.closest('.title')) {
@@ -127,7 +129,9 @@ if (event.target.closest('.title')) {
 function Menu(options) {
   var elem = options.elem;
 
-  elem.onmousedown = function() { return false; }
+  elem.onmousedown = function() {
+    return false;
+  }
 
   elem.onclick = function(event) {
     if (event.target.closest('.title')) {
@@ -173,7 +177,7 @@ menu.toggle();
 *!*
 // создать объект меню с данным заголовком и опциями
 */!*
-var menu = new Menu({ 
+var menu = new Menu({
   title: "Сладости",
   items: [
     "Торт",
@@ -215,8 +219,8 @@ function Menu(options) {
     titleElem.className = "title";
     titleElem.textContent = options.title;
 
-    elem.onmousedown = function() { 
-      return false; 
+    elem.onmousedown = function() {
+      return false;
     };
 
     elem.onclick = function(event) {
diff --git a/2-ui/5-widgets/3-widgets-markup/1-semantic-menu/task.md b/2-ui/5-widgets/3-widgets-markup/1-semantic-menu/task.md
index 89451c70..6f18ba14 100644
--- a/2-ui/5-widgets/3-widgets-markup/1-semantic-menu/task.md
+++ b/2-ui/5-widgets/3-widgets-markup/1-semantic-menu/task.md
@@ -22,10 +22,8 @@
   float: left;
   padding: 6px;
   margin: 0 2px;
-
   border: 1px solid gray;
   border-radius: 10px;
-
   cursor: pointer;
   font-size: 90%;
   background: #FFF5EE;
diff --git a/2-ui/5-widgets/3-widgets-markup/article.md b/2-ui/5-widgets/3-widgets-markup/article.md
index e4af5c7d..dede3878 100644
--- a/2-ui/5-widgets/3-widgets-markup/article.md
+++ b/2-ui/5-widgets/3-widgets-markup/article.md
@@ -102,7 +102,7 @@ HTML-разметка и названия CSS-классов должны отр
 Рассмотрим пример вёрстки "диалогового окна":
 
 ```html
-<!--+ autorun height=100 -->
+<!--+ autorun height=100  no-beautify -->
 <div class="dialog">
   <h2 class="title">Заголовок</h2>
   <div class="content">
diff --git a/2-ui/5-widgets/4-template-lodash/1-table-template/task.md b/2-ui/5-widgets/4-template-lodash/1-table-template/task.md
index fcdf5b5b..e3f9fc0c 100644
--- a/2-ui/5-widgets/4-template-lodash/1-table-template/task.md
+++ b/2-ui/5-widgets/4-template-lodash/1-table-template/task.md
@@ -5,6 +5,7 @@
 Есть данные:
 
 ```js
+//+ no-beautify
 var users = [
   {name: "Вася", age: 10},
   {name: "Петя", age: 15},
diff --git a/2-ui/5-widgets/4-template-lodash/3-menu-template/task.md b/2-ui/5-widgets/4-template-lodash/3-menu-template/task.md
index d98a2d1f..c30c95af 100644
--- a/2-ui/5-widgets/4-template-lodash/3-menu-template/task.md
+++ b/2-ui/5-widgets/4-template-lodash/3-menu-template/task.md
@@ -8,14 +8,14 @@
 <li>Вместо массива `items` меню должно принимать *объект* `items`, вот так:
 
 ```js
-var menu = new Menu({ 
+var menu = new Menu({
   title: "Сладости",
   template: _.template(document.getElementById('menu-template').innerHTML),
   listTemplate: _.template(document.getElementById('menu-list-template').innerHTML),
 *!*
   items: {
-    "donut": "Пончик", 
-    "cake": "Пирожное", 
+    "donut": "Пончик",
+    "cake": "Пирожное",
     "chocolate": "Шоколадка"
   }
 */!*
diff --git a/2-ui/5-widgets/4-template-lodash/article.md b/2-ui/5-widgets/4-template-lodash/article.md
index 07baab81..57709744 100644
--- a/2-ui/5-widgets/4-template-lodash/article.md
+++ b/2-ui/5-widgets/4-template-lodash/article.md
@@ -13,6 +13,7 @@
 Ранее мы уже видели код `Menu`, который сам создаёт свой элемент:
 
 ```js
+//+ no-beautify
 function Menu(options) {
   // ... приведены только методы для генерации DOM ...
 
@@ -66,6 +67,7 @@ function Menu(options) {
 Пример шаблона для меню:
 
 ```html
+<!--+ no-beautify -->
 <div class="menu">
   <span class="title"><%-title%></span>
   <ul>
@@ -87,7 +89,7 @@ function Menu(options) {
 // сгенерировать HTML, используя шаблон tmpl (см. выше) 
 // с данными title и items
 */!*
-var html = _.template(tmpl)({ 
+var html = _.template(tmpl)({
   title: "Сладости",
   items: [
     "Торт",
@@ -180,7 +182,7 @@ alert( tmpl(data) ); // <span class="title">Заголовок</span>
 Например, вот шаблон для генерации списка от `1` до `count`:
 
 ```js
-//+ run
+//+ run no-beautify
 // используется \, чтобы объявить многострочную переменную-текст шаблона
 var tmpl = '<ul>\
   <% for (var i=1; i<=count; i++) { %> \
@@ -257,12 +259,13 @@ var template = document.getElementById('menu-template').innerHTML;
 //+ run
 var compiled = _.template("<h1><%=title%></h1>");
 
-alert( compiled ); 
+alert( compiled );
 ```
 
 Функция `compiled`, которую вернул вызов `_template` из этого примера, выглядит примерно так:
 
 ```js
+//+ no-beautify
 function(obj) { 
   obj || (obj = {}); 
   var __t, __p = '', __e = _.escape; 
@@ -297,7 +300,7 @@ function(obj) {
 Например:
 
 ```js
-//+ run
+//+ run no-beautify
 alert( _.template("<h1><%=menu.title%></h1>", {variable: "menu"}) );
 ```
 
@@ -331,6 +334,7 @@ function(*!*menu*/!*) {
 HTML (шаблоны):
 
 ```html
+<!--+ no-beautify -->
 <script type="text/template" id="menu-template">
 <div class="menu">
   <span class="title"><%-title%></span>
@@ -349,13 +353,13 @@ HTML (шаблоны):
 JS для создания меню:
 
 ```js
-var menu = new Menu({ 
+var menu = new Menu({
   title: "Сладости",
 *!*
   // передаём также шаблоны
 */!*
-  template: _.template( document.getElementById('menu-template').innerHTML),
-  listTemplate: _.template( document.getElementById('menu-list-template').innerHTML),
+  template: _.template(document.getElementById('menu-template').innerHTML),
+  listTemplate: _.template(document.getElementById('menu-list-template').innerHTML),
   items: [
     "Торт",
     "Пончик",
@@ -380,7 +384,9 @@ function Menu(options) {
   }
 
   function render() {
-    var html = options.template({title: options.title});
+    var html = options.template({
+      title: options.title
+    });
 
     elem = document.createElement('div');
     elem.innerHTML = html;
@@ -399,8 +405,10 @@ function Menu(options) {
 
   function renderItems() {
     if (elem.querySelector('ul')) return;
-    
-    var listHtml = options.listTemplate({items: options.items});
+
+    var listHtml = options.listTemplate({
+      items: options.items
+    });
     elem.insertAdjacentHTML("beforeEnd", listHtml);
   }
 
@@ -432,6 +440,7 @@ function Menu(options) {
 Здесь два шаблона. Первый мы уже разобрали, посмотрим теперь на список `ul/li`:
 
 ```html
+<!--+ no-beautify -->
 <ul>
   <% items.forEach(function(item) { %>
   <li><%-item%></li>
@@ -453,6 +462,7 @@ function Menu(options) {
 Вот функция, которую возвратит `_.template(tmpl)` для этого шаблона:
 
 ```js
+//+ no-beautify
 function(obj) {
   obj || (obj = {});
   var __t, __p = '', __e = _.escape;
@@ -485,7 +495,7 @@ function(obj) {
 Попробуйте сами запустить пример с открытыми инструментами разработчика и *включённой* опцией "остановка при ошибке":
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.2.0/lodash.js"></script>
 
 <script type="text/template" id="menu-template">
@@ -523,6 +533,7 @@ function(obj) {
 Это, конечно, лучше чем ничего, но, как правило, его имеет смысл заменить `sourceURL` на свой, указав при компиляции дополнительный параметр `sourceURL`:
 
 ```js
+//+ no-beautify
 ...
 var compiled = _.template(tmpl, {sourceURL: '/template/menu-template'});
 ...
diff --git a/2-ui/5-widgets/5-custom-events/1-voter-events/task.md b/2-ui/5-widgets/5-custom-events/1-voter-events/task.md
index 07a130d9..5c5692dd 100644
--- a/2-ui/5-widgets/5-custom-events/1-voter-events/task.md
+++ b/2-ui/5-widgets/5-custom-events/1-voter-events/task.md
@@ -14,7 +14,7 @@ var voter = new Voter({
 voter.setVote(5);
 
 document.getElementById('voter').addEventListener('change', function(e) {
-  alert(e.detail); // новое значение голоса
+  alert( e.detail ); // новое значение голоса
 });
 ```
 
diff --git a/2-ui/5-widgets/5-custom-events/4-slider-events/solution.md b/2-ui/5-widgets/5-custom-events/4-slider-events/solution.md
index 94c33f0e..41af4b10 100644
--- a/2-ui/5-widgets/5-custom-events/4-slider-events/solution.md
+++ b/2-ui/5-widgets/5-custom-events/4-slider-events/solution.md
@@ -12,7 +12,7 @@
 Соответственно, ширина области изменения будет `sliderElem.clientWidth - thumbElem.clientWidth`. Далее её можно уже поделить на части, количество пикселей на значение будет:
 
 ```js
-pixelsPerValue = (sliderElem.clientWidth-thumbElem.clientWidth) / max;
+pixelsPerValue = (sliderElem.clientWidth - thumbElem.clientWidth) / max;
 ```
 
 Может получиться так, что это значение будет дробным, меньше единицы. Например, если `max = 1000`, а ширина слайдера `110` (пробег 100), то будет `0.1` пикселя на значение. 
@@ -23,7 +23,7 @@ pixelsPerValue = (sliderElem.clientWidth-thumbElem.clientWidth) / max;
 
 ```js
 function positionToValue(left) {
-  return Math.round( left / pixelsPerValue);
+  return Math.round(left / pixelsPerValue);
 }
 
 function valueToPosition(value) {
diff --git a/2-ui/5-widgets/5-custom-events/4-slider-events/task.md b/2-ui/5-widgets/5-custom-events/4-slider-events/task.md
index bfb371cc..1b07254c 100644
--- a/2-ui/5-widgets/5-custom-events/4-slider-events/task.md
+++ b/2-ui/5-widgets/5-custom-events/4-slider-events/task.md
@@ -8,7 +8,7 @@
 
 ```js
 var slider = new Slider({
-  elem: document.getElementById('slider'), 
+  elem: document.getElementById('slider'),
   max: 100 // слайдер на самой правой позиции соответствует 100
 });
 ```
diff --git a/2-ui/5-widgets/5-custom-events/article.md b/2-ui/5-widgets/5-custom-events/article.md
index ddbdd7c9..049474f5 100644
--- a/2-ui/5-widgets/5-custom-events/article.md
+++ b/2-ui/5-widgets/5-custom-events/article.md
@@ -13,6 +13,7 @@
 Например, мы можем добавить в `options` для `Menu` новый параметр -- функцию `onselect`, которая будет вызываться при выборе пункта меню:
 
 ```js
+//+ no-beautify
 var menu = new Menu({ 
   title: "Сладости",
   template: _.template(document.getElementById('menu-template').innerHTML),
@@ -37,6 +38,7 @@ function showSelected(href) {
 В коде меню нужно будет вызывать её, например так:
 
 ```js
+//+ no-beautify
 ...
   function select(link) {
     options.onselect(link.getAttribute('href').slice(1));
@@ -58,6 +60,7 @@ function showSelected(href) {
 Для этого модифицируем функцию `select`:
 
 ```js
+//+ no-beautify
 function Menu(options) {
   ...
 
@@ -84,7 +87,7 @@ var menu = new Menu(...);
 var elem = menu.getElem();
 
 elem.addEventListener('select', function(event) {
-  alert(event.detail);
+  alert( event.detail );
 });
 ```
 
diff --git a/3-webcomponents/2-webcomponent-core/article.md b/3-webcomponents/2-webcomponent-core/article.md
index 7bd2b6f3..4c350277 100644
--- a/3-webcomponents/2-webcomponent-core/article.md
+++ b/3-webcomponents/2-webcomponent-core/article.md
@@ -77,7 +77,7 @@
 В примере ниже регистрация элемента происходит через 2 секунды после его появления в разметке:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <style>
 *!*
   /* стиль для :unresolved элемента (до регистрации) */
@@ -192,7 +192,7 @@ var timer = document.createElement("button", "my-timer");
 <script>
   var MyTimerProto = Object.create(HTMLElement.prototype);
 
-  MyTimerProto.tick = function() { 
+  MyTimerProto.tick = function() {
     this.timer++;
     this.innerHTML = this.timer;
   };
@@ -209,7 +209,7 @@ var timer = document.createElement("button", "my-timer");
   };
 */!*
 
-  document.registerElement("my-timer", { 
+  document.registerElement("my-timer", {
     prototype: MyTimerProto
   });
 </script>
diff --git a/3-webcomponents/3-shadow-dom/article.md b/3-webcomponents/3-shadow-dom/article.md
index 0a32ebc3..c1951721 100644
--- a/3-webcomponents/3-shadow-dom/article.md
+++ b/3-webcomponents/3-shadow-dom/article.md
@@ -21,7 +21,7 @@
 В Shadow DOM выше можно увидеть полезный атрибут `pseudo`. Он нестандартный, существует по историческим причинам. С его помощью можно стилизовать подэлементы через CSS, например, сделаем поле редактирования даты красным:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <style>
 *!*
 input::-webkit-datetime-edit {
@@ -92,7 +92,7 @@ Shadow DOM примера выше в инструментах разработ
 Например:
 
 ```html
-<!--+ run autorun="no-epub" -->
+<!--+ run autorun="no-epub"  no-beautify -->
   
 <section id="elem">
   <h1>Новости</h1>
@@ -145,11 +145,11 @@ Shadow DOM примера выше в инструментах разработ
 *!*
   // прочитать данные из Shadow DOM для elem
 */!*
-  var root = elem.shadowRoot; 
+  var root = elem.shadowRoot;
   // Привет из подполья!
-  document.write("<p>p:" + root.querySelector('p').innerHTML); 
+  document.write("<p>p:" + root.querySelector('p').innerHTML);
   // пусто, так как физически узлы - вне content 
-  document.write("<p>content:" + root.querySelector('content').innerHTML); 
+  document.write("<p>content:" + root.querySelector('content').innerHTML);
 </script>
 ```
 
diff --git a/3-webcomponents/4-template-tag/article.md b/3-webcomponents/4-template-tag/article.md
index 221c1bec..de6ec309 100644
--- a/3-webcomponents/4-template-tag/article.md
+++ b/3-webcomponents/4-template-tag/article.md
@@ -19,18 +19,20 @@
 
 ```html
 <!--+ run autorun="no-epub" -->
-  
-<p id="elem">Доброе утро, страна!</p>
+<p id="elem">
+  Доброе утро, страна!</p>
 
 <template id="tmpl">
-  <h3><content></content></h3> 
+  <h3><content></content></h3>
   <p>Привет из подполья!</p>
-  <script> document.write('...document.write:Новость!'); </script>
+  <script>
+    document.write('...document.write:Новость!');
+  </script>
 </template>
 
 <script>
   var root = elem.createShadowRoot();
-  root.appendChild( tmpl.content.cloneNode(true) );
+  root.appendChild(tmpl.content.cloneNode(true));
 </script>
 ```
 
diff --git a/3-webcomponents/5-css-scoping/article.md b/3-webcomponents/5-css-scoping/article.md
index ecb2e890..0e4f68ae 100644
--- a/3-webcomponents/5-css-scoping/article.md
+++ b/3-webcomponents/5-css-scoping/article.md
@@ -17,15 +17,19 @@
 
 <template id="tmpl">
 *!*
-  <style> p { color: red; } </style>
+  <style>
+    p {
+      color: red;
+    }
+  </style>
 */!*
-  <h3><content></content></h3> 
+  <h3><content></content></h3>
   <p>Привет из подполья!</p>
 </template>
 
 <script>
   var root = elem.createShadowRoot();
-  root.appendChild( tmpl.content.cloneNode(true) );
+  root.appendChild(tmpl.content.cloneNode(true));
 </script>
 ```
 
@@ -52,15 +56,17 @@
 ```html
 <!--+ run -->
 <style>
-#elem::shadow span {
-  /* для span только внутри Shadow DOM #elem */
-  border-bottom: 1px dashed blue;    
-}
-
-#elem >>> * {
-  /* для всех элементов внутри Shadow DOM #elem и далее внутри input[type=date] */
-  color: red; 
-}
+  #elem::shadow span {
+    /* для span только внутри Shadow DOM #elem */
+    
+    border-bottom: 1px dashed blue;
+  }
+  
+  #elem >>> * {
+    /* для всех элементов внутри Shadow DOM #elem и далее внутри input[type=date] */
+    
+    color: red;
+  }
 </style>
 
 <p id="elem"></p>
@@ -108,11 +114,11 @@
 <script>
   var root = elem.createShadowRoot();
   root.innerHTML = "<span>Текущее время:</span> <input type='date'>";
-  
+
   // выберет только span из #elem
   // вообще-то, должен выбрать span и из вложенных Shadow DOM,
   // но для встроенных элементов - не умеет
-  alert(document.querySelectorAll('#elem::shadow span').length); // 1
+  alert( document.querySelectorAll('#elem::shadow span').length ); // 1
 </script>
 ```
 [/warn]
@@ -131,8 +137,10 @@
 После `:host` мы можем указать селекторы и стили, которые нужно применить, если хозяин удовлетворяет тому или иному условию, например:
 
 ```html
-<style> 
-  :host > p { color: green; } 
+<style>
+  :host > p {
+    color: green;
+  }
 </style>
 ```
 Этот селектор сработает для `<p>` первого уровня внутри Shadow DOM.
@@ -142,8 +150,13 @@
 Этот селектор используется для темизации хозяина "изнутри", в зависимости от его классов и атрибутов. Он отлично добавляет просто `:host`, например:
 
 ```css
-:host p { color: green; } 
-:host(.important) p { color: red; } 
+:host p {
+  color: green;
+}
+
+:host(.important) p {
+  color: red;
+}
 ```
 
 Здесь параграфы будут иметь `color:green`, но если у хозяина класс `.important`, то `color:red`.
@@ -163,7 +176,7 @@
 Пример использования селектора `:host()` для разной расцветки Shadow DOM-сообщения, в зависимости от того, в каком оно `<p>`:
 
 ```html
-<!--+ run autorun="no-epub" -->
+<!--+ run autorun="no-epub"  no-beautify -->
 *!*
 <p class="message info">Доброе утро, страна!</p>
 */!*
@@ -215,7 +228,7 @@ elems[1].createShadowRoot().appendChild( tmpl.content.cloneNode(true) );
 Например, здесь применится стиль для `<span>`:
 
 ```html
-<!--+ run autorun="no-epub" -->
+<!--+ run autorun="no-epub"  no-beautify -->
 <style>
 *!*
   span { text-decoration: underline; }
@@ -247,7 +260,7 @@ elems[1].createShadowRoot().appendChild( tmpl.content.cloneNode(true) );
 В примере ниже селектор `::content span` стилизует все `<span>` внутри всех `<content>`:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <style>
 *!*
   span { text-decoration: underline; }
diff --git a/3-webcomponents/6-link-import/article.md b/3-webcomponents/6-link-import/article.md
index fe4d6dfd..56efe8ef 100644
--- a/3-webcomponents/6-link-import/article.md
+++ b/3-webcomponents/6-link-import/article.md
@@ -102,6 +102,7 @@
 <li>Главный файл `index.html` подключает документы:
 
 ```html
+<!--+ no-beautify -->
 <link rel="import" href="ui-tabs.html">
 <link rel="import" href="ui-dialog.html">
 ...
@@ -111,6 +112,7 @@
 <li>`ui-tabs.html` подключает `libs.html`:
 
 ```html
+<!--+ no-beautify -->
 <link rel="import" href="libs.html">
 ...template и код для табов...
 ```
@@ -120,6 +122,7 @@
 <li>`ui-dialog.html` также использует `libs.html`:
 
 ```html
+<!--+ no-beautify -->
 <link rel="import" href="libs.html">
 ...template и код для диалогов...
 ```
diff --git a/3-webcomponents/7-webcomponent-build/article.md b/3-webcomponents/7-webcomponent-build/article.md
index 8366fceb..aeace7be 100644
--- a/3-webcomponents/7-webcomponent-build/article.md
+++ b/3-webcomponents/7-webcomponent-build/article.md
@@ -38,29 +38,31 @@
 ```html
 <template id="tmpl">
   <style>
-  .content {  
-    min-height: 20px;
-    padding: 19px;
-    margin-bottom: 20px;
-    background-color: #f5f5f5;
-    border: 1px solid #e3e3e3;
-    border-radius: 4px;
-    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
-  }
-
-  :host { 
-    display: block;
-  }
-
-  :host(.info) .content {
-    color: green;
-  }
-  
-  :host(.warning) .content {
-    color: red;
-  }
+    .content {
+      min-height: 20px;
+      padding: 19px;
+      margin-bottom: 20px;
+      background-color: #f5f5f5;
+      border: 1px solid #e3e3e3;
+      border-radius: 4px;
+      box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
+    }
+    
+    :host {
+      display: block;
+    }
+    
+    :host(.info) .content {
+      color: green;
+    }
+    
+    :host(.warning) .content {
+      color: red;
+    }
   </style>
-  <div class="content"><content></content></div>
+  <div class="content">
+    <content></content>
+  </div>
 </template>
 ```
 
@@ -123,12 +125,12 @@ document.registerElement('ui-message', {
 <link rel="import" id="link" href="ui-slider.html">
 
 <ui-slider min="0" max="1000" id="elem"></ui-slider>
-    
+
 <script>
   elem.addEventListener("slide", function(e) {
-    value.innerHTML = e.detail.value; 
+    value.innerHTML = e.detail.value;
   });
-</script>    
+</script>
 
 <div id="value">0</div>
 ```
@@ -171,8 +173,7 @@ document.registerElement('ui-message', {
 <template id="tmpl">
   <style>
     @import url(http://code.jquery.com/ui/1.11.3/themes/ui-lightness/jquery-ui.css);
-
-    :host { 
+    :host {
       display: block;
     }
   </style>
@@ -198,7 +199,7 @@ SliderProto.createdCallback = function() {
   root.appendChild(tmpl.content.cloneNode(true));
 
   this.$slider = $(root.getElementById('slider'));
-  
+
   var self = this;
 
   // (2) инициализовать слайдер, пробросить параметры
@@ -206,10 +207,12 @@ SliderProto.createdCallback = function() {
     min: this.getAttribute('min') || 0,
     max: this.getAttribute('max') || 100,
     value: this.getAttribute('value') || 0,
-    slide: function() {  
+    slide: function() {
       // (3) пробросить событие
       var event = new CustomEvent("slide", {
-        detail: { value: self.$slider.slider("option", "value") },
+        detail: {
+          value: self.$slider.slider("option", "value")
+        },
         bubbles: true
       });
       self.dispatchEvent(event);
@@ -258,10 +261,13 @@ Object.defineProperty(SliderProto, 'value', {
 Он был в методе [offset](http://api.jquery.com/offset/), который предназначен для того, чтобы определять координаты элемента. Этот метод не срабатывал, поскольку в нём есть проверка, которая выглядит примерно так:
 
 ```js
-var box = { top: 0, left: 0 };
+var box = {
+  top: 0,
+  left: 0
+};
 ...
 // Make sure it's not a disconnected DOM node
-if ( !jQuery.contains( elem.ownerDocument, elem ) ) {
+if(!jQuery.contains(elem.ownerDocument, elem)) {
   return box;
 }
 ```
diff --git a/3-webcomponents/index.md b/3-webcomponents/index.md
index 596b06e0..15233485 100644
--- a/3-webcomponents/index.md
+++ b/3-webcomponents/index.md
@@ -1,5 +1,3 @@
 # Веб-компоненты: взгляд в будущее
 
-Веб-компоненты -- "платформа будущего": совокупность стандартов, которые позволяют описывать "свои теги" -- новые типы DOM-элементов, со своими свойствами и методами, инкапсулировать их DOM и стили.
-
-Современные браузеры поддерживают их частично.
\ No newline at end of file
+Веб-компоненты -- "платформа будущего": совокупность стандартов, которые позволяют описывать новые типы DOM-элементов, со своими свойствами и методами, инкапсулировать их DOM и стили.
\ No newline at end of file
diff --git a/4-ajax/10-ajax-jsonp/article.md b/4-ajax/10-ajax-jsonp/article.md
index 9fdf1880..5615ca61 100644
--- a/4-ajax/10-ajax-jsonp/article.md
+++ b/4-ajax/10-ajax-jsonp/article.md
@@ -24,7 +24,7 @@ addScript('user?id=123');
 
 Такой вызов добавит в `HEAD` документа тег:
 
-```js
+```html
 <script src="/user?id=123"></script>
 ```
 
@@ -38,6 +38,7 @@ addScript('user?id=123');
 
 
 ```js
+//+ no-beautify
 // ответ сервера
 var user = {name: "Вася", age: 25 };
 ```
@@ -127,11 +128,11 @@ onUserData({
 Пример использования:
 ```js
 function ok(data) {
-  alert("Загружен пользователь " + data.name);
+  alert( "Загружен пользователь " + data.name );
 }
 
 function fail(url) {
-  alert('Ошибка при запросе ' + url);
+  alert( 'Ошибка при запросе ' + url );
 }
 
 // Внимание! Ответы могут приходить в любой последовательности!
diff --git a/4-ajax/11-server-sent-events/article.md b/4-ajax/11-server-sent-events/article.md
index 232e5ea1..36240aa2 100644
--- a/4-ajax/11-server-sent-events/article.md
+++ b/4-ajax/11-server-sent-events/article.md
@@ -118,6 +118,7 @@ id: 3
 У объекта `EventSource` есть свойство `readyState`, которое содержит одно из значений (выдержка из стандарта):
 
 ```js
+//+ no-beautify
 const unsigned short CONNECTING = 0; // в процессе (пере-)соединения 
 const unsigned short OPEN = 1;       // соединение установлено
 const unsigned short CLOSED = 2;     // соединение закрыто
@@ -144,7 +145,7 @@ eventSource.onopen = function(e) {
 };
 
 eventSource.onerror = function(e) {
-  if (this.readyState == EventSource.CONNECTING) {      
+  if (this.readyState == EventSource.CONNECTING) {
     console.log("Соединение порвалось, пересоединяемся...");
   } else {
     console.log("Ошибка, состояние: " + this.readyState);
@@ -180,15 +181,15 @@ data: Вася
 
 ```js
 eventSource.addEventListener('join', function(e) {
-  alert('Пришёл ' + e.data);
+  alert( 'Пришёл ' + e.data );
 });
 
 eventSource.addEventListener('message', function(e) {
-  alert('Сообщение ' + e.data);
+  alert( 'Сообщение ' + e.data );
 });
 
 eventSource.addEventListener('leave', function(e) {
-  alert('Ушёл ' + e.data);
+  alert( 'Ушёл ' + e.data );
 });
 ```
 
@@ -203,7 +204,9 @@ eventSource.addEventListener('leave', function(e) {
 `EventSource` поддерживает кросс-доменные запросы, аналогично `XMLHttpRequest`. Для этого у конструктора есть второй аргумент -- объект, который нужно передать так:
 
 ```js
-var source = new EventSource("http://pupkin.ru/stream", { withCredentials: true });
+var source = new EventSource("http://pupkin.ru/stream", {
+  withCredentials: true
+});
 ```
 
 Второй аргумент сделан объектом с расчётом на будущее. Пока что никаких других свойств там не поддерживается, только `withCredentials`.
@@ -215,7 +218,7 @@ var source = new EventSource("http://pupkin.ru/stream", { withCredentials: true
 ```js
 eventSource.addEventListener('message', function(e) {
   if (e.origin != 'http://javascript.ru') return;
-  alert('Сообщение ' + e.data);
+  alert( 'Сообщение ' + e.data );
 });
 ```
 
diff --git a/4-ajax/12-ajax-iframe/article.md b/4-ajax/12-ajax-iframe/article.md
index bb761263..a6278ac4 100644
--- a/4-ajax/12-ajax-iframe/article.md
+++ b/4-ajax/12-ajax-iframe/article.md
@@ -68,7 +68,6 @@ var iframeDoc = iframe.contentWindow.document;
 <li>Когда ифрейм уже создан, то единственный способ поменять его `src` без попадания запроса в историю посещений:
 
 ```js
- 
 // newSrc - новый адрес
 iframeDoc.location.replace(newSrc);
 ```
@@ -104,7 +103,7 @@ function createIframe(name, src, debug) {
 
   // в старых IE нельзя присвоить name после создания iframe
   // поэтому создаём через innerHTML
-  tmpElem.innerHTML = '<iframe name="'+name+'" id="'+name+'" src="'+src+'">';
+  tmpElem.innerHTML = '<iframe name="' + name + '" id="' + name + '" src="' + src + '">';
   var iframe = tmpElem.firstChild;
 
   if (!debug) {
@@ -138,14 +137,14 @@ function createIframe(name, src, debug) {
 ```js
 // Например: postToIframe('/vote', {mark:5}, 'frame1')
 
-function postToIframe(url, data, target){
+function postToIframe(url, data, target) {
   var phonyForm = document.getElementById('phonyForm');
-  if(!phonyForm){
+  if (!phonyForm) {
     // временную форму создаем, если нет
     phonyForm = document.createElement("form");
     phonyForm.id = 'phonyForm';
     phonyForm.style.display = "none";
-    phonyForm.method = "POST";        
+    phonyForm.method = "POST";
     document.body.appendChild(phonyForm);
   }
 
@@ -154,11 +153,11 @@ function postToIframe(url, data, target){
 
   // заполнить форму данными из объекта
   var html = [];
-  for(var key in data){
+  for (var key in data) {
     var value = String(data[key]).replace(/"/g, "&quot;");
     // в старых IE нельзя указать name после создания input
     // поэтому используем innerHTML вместо DOM-методов
-    html.push("<input type='hidden' name=\""+key+"\" value=\""+value+"\">");
+    html.push("<input type='hidden' name=\"" + key + "\" value=\"" + value + "\">");
   }
   phonyForm.innerHTML = html.join('');
 
@@ -181,6 +180,7 @@ function postToIframe(url, data, target){
 <li>Сервер отвечает как-то так:
 
 ```html
+<!--+ no-beautify -->
 <script>
   parent.CallbackRegistry[window.name]({данные});
 </script>
@@ -257,6 +257,7 @@ function postToIframe(url, data, target){
 Поэтому в таком `IFRAME` первые несколько сообщений задержатся:
 
 ```html
+<!--+ no-beautify -->
 <!DOCTYPE HTML>
 <html>
   <body>
@@ -270,10 +271,15 @@ function postToIframe(url, data, target){
 ```html
 <!DOCTYPE HTML>
 <html>
-  <body>
+
+<body>
   ******* 1 килобайт пробелов, а потом уже сообщения ******
-  <script>parent.onMessage("привет");</script>
-  <script>parent.onMessage("от сервера");</script>
+  <script>
+    parent.onMessage("привет");
+  </script>
+  <script>
+    parent.onMessage("от сервера");
+  </script>
   ...
 ```
 
@@ -303,15 +309,15 @@ function iframeActiveXGet(url, onSuccess, onError) {
 *!*
   var iframe = createActiveXFrame(iframeName, url);
 */!*
-  
+
   CallbackRegistry[iframeName] = function(data) {
-    iframeOk = true;  
+    iframeOk = true;
     onSuccess(data);
   }
 
-  iframe.onload = function() { 
+  iframe.onload = function() {
     iframe.parentNode.removeChild(iframe); // очистка
-    delete CallbackRegistry[iframeName];   
+    delete CallbackRegistry[iframeName];
     if (!iframeOk) onError(); // если коллбэк не вызвался - что-то не так
   }
 
@@ -335,12 +341,12 @@ function createActiveXFrame(name, src) {
     // (3)
     htmlfile.parentWindow.CallbackRegistry = CallbackRegistry;
   }
-  
+
   // (4)
   src = src || 'javascript:false';
-  htmlfile.body.insertAdjacentHTML('beforeEnd', 
-    "<iframe name='"+name+"' src='"+src+"'></iframe>");
-  return htmlfile.body.lastChild; 
+  htmlfile.body.insertAdjacentHTML('beforeEnd',
+    "<iframe name='" + name + "' src='" + src + "'></iframe>");
+  return htmlfile.body.lastChild;
 }
 ```
 
@@ -351,7 +357,7 @@ function createActiveXFrame(name, src) {
 
 ```html
 <script>
-parent.CallbackRegistry[window.name]( объект с данными );
+  parent.CallbackRegistry[window.name](объект с данными);
 </script>
 ```
 
diff --git a/4-ajax/13-csrf/article.md b/4-ajax/13-csrf/article.md
index da54aff6..30027b6c 100644
--- a/4-ajax/13-csrf/article.md
+++ b/4-ajax/13-csrf/article.md
@@ -18,6 +18,7 @@
 <li>На злой странице находится форма такого вида:
 
 ```html
+<!--+ no-beautify -->
 <form action="http://mail.com/send" method="POST">
   <input type="hidden" name="message" value="Сообщение">
   ...
diff --git a/4-ajax/2-ajax-nodejs/article.md b/4-ajax/2-ajax-nodejs/article.md
index 2507ce03..47e0e87b 100644
--- a/4-ajax/2-ajax-nodejs/article.md
+++ b/4-ajax/2-ajax-nodejs/article.md
@@ -45,7 +45,7 @@ var http = require('http');
 var static = require('node-static');
 var file = new static.Server('.');
 
-http.createServer(function (req, res) {
+http.createServer(function(req, res) {
   file.serve(req, res);
 }).listen(8080);
 
diff --git a/4-ajax/3-ajax-xmlhttprequest/1-phones-list/solution.md b/4-ajax/3-ajax-xmlhttprequest/1-phones-list/solution.md
index abfc3d8c..83f8e9c6 100644
--- a/4-ajax/3-ajax-xmlhttprequest/1-phones-list/solution.md
+++ b/4-ajax/3-ajax-xmlhttprequest/1-phones-list/solution.md
@@ -3,31 +3,31 @@
 ```js
 function loadPhones() {
 
-  var xhr = new XMLHttpRequest(); 
-    
-  xhr.open('GET', 'phones.json', true); 
-    
+  var xhr = new XMLHttpRequest();
+
+  xhr.open('GET', 'phones.json', true);
+
   xhr.send();
 
   xhr.onreadystatechange = function() {
     if (xhr.readyState != 4) return;
-   
+
     button.parentNode.removeChild(button);
 
     if (xhr.status != 200) {
       // обработать ошибку
-      alert(xhr.status + ': ' + xhr.statusText);
+      alert( xhr.status + ': ' + xhr.statusText );
     } else {
 *!*
       try {
         var phones = JSON.parse(xhr.responseText);
-      } catch(e) {
-        alert("Некорректный ответ " + e.message);
+      } catch (e) {
+        alert( "Некорректный ответ " + e.message );
       }
       showPhones(phones);
 */!*
     }
-  
+
   }
 
   button.innerHTML = 'Загружаю...';
@@ -37,12 +37,12 @@ function loadPhones() {
 *!*
 function showPhones(phones) {
 
-  phones.forEach(function(phone) {
-    var li = list.appendChild(document.createElement('li'));
-    li.innerHTML = phone.name;
-  });
+    phones.forEach(function(phone) {
+      var li = list.appendChild(document.createElement('li'));
+      li.innerHTML = phone.name;
+    });
 
-}
+  }
 */!*
 ```
 
diff --git a/4-ajax/3-ajax-xmlhttprequest/article.md b/4-ajax/3-ajax-xmlhttprequest/article.md
index d2b62a06..f79303d5 100644
--- a/4-ajax/3-ajax-xmlhttprequest/article.md
+++ b/4-ajax/3-ajax-xmlhttprequest/article.md
@@ -18,27 +18,27 @@
 *!*
 // 1. Создаём новый объект XMLHttpRequest
 */!*
-var xhr = new XMLHttpRequest(); 
+var xhr = new XMLHttpRequest();
 
 *!*
 // 2. Конфигурируем его: GET-запрос на URL 'phones.json'
-xhr.open('GET', 'phones.json', false); 
+xhr.open('GET', 'phones.json', false);
 */!*
 
 *!*
 // 3. Отсылаем запрос
 */!*
-xhr.send(); 
+xhr.send();
 
 *!*
 // 4. Если код ответа сервера не 200, то это ошибка
 */!*
 if (xhr.status != 200) {
   // обработать ошибку
-  alert(xhr.status + ': ' + xhr.statusText); // пример вывода: 404: Not Found 
+  alert( xhr.status + ': ' + xhr.statusText ); // пример вывода: 404: Not Found 
 } else {
   // вывести результат
-  alert(xhr.responseText); // responseText -- текст ответа.
+  alert( xhr.responseText ); // responseText -- текст ответа.
 }
 ```
 
@@ -284,7 +284,7 @@ xhr.timeout = 30000; // 30 секунд (в миллисекундах)
 
 ```js
 xhr.ontimeout = function() {
-  alert('Извините, запрос превысил максимальное время');
+  alert( 'Извините, запрос превысил максимальное время' );
 }
 ```
 
@@ -370,7 +370,7 @@ xhr.onreadystatechange = function() {
 
   if (this.status != 200) {
     // обработать ошибку
-    alert('ошибка: ' + (this.status ? this.statusText || 'запрос не удался') );
+    alert( 'ошибка: ' + (this.status ? this.statusText || 'запрос не удался') );
     return;
   }
 
diff --git a/4-ajax/4-xhr-forms/article.md b/4-ajax/4-xhr-forms/article.md
index e54b8d90..7560f76d 100644
--- a/4-ajax/4-xhr-forms/article.md
+++ b/4-ajax/4-xhr-forms/article.md
@@ -61,7 +61,7 @@ alert( encodeURIComponent('Виктор') ); // %D0%92%D0%B8%D0%BA%D1%82%D0%BE%D
 
 var xhr = new XMLHttpRequest();
 
-var params = 'name=' + encodeURIComponent(name) + 
+var params = 'name=' + encodeURIComponent(name) +
   '&surname=' + encodeURIComponent(surname);
 
 xhr.open("GET", '/submit?' + params, true);
@@ -109,7 +109,7 @@ xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
 ```js
 var xhr = new XMLHttpRequest();
 
-var body = 'name=' + encodeURIComponent(name) + 
+var body = 'name=' + encodeURIComponent(name) +
   '&surname=' + encodeURIComponent(surname);
 
 xhr.open("POST", '/submit', true)
@@ -187,7 +187,7 @@ var boundaryLast = '--' + boundary + '--\r\n'
 var body = ['\r\n'];
 for (var key in data) {
   // добавление поля
-  body.push('Content-Disposition: form-data; name="'+key+'"\r\n\r\n'+data[key]+'\r\n');
+  body.push('Content-Disposition: form-data; name="' + key + '"\r\n\r\n' + data[key] + '\r\n');
 }
 
 body = body.join(boundaryMiddle) + boundaryLast;
@@ -197,12 +197,12 @@ body = body.join(boundaryMiddle) + boundaryLast;
 var xhr = new XMLHttpRequest();
 xhr.open('POST', '/submit', true);
 
-xhr.setRequestHeader('Content-Type','multipart/form-data; boundary=' + boundary);
+xhr.setRequestHeader('Content-Type', 'multipart/form-data; boundary=' + boundary);
 
 xhr.onreadystatechange = function() {
   if (this.readyState != 4) return;
 
-  alert(this.responseText);
+  alert( this.responseText );
 }
 
 xhr.send(body);
@@ -216,6 +216,7 @@ xhr.send(body);
 Для добавления файла нужно использовать тот же код, что выше, модифицировав заголовки перед полем, которое является файлом, так:
 
 ```js
+//+ no-beautify
 Content-Disposition: form-data; name="myfile"; filename="pic.jpg"
 Content-Type: image/jpeg
 (пустая строка)
@@ -230,25 +231,25 @@ Content-Type: image/jpeg
 Это очень удобно. Например:
 
 ```html
-<form name="person"> 
+<form name="person">
   <input name="name" value="Виктор">
   <input name="surname" value="Цой">
 </form>
 
 <script>
-// создать объект для формы
+  // создать объект для формы
 *!*
-var formData = new FormData(document.forms.person);  
+  var formData = new FormData(document.forms.person);
 */!*
 
-// добавить к пересылке ещё пару ключ - значение
-formData.append("patronym", "Робертович");
+  // добавить к пересылке ещё пару ключ - значение
+  formData.append("patronym", "Робертович");
 
-// отослать
-var xhr = new XMLHttpRequest();
-xhr.open("POST", "/url");
+  // отослать
+  var xhr = new XMLHttpRequest();
+  xhr.open("POST", "/url");
 *!*
-xhr.send(formData);
+  xhr.send(formData);
 */!*
 </script>
 ```
@@ -278,7 +279,7 @@ var json = JSON.stringify({
 });
 
 xhr.open("POST", '/submit', true)
-xhr.setRequestHeader('Content-type','application/json; charset=utf-8');
+xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
 
 xhr.onreadystatechange = ...;
 
diff --git a/4-ajax/5-xhr-crossdomain/article.md b/4-ajax/5-xhr-crossdomain/article.md
index 9004a824..70bb83c2 100644
--- a/4-ajax/5-xhr-crossdomain/article.md
+++ b/4-ajax/5-xhr-crossdomain/article.md
@@ -24,11 +24,11 @@ var xhr = new XHR();
 xhr.open('GET', 'http://anywhere.com/request', true);
 
 xhr.onload = function() {
-  alert(this.responseText);
+  alert( this.responseText );
 }
 
 xhr.onerror = function() {
-  alert('Ошибка ' + this.status);
+  alert( 'Ошибка ' + this.status );
 }
 
 xhr.send();
@@ -218,7 +218,7 @@ var xhr = new XMLHttpRequest();
 xhr.withCredentials = true;
 
 xhr.open('POST', 'http://anywhere.com/request', true)
-...
+  ...
 ```
 
 Далее -- всё как обычно, дополнительных действий со стороны клиента не требуется.
@@ -236,6 +236,7 @@ xhr.open('POST', 'http://anywhere.com/request', true)
 Пример заголовков:
 
 ```js
+//+ no-beautify
 HTTP/1.1 200 OK
 Content-Type:text/html; charset=UTF-8
 *!*
diff --git a/4-ajax/6-xhr-onprogress/article.md b/4-ajax/6-xhr-onprogress/article.md
index b13365fd..f4e5d844 100644
--- a/4-ajax/6-xhr-onprogress/article.md
+++ b/4-ajax/6-xhr-onprogress/article.md
@@ -31,15 +31,15 @@
 
 ```js
 xhr.upload.onprogress = function(event) {
-  alert('Загружено на сервер ' + event.loaded + ' байт из '+ event.total);
+  alert( 'Загружено на сервер ' + event.loaded + ' байт из ' + event.total );
 }
 
 xhr.upload.onload = function() {
-  alert('Данные полностью загружены на сервер!');
+  alert( 'Данные полностью загружены на сервер!' );
 }
 
 xhr.upload.onerror = function() {
-  alert('Произошла ошибка при загрузке данных на сервер!');
+  alert( 'Произошла ошибка при загрузке данных на сервер!' );
 }
 ```
 
@@ -49,7 +49,7 @@ xhr.upload.onerror = function() {
 
 ```js
 xhr.onprogress = function(event) {
-  alert('Получено с сервера ' + event.loaded + ' байт из '+ event.total);
+  alert( 'Получено с сервера ' + event.loaded + ' байт из ' + event.total );
 }
 ```
 
@@ -67,20 +67,20 @@ File API позволяет получить доступ к содержимо
 
 ```html
 <form name="upload">
-	<input type="file" name="myfile">
-	<input type="submit" value="Загрузить">
+  <input type="file" name="myfile">
+  <input type="submit" value="Загрузить">
 </form>
 
 <script>
-document.forms.upload.onsubmit = function() {
-  var file = this.elements.myfile.files[0];	
-  if (file) {
+  document.forms.upload.onsubmit = function() {
+    var file = this.elements.myfile.files[0];
+    if (file) {
 *!*
-    upload(file);
+      upload(file);
 */!*
+    }
+    return false;
   }
-  return false;
-}
 </script>
 ```
 
@@ -94,7 +94,7 @@ function upload(file) {
   // обработчики можно объединить в один,
   // если status == 200, то это успех, иначе ошибка
   xhr.onload = xhr.onerror = function() {
-    if(this.status == 200) {
+    if (this.status == 200) {
       log("success");
     } else {
       log("error " + this.status);
@@ -103,10 +103,10 @@ function upload(file) {
 
   // обработчик для закачки
   xhr.upload.onprogress = function(event) {
-    log(event.loaded + ' / '+ event.total);
+    log(event.loaded + ' / ' + event.total);
   }
 
-  xhr.open("POST", "upload", true); 
+  xhr.open("POST", "upload", true);
   xhr.send(file);
 
 }
diff --git a/4-ajax/7-xhr-resume/article.md b/4-ajax/7-xhr-resume/article.md
index f2dc5433..43555d8a 100644
--- a/4-ajax/7-xhr-resume/article.md
+++ b/4-ajax/7-xhr-resume/article.md
@@ -38,9 +38,9 @@ xhr.send(slice); // ... и отправить эти байты в запрос
 
 ```js
 function Uploader(file, onSuccess, onFail, onProgress) {
-  
+
   var fileId = file.name + '-' + file.size + '-' + +file.lastModifiedDate;
-  
+
   var errorCount = 0;
 
   var MAX_ERROR_COUNT = 6;
diff --git a/4-ajax/9-websockets/article.md b/4-ajax/9-websockets/article.md
index 15e93f13..9ba937a4 100644
--- a/4-ajax/9-websockets/article.md
+++ b/4-ajax/9-websockets/article.md
@@ -407,8 +407,8 @@ HTML: посетитель отсылает сообщения из формы 
 ```html
 <!-- форма для отправки сообщений -->
 <form name="publish">
-  <input type="text" name="message"/>
-  <input type="submit" value="Отправить"/>
+  <input type="text" name="message" />
+  <input type="submit" value="Отправить" />
 </form>
 
 <!-- здесь будут появляться входящие сообщения -->
@@ -432,7 +432,7 @@ document.forms.publish.onsubmit = function() {
 // обработчик входящих сообщений
 socket.onmessage = function(event) {
   var incomingMessage = event.data;
-  showMessage(incomingMessage); 
+  showMessage(incomingMessage);
 };
 
 // показать сообщение в div#subscribe
@@ -452,7 +452,9 @@ var WebSocketServer = new require('ws');
 var clients = {};
 
 // WebSocket-сервер на порту 8081
-var webSocketServer = new WebSocketServer.Server({port: 8081});
+var webSocketServer = new WebSocketServer.Server({
+  port: 8081
+});
 webSocketServer.on('connection', function(ws) {
 
   var id = Math.random();
@@ -462,7 +464,7 @@ webSocketServer.on('connection', function(ws) {
   ws.on('message', function(message) {
     console.log('получено сообщение ' + message);
 
-    for(var key in clients) {
+    for (var key in clients) {
       clients[key].send(message);
     }
   });
@@ -475,7 +477,7 @@ webSocketServer.on('connection', function(ws) {
 });
 ```
 
-Рабочий пример можно скачать: [websocket.zip](/zip/tutorial/ajax/websocket.zip). Понадобится поставить два модуля: `npm install node-static && npm install ws`.
+Рабочий пример можно скачать: [websocket.zip](websocket.zip). Понадобится поставить два модуля: `npm install node-static && npm install ws`.
 ## Итого
 
 WebSocket -- современное средство коммуникации. Кросс-доменное, универсальное, безопасное.
@@ -489,6 +491,3 @@ WebSocket -- современное средство коммуникации. 
 Например, для Node.JS одной из самых известных библиотек является [Socket.IO](http://socket.io).
 
 К недостаткам библиотек следует отнести то, что некоторые продвинутые возможности WebSocket, такие как двухсторонний обмен бинарными данными, в них недоступны. С другой -- в большинстве случаев стандартного текстового обмена вполне достаточно.
-[head]
-<script src="/files/tutorial/ajax/script/scriptRequest.js"></script>
-[/head]
\ No newline at end of file
diff --git a/4-ajax/9-websockets/websocket.zip b/4-ajax/9-websockets/websocket.zip
new file mode 100644
index 0000000000000000000000000000000000000000..65190ec38b35477d36af1db466e88f2216947537
GIT binary patch
literal 1950
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
a*$QYdC|h9|%*qA|HWna^1^QYW%mV<ydIdQE

literal 0
HcmV?d00001

diff --git a/4-ajax/index.md b/4-ajax/index.md
index a1c37ad7..4d781e24 100644
--- a/4-ajax/index.md
+++ b/4-ajax/index.md
@@ -1,5 +1,3 @@
 # AJAX и COMET 
 
-Современный `XMLHttpRequest`, включая поддержку докачки, индикации прогресса, кросс-доменных запросов.
-
-WebSocket. Альтернативные методы общения с сервером при помощи JSONP и IFRAME'ов.
\ No newline at end of file
+Современные средства для обмена данными с сервером и смежные аспекты.
diff --git a/5-animation/1-bezier/article.md b/5-animation/1-bezier/article.md
index 13c91881..97834146 100644
--- a/5-animation/1-bezier/article.md
+++ b/5-animation/1-bezier/article.md
@@ -119,11 +119,15 @@
 <li>Эти точки соединяются. На рисунке ниже соединяющий их отрезок изображён <span style="color:blue">синим</span>.
 
 <table>
+<thead>
 <tr><td>При `t=0.25`</td><td>При `t=0.5`</td></tr>
+</thead>
+<tbody>
 <tr>
 <td><img src="bezier3-draw1.svg"></td>
 <td><img src="bezier3-draw2.svg"></td>
 </tr>
+</tbody>
 </table>
 
 </li>
diff --git a/5-animation/1-bezier/demo.svg b/5-animation/1-bezier/demo.svg
index 87b916a5..7dd51ad6 100644
--- a/5-animation/1-bezier/demo.svg
+++ b/5-animation/1-bezier/demo.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xml="http://www.w3.org/XML/1998/namespace" xmlns:xlink="http://www.w3.org/1999/xlink" width="340" height="360"><defs><pattern id="Pat01" width="10" height="10" patternUnits="userSpaceOnUse"><path fill="#fff" stroke="#000" stroke-width=".1" d="M0 0h10v10H0z"/></pattern></defs><path fill="url(#Pat01)" d="M20 50h300v300H20z"/><path d="M20 50h300v300H20z" fill="none" stroke-width=".5" stroke-dasharray="2 2"/><svg><circle r="4" fill="#fff" stroke="#000" cx="20" cy="20" cursor="pointer"/><text x="12" y="12" font-size="16" font-weight="bold">1</text></svg><circle r="4" fill="#f00" stroke="#f00" id="marker" cx="-10" cy="-10"/><svg><image xlink:href="play.png" x="5" y="5" width="30" height="30" id="run-button" cursor="pointer"/><text x="38" y="27" font-size="18" font-family="Consolas, Lucida Console, sans-serif">t:<tspan id="t-value">1</tspan></text></svg><script><![CDATA[
var xmlns = "http://www.w3.org/2000/svg";
var xlinkns  = "http://www.w3.org/1999/xlink";

var box = {left:20, top: 50, right: 320, bottom: 350 };

if (location.search.match('small=1')) {
  box = {left:20, top: 50, right: 120, bottom: 150 };
}

document.documentElement.ondragstart = function() {
  return false;
};

var pointsIn = location.search.match(/p=(.*?)($|&amp;)/)[1];

// don't show a piece of control path between P2 and P3
var hideMiddleControlPath = location.search.match('nocpath=1');

pointsIn = pointsIn.split(',');

var points = [];

// read points from ?p=...
for(var i=0; i<pointsIn.length; i++) {
  var x = box.left + (box.right - box.left)*pointsIn[i];
  var y = box.bottom + (box.top - box.bottom)*pointsIn[++i];
  points.push( {x: x, y: y} );
}

var bezierPath = document.getElementById("bezier-path");
var controlPath = document.getElementById("control-path");
//controlPath.style.display = location.search.match('nocpath=1') ? 'none' : 'block';

var runButton = document.getElementById("run-button");
runButton.parentNode.style.display = location.search.match('animate=1') ? 'block' : 'none';



var tPathTemplate = document.getElementById("t-path-template");
tPathTemplate.parentNode.removeChild(tPathTemplate);

function drawPath() {
  var letter;
  switch (points.length) {
  case 4:
    letter = 'C';
    break;
  case 3:
    letter = 'Q';
    break;
  default:
    letter = 'L';
  }
  var bezierPathD = "M" + points[0].x + ',' + points[0].y + ' '+letter;
  var controlPathD = "M" + points[0].x + ',' + points[0].y + ' L';

  for(var i = 1; i < points.length; i++) {
    bezierPathD += points[i].x + ',' + points[i].y + ' ';
    controlPathD += points[i].x + ',' + points[i].y + ' ';
  }
  bezierPath.setAttribute('d', bezierPathD);
  controlPath.setAttribute('d', controlPathD);

  function dist(a,b) {
    return Math.round(Math.sqrt( (a.x-b.x)*(a.x-b.x) + (a.y-b.y)*(a.y-b.y)));
  }

  if (hideMiddleControlPath) {
    controlPath.setAttribute('stroke-dasharray', dist(points[0],points[1])+' '+dist(points[1],points[2])+' 9999 9999');
  }

}

// draw control points
function drawPoints(points) {
  var p = document.getElementById('p-template');
  p.removeAttribute('id');
  p.parentNode.removeChild(p);

  for(var i=0; i<points.length; i++) {
    var point = p.cloneNode(true);
    point.getElementsByTagName('text')[0].firstChild.data = i+1;
    setPointCoords(point, i);
    setPointHandler(point, i);
    document.documentElement.appendChild(point);
  }

}

// control points coords are shifted from Left-Upper corner a bit
// to give them space to render
function setPointCoords(point, i) {
  point.setAttribute('x', points[i].x-20);
  point.setAttribute('y', points[i].y-20);
}

function setPointHandler(point, i) {
  var circle = point.getElementsByTagName('circle')[0];
  circle.onmousedown = function() {
    document.onmousemove = function(e) {
      var x = e.pageX, y = e.pageY;

      // constrain withing the box
      if (x < box.left) x = box.left;
      if (x > box.right) x = box.right;
      if (y > box.bottom) y = box.bottom;
      if (y < box.top) y = box.top;

      points[i].x = x;
      points[i].y = y;
      setPointCoords(point, i);
      drawPath();
    }
    document.onmouseup = function() {
      document.onmousemove = document.onmouseup = null;
    }
    return false;
  }
}

// draw point connectors which form the curve
function drawT(points, t) {

  var path = document.getElementById('t-'+points.length);

  if (!path) {
    path = tPathTemplate.cloneNode(true);
    path.setAttribute('stroke', ["blue","#0a0","red"][points.length % 3]);
    path.setAttribute('id', 't-'+points.length);
    document.documentElement.appendChild(path);
  }

  var subPoints = [];
  var x = points[0].x + (points[1].x - points[0].x)*t;
  var y = points[0].y + (points[1].y - points[0].y)*t;

  var tPathD = "M" + x + ',' + y + ' L';
  subPoints.push({x: x, y: y});

  for(var i=1; i<points.length-1; i++) {
    var x = points[i].x + (points[i+1].x - points[i].x)*t;
    var y = points[i].y + (points[i+1].y - points[i].y)*t;
    subPoints.push({x: x, y: y});

    tPathD += x + ',' + y + ' ';
  }

  if (points.length <= 3) {
    var m = document.getElementById('marker');
    if (t == 1) {
      var mx = -10, my = -10;
    } else {
      mx = subPoints[0].x + (x-subPoints[0].x)*t;
      my = subPoints[0].y + (y-subPoints[0].y)*t;
    }
    m.setAttribute('cx', mx);
    m.setAttribute('cy', my);
    path.setAttribute('stroke-width', 2);
  }
  if (points.length == 2) {
    // only 2 points provided, special case
    tPathD = "M"+points[0].x+","+points[0].y+" L"+x+","+y;
  }

  path.setAttribute('d', tPathD);

  if (subPoints.length > 2){
    drawT(subPoints, t);
  }
}

var t = 0;
var timer;


// animate the curve
function animate(complete) {

  timer = setInterval(function() {
    if (t>1) {
      t = 1;
    }
    //bezierPath.setAttribute('stroke-dasharray', t*bezierPath.getTotalLength()+' '+bezierPath.getTotalLength());
    drawT(points, t);

    document.getElementById('t-value').firstChild.nodeValue = t==0 ? 0 : t == 1 ? 1 : t.toFixed(3);
/*
    if (t >= 0.5) {
      clearInterval(timer);
      runButton.parentNode.style.display = 'none';
      return;
    }
*/
    if (t == 1) {
      clearInterval(timer);
      timer = 0;
      complete &amp;&amp; complete();
      return;
    }

    t += 0.005;
  }, 30);
}

function animationDone() {
  for(var i=1; i<=points.length; i++) {
    var path = document.getElementById('t-'+i);
    path &amp;&amp; document.documentElement.removeChild(path);
  }
  t = 0;
  runButton.setAttributeNS(xlinkns, 'xlink:href', 'play.png');
}

runButton.onclick = onAnimate;

function onAnimate() {
  if (timer) {
    // animation in action
    runButton.setAttributeNS(xlinkns, 'xlink:href', 'play.png');
    clearInterval(timer);
    timer = 0;
    return;
  }

  runButton.setAttributeNS(xlinkns, 'xlink:href', 'pause.png');
  animate(animationDone)
}

drawPath();
drawPoints(points);

//]]></script></svg>
\ No newline at end of file
+<?xml version="1.0" ?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/SVG/DTD/svg10.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xml="http://www.w3.org/XML/1998/namespace" xmlns:xlink="http://www.w3.org/1999/xlink" width="340" height="360">
<!--
@see
http://www.learnsvg.com/books/learnsvg/html/bitmap/chapter04/page04-1.php
http://apike.ca/prog_svg_paths.html
http://www.the-art-of-web.com/css/css-animation/
http://srufaculty.sru.edu/david.dailey/svg/curve.svg
http://www.w3.org/Graphics/SVG/IG/resources/svgprimer.html#path_C
-->
<defs>
<pattern id="Pat01" width="10" height="10" patternUnits="userSpaceOnUse">
	<rect width="10" height="10" fill="#FFFFFF" stroke="#000000" stroke-width="0.1"/>
</pattern>
</defs>


<rect x="20" y="50" width="300" height="300" fill="url(#Pat01)"/>


<path d="M20,50 H320 V350 H20 Z" fill="none" stroke="none" stroke-width="0.5" stroke-dasharray="2 2"/>


<path fill="none" id="control-path" stroke="black"/>
<path stroke="red" fill="none" id="bezier-path" stroke-width="1.2"/>

<path d="" fill="none" id="t-path-template"/>

<svg x="0" y="0" id="p-template">
<circle r="4" fill="white" stroke="black" stroke-width="1" cx="20" cy="20" style="cursor: pointer"/>
<text x="12" y="12" style="font-size:16px;font-weight:bold">1</text>
</svg>

<circle r="4" fill="red" stroke="red" id="marker" stroke-width="1" cx="-10" cy="-10"/>

<svg>
<image xlink:href="play.png" x="5" y="5" style="cursor:pointer" width="30" height="30" id="run-button"/>
<text x="38" y="27" style="font-size:18px;font-family:Consolas, Lucida Console, sans-serif">t:<tspan id="t-value">1</tspan></text>
</svg>

<script><![CDATA[
var xmlns = "http://www.w3.org/2000/svg";
var xlinkns  = "http://www.w3.org/1999/xlink";

var box = {left:20, top: 50, right: 320, bottom: 350 };

if (location.search.match('small=1')) {
  box = {left:20, top: 50, right: 120, bottom: 150 };
}

document.documentElement.ondragstart = function() {
  return false;
};

var pointsIn = location.search.match(/p=(.*?)($|&)/)[1];

// don't show a piece of control path between P2 and P3
var hideMiddleControlPath = location.search.match('nocpath=1');

pointsIn = pointsIn.split(',');

var points = [];

// read points from ?p=...
for(var i=0; i<pointsIn.length; i++) {
  var x = box.left + (box.right - box.left)*pointsIn[i];
  var y = box.bottom + (box.top - box.bottom)*pointsIn[++i];
  points.push( {x: x, y: y} );
}

var bezierPath = document.getElementById("bezier-path");
var controlPath = document.getElementById("control-path");
//controlPath.style.display = location.search.match('nocpath=1') ? 'none' : 'block';

var runButton = document.getElementById("run-button");
runButton.parentNode.style.display = location.search.match('animate=1') ? 'block' : 'none';



var tPathTemplate = document.getElementById("t-path-template");
tPathTemplate.parentNode.removeChild(tPathTemplate);

function drawPath() {
  var letter;
  switch (points.length) {
  case 4:
    letter = 'C';
    break;
  case 3:
    letter = 'Q';
    break;
  default:
    letter = 'L';
  }
  var bezierPathD = "M" + points[0].x + ',' + points[0].y + ' '+letter;
  var controlPathD = "M" + points[0].x + ',' + points[0].y + ' L';

  for(var i = 1; i < points.length; i++) {
    bezierPathD += points[i].x + ',' + points[i].y + ' ';
    controlPathD += points[i].x + ',' + points[i].y + ' ';
  }
  bezierPath.setAttribute('d', bezierPathD);
  controlPath.setAttribute('d', controlPathD);

  function dist(a,b) {
    return Math.round(Math.sqrt( (a.x-b.x)*(a.x-b.x) + (a.y-b.y)*(a.y-b.y)));
  }

  if (hideMiddleControlPath) {
    controlPath.setAttribute('stroke-dasharray', dist(points[0],points[1])+' '+dist(points[1],points[2])+' 9999 9999');
  }

}

// draw control points
function drawPoints(points) {
  var p = document.getElementById('p-template');
  p.removeAttribute('id');
  p.parentNode.removeChild(p);

  for(var i=0; i<points.length; i++) {
    var point = p.cloneNode(true);
    point.getElementsByTagName('text')[0].firstChild.data = i+1;
    setPointCoords(point, i);
    setPointHandler(point, i);
    document.documentElement.appendChild(point);
  }

}

// control points coords are shifted from Left-Upper corner a bit
// to give them space to render
function setPointCoords(point, i) {
  point.setAttribute('x', points[i].x-20);
  point.setAttribute('y', points[i].y-20);
}

function setPointHandler(point, i) {
  var circle = point.getElementsByTagName('circle')[0];
  circle.onmousedown = function() {
    document.onmousemove = function(e) {
      var x = e.pageX, y = e.pageY;

      // constrain withing the box
      if (x < box.left) x = box.left;
      if (x > box.right) x = box.right;
      if (y > box.bottom) y = box.bottom;
      if (y < box.top) y = box.top;

      points[i].x = x;
      points[i].y = y;
      setPointCoords(point, i);
      drawPath();
    }
    document.onmouseup = function() {
      document.onmousemove = document.onmouseup = null;
    }
    return false;
  }
}

// draw point connectors which form the curve
function drawT(points, t) {

  var path = document.getElementById('t-'+points.length);

  if (!path) {
    path = tPathTemplate.cloneNode(true);
    path.setAttribute('stroke', ["blue","#0a0","red"][points.length % 3]);
    path.setAttribute('id', 't-'+points.length);
    document.documentElement.appendChild(path);
  }

  var subPoints = [];
  var x = points[0].x + (points[1].x - points[0].x)*t;
  var y = points[0].y + (points[1].y - points[0].y)*t;

  var tPathD = "M" + x + ',' + y + ' L';
  subPoints.push({x: x, y: y});

  for(var i=1; i<points.length-1; i++) {
    var x = points[i].x + (points[i+1].x - points[i].x)*t;
    var y = points[i].y + (points[i+1].y - points[i].y)*t;
    subPoints.push({x: x, y: y});

    tPathD += x + ',' + y + ' ';
  }

  if (points.length <= 3) {
    var m = document.getElementById('marker');
    if (t == 1) {
      var mx = -10, my = -10;
    } else {
      mx = subPoints[0].x + (x-subPoints[0].x)*t;
      my = subPoints[0].y + (y-subPoints[0].y)*t;
    }
    m.setAttribute('cx', mx);
    m.setAttribute('cy', my);
    path.setAttribute('stroke-width', 2);
  }
  if (points.length == 2) {
    // only 2 points provided, special case
    tPathD = "M"+points[0].x+","+points[0].y+" L"+x+","+y;
  }

  path.setAttribute('d', tPathD);

  if (subPoints.length > 2){
    drawT(subPoints, t);
  }
}

var t = 0;
var timer;


// animate the curve
function animate(complete) {

  timer = setInterval(function() {
    if (t>1) {
      t = 1;
    }
    //bezierPath.setAttribute('stroke-dasharray', t*bezierPath.getTotalLength()+' '+bezierPath.getTotalLength());
    drawT(points, t);

    document.getElementById('t-value').firstChild.nodeValue = t==0 ? 0 : t == 1 ? 1 : t.toFixed(3);
/*
    if (t >= 0.5) {
      clearInterval(timer);
      runButton.parentNode.style.display = 'none';
      return;
    }
*/
    if (t == 1) {
      clearInterval(timer);
      timer = 0;
      complete && complete();
      return;
    }

    t += 0.005;
  }, 30);
}

function animationDone() {
  for(var i=1; i<=points.length; i++) {
    var path = document.getElementById('t-'+i);
    path && document.documentElement.removeChild(path);
  }
  t = 0;
  runButton.setAttributeNS(xlinkns, 'xlink:href', 'play.png');
}

runButton.onclick = onAnimate;

function onAnimate() {
  if (timer) {
    // animation in action
    runButton.setAttributeNS(xlinkns, 'xlink:href', 'play.png');
    clearInterval(timer);
    timer = 0;
    return;
  }

  runButton.setAttributeNS(xlinkns, 'xlink:href', 'pause.png');
  animate(animationDone)
}

drawPath();
drawPoints(points);

//]]></script>

</svg>

\ No newline at end of file
diff --git a/5-animation/2-css-transitions/1-animate-logo-css/solution.md b/5-animation/2-css-transitions/1-animate-logo-css/solution.md
index ff52c5b0..2687b05f 100644
--- a/5-animation/2-css-transitions/1-animate-logo-css/solution.md
+++ b/5-animation/2-css-transitions/1-animate-logo-css/solution.md
@@ -2,10 +2,10 @@
 CSS-код для анимации одновременно `width` и `height`:
 ```css
 /* исходный класс */
+
 #flyjet {
   transition: all 3s;
 }
-
 /* JS добавляет .growing *.
 #flyjet.growing {
   width: 400px;
diff --git a/5-animation/2-css-transitions/article.md b/5-animation/2-css-transitions/article.md
index 699741f7..e717cc97 100644
--- a/5-animation/2-css-transitions/article.md
+++ b/5-animation/2-css-transitions/article.md
@@ -27,16 +27,16 @@
 <button id="color">Кликни меня</button>
 
 <style>
-#color {
-  transition-property: background-color;
-  transition-duration: 3s;
-}
+  #color {
+    transition-property: background-color;
+    transition-duration: 3s;
+  }
 </style>
 
 <script>
-color.onclick = function() {
-  this.style.backgroundColor = 'red';
-}
+  color.onclick = function() {
+    this.style.backgroundColor = 'red';
+  }
 </script>
 ```
 
@@ -53,7 +53,7 @@ color.onclick = function() {
 Например, при клике на эту кнопку анимируются одновременно цвет и размер шрифта:
 
 ```html
-<!--+ run height=80 autorun -->
+<!--+ run height=80 autorun  no-beautify -->
 <button id="growing">Кликни меня</button>
 
 <style>
@@ -97,7 +97,7 @@ growing.onclick = function() {
 Она осуществляется сменой `margin-left` у элемента с цифрами, примерно так:
 
 ```css
-#stripe.animate  {
+#stripe.animate {
   margin-left: -174px;
   transition-property: margin-left;
   transition-duration: 9s;
@@ -355,7 +355,7 @@ boat.onclick = function() {
   boat.addEventListener('transitionend', function() {
     times++;
     go();
-  }); 
+  });
 };
 ```
 
@@ -380,31 +380,40 @@ boat.onclick = function() {
 
 ```html
 <!--+ run height=60 -->
-
-<div class="progress"></div>
+<div class="progress">
+</div>
 
 <style>
-/* Chrome, Opera, Safari */
-@-webkit-keyframes MY-ANIMATION-NAME {
-  from { left:0px; }
-  to { left:300px; }
-}
-
-/* Other browsers, except IE9- */
-@keyframes MY-ANIMATION-NAME {
-  from { left:0px; }
-  to { left:300px; }
-}
-
-.progress {
-  position: relative;
-  animation: MY-ANIMATION-NAME 3s infinite alternate;
-  -webkit-animation: MY-ANIMATION-NAME 3s infinite alternate;
-  border: 2px solid green;
-  width: 50px;
-  height: 20px;
-  background: lime;
-}
+  /* Chrome, Opera, Safari */
+  
+  @-webkit-keyframes MY-ANIMATION-NAME {
+    from {
+      left: 0px;
+    }
+    to {
+      left: 300px;
+    }
+  }
+  /* Other browsers, except IE9- */
+  
+  @keyframes MY-ANIMATION-NAME {
+    from {
+      left: 0px;
+    }
+    to {
+      left: 300px;
+    }
+  }
+  
+  .progress {
+    position: relative;
+    animation: MY-ANIMATION-NAME 3s infinite alternate;
+    -webkit-animation: MY-ANIMATION-NAME 3s infinite alternate;
+    border: 2px solid green;
+    width: 50px;
+    height: 20px;
+    background: lime;
+  }
 </style>
 ```
 
diff --git a/5-animation/3-js-animation/1-animate-ball/solution.md b/5-animation/3-js-animation/1-animate-ball/solution.md
index 666e00d3..87e22bf9 100644
--- a/5-animation/3-js-animation/1-animate-ball/solution.md
+++ b/5-animation/3-js-animation/1-animate-ball/solution.md
@@ -13,7 +13,7 @@ animate({
   duration: 2000,
   timing: makeEaseOut(bounce),
   draw: function(progress) {
-    ball.style.top = to*progress + 'px'
+    ball.style.top = to * progress + 'px'
   }
 });
 ```
diff --git a/5-animation/3-js-animation/2-animate-ball-hops/solution.md b/5-animation/3-js-animation/2-animate-ball-hops/solution.md
index f299c109..5462017a 100644
--- a/5-animation/3-js-animation/2-animate-ball-hops/solution.md
+++ b/5-animation/3-js-animation/2-animate-ball-hops/solution.md
@@ -10,13 +10,13 @@
 
 ```js
 var height = field.clientHeight - ball.clientHeight;
-var width  = 100;
+var width = 100;
 
 animate({
   duration: 2000,
   timing: makeEaseOut(bounce),
   draw: function(progress) {
-    ball.style.top = height*progress + 'px'
+    ball.style.top = height * progress + 'px'
   }
 });
 
@@ -24,7 +24,7 @@ animate({
   duration: 2000,
   timing: makeEaseOut(quad),
   draw: function(progress) {
-    ball.style.left = width*progress + "px"
+    ball.style.left = width * progress + "px"
   }
 });
 ```
diff --git a/5-animation/3-js-animation/article.md b/5-animation/3-js-animation/article.md
index 422e6133..cffc3bc7 100644
--- a/5-animation/3-js-animation/article.md
+++ b/5-animation/3-js-animation/article.md
@@ -17,8 +17,8 @@ JavaScript-анимация применяется там, где не подх
 ```js
 var fps = 50; // 50 кадров в секунду
 var timer = setInterval(function() {
-    if (время вышло) clearInterval(timer);
-    else немного увеличить left 
+  if (время вышло) clearInterval(timer);
+  else немного увеличить left
 }, 1000 / fps)
 ```
 
@@ -44,7 +44,7 @@ var timer = setInterval(function() {
 // в то время как timePassed идёт от 0 до 2000
 // left принимает значения от 0 до 400px
 function draw(timePassed) {
-  train.style.left = timePassed / 5 + 'px'; 
+  train.style.left = timePassed / 5 + 'px';
 }
 ```
 
@@ -100,15 +100,15 @@ cancelAnimationFrame(requestId);
 ```html
 <!--+ run height=40 refresh -->
 <script>
-var prev = performance.now();
-var times = 0;
+  var prev = performance.now();
+  var times = 0;
 
-requestAnimationFrame(function measure(time) {
-  document.body.insertAdjacentHTML("beforeEnd", Math.floor(time - prev) + " ");
-  prev = time;
+  requestAnimationFrame(function measure(time) {
+    document.body.insertAdjacentHTML("beforeEnd", Math.floor(time - prev) + " ");
+    prev = time;
 
-  if (times++ < 10) requestAnimationFrame(measure);
-})
+    if (times++ < 10) requestAnimationFrame(measure);
+  })
 </script>
 ```
 
@@ -129,7 +129,7 @@ function animate(draw, duration) {
     if (timePassed > duration) timePassed = duration;
 
     // нарисовать состояние анимации в момент timePassed
-    draw(timePassed); 
+    draw(timePassed);
 
     // если время анимации не закончилось - запланировать ещё кадр
     if (timePassed < duration) {
@@ -215,10 +215,10 @@ function draw(progress) {
 ```js
 animate({
   duration: 1000,
-  timing: function(timeFraction) { 
-    return timeFraction; 
+  timing: function(timeFraction) {
+    return timeFraction;
   },
-  draw: function(progress) { 
+  draw: function(progress) {
     elem.style.width = progress * 100 + '%';
   }
 });
@@ -326,7 +326,7 @@ function bounce(timeFraction) {
 
 ```js
 function elastic(x, timeFraction) {
-  return Math.pow(2, 10 * (timeFraction-1)) * Math.cos(20*Math.PI*x/3*timeFraction)
+  return Math.pow(2, 10 * (timeFraction - 1)) * Math.cos(20 * Math.PI * x / 3 * timeFraction)
 }
 ```
 
@@ -363,7 +363,7 @@ function bounce(timeFraction) {
 }
 
 // преобразователь в easeOut
-function makeEaseOut(timing) {  
+function makeEaseOut(timing) {
   return function(timeFraction) {
     return 1 - timing(1 - timeFraction);
   }
@@ -408,12 +408,12 @@ if (timeFraction <= 0.5) { // первая половина анимации)
 Код, который трансформирует `timing`:
 
 ```js
-function makeEaseInOut(timing) {  
+function makeEaseInOut(timing) {
   return function(timeFraction) {
     if (timeFraction < .5)
-      return timing(2*timeFraction) / 2;
+      return timing(2 * timeFraction) / 2;
     else
-      return (2 - timing(2*(1-timeFraction))) / 2;
+      return (2 - timing(2 * (1 - timeFraction))) / 2;
   }
 }
 
diff --git a/6-optimize/1-memory-leaks/article.md b/6-optimize/1-memory-leaks/article.md
index 7bca13a2..f233a38f 100644
--- a/6-optimize/1-memory-leaks/article.md
+++ b/6-optimize/1-memory-leaks/article.md
@@ -104,16 +104,16 @@ elem.menu = menu; // такая привязка или что-то подобн
 var elem = document.createElement('div'); // любой элемент
 
 function leak() {
-     
-    elem.innerHTML = '<table><tr><td>1</td></tr></table>';
+
+  elem.innerHTML = '<table><tr><td>1</td></tr></table>';
 
 *!*
-    elem.firstChild.rows[0]; // просто доступ через rows[] приводит к утечке
-    // при том, что мы даже не сохраняем значение в переменную
+  elem.firstChild.rows[0]; // просто доступ через rows[] приводит к утечке
+  // при том, что мы даже не сохраняем значение в переменную
 */!*
 
-    elem.removeChild(elem.firstChild); // удалить таблицу (*)
-    // alert(elem.childNodes.length) // выдал бы 0, elem очищен, всё честно
+  elem.removeChild(elem.firstChild); // удалить таблицу (*)
+  // alert(elem.childNodes.length) // выдал бы 0, elem очищен, всё честно
 }
 ```
 
@@ -132,7 +132,7 @@ function leak() {
 
 ```js
 function empty(elem) {
-  while(elem.firstChild) elem.removeChild(elem.firstChild);
+  while (elem.firstChild) elem.removeChild(elem.firstChild);
 }
 ```
 
@@ -146,12 +146,12 @@ function empty(elem) {
 
 ```js
 function leak() {
-  var xhr = new XMLHttpRequest(); 
+  var xhr = new XMLHttpRequest();
 
   xhr.open('GET', '/server.do', true);
 
   xhr.onreadystatechange = function() {
-    if(xhr.readyState == 4 && xhr.status == 200) {            
+    if (xhr.readyState == 4 && xhr.status == 200) {
       // ...
     }
   }
@@ -181,12 +181,12 @@ function leak() {
 function leak() {
   var xhr = new XMLHttpRequest();
 
-  xhr.open('GET', 'something.js?'+Math.random(), true);
+  xhr.open('GET', 'something.js?' + Math.random(), true);
 
   xhr.onreadystatechange = function() {
     if (xhr.readyState != 4) return;
 
-    if(xhr.status == 200) {
+    if (xhr.status == 200) {
       document.getElementById('test').innerHTML++;
     }
 
diff --git a/6-optimize/2-memory-leaks-jquery/article.md b/6-optimize/2-memory-leaks-jquery/article.md
index feb0bcb6..70b76c45 100644
--- a/6-optimize/2-memory-leaks-jquery/article.md
+++ b/6-optimize/2-memory-leaks-jquery/article.md
@@ -12,6 +12,7 @@
 Например:
 
 ```js
+//+ no-beautify
 // присвоить
 $(document).data('prop', { anything: "любой объект" }) 
 
@@ -27,13 +28,14 @@ jQuery-вызов `elem.data(prop, val)` делает следующее:
 <li>Элемент получает уникальный идентификатор, если у него такого еще нет:
 
 ```js
-elem[ jQuery.expando ] = id = ++jQuery.uuid;  // средствами jQuery
+elem[jQuery.expando] = id = ++jQuery.uuid; // средствами jQuery
 ```
 
 `jQuery.expando` -- это случайная строка, сгенерированная jQuery один раз при входе на страницу. Уникальное свойство, чтобы ничего важного не перезаписать.</li> 
 <li>...А сами данные сохраняются в специальном объекте `jQuery.cache`:
 
 ```js
+//+ no-beautify
 jQuery.cache[id]['prop'] = { anything: "любой объект" };
 ```
 
@@ -55,20 +57,37 @@ jQuery.cache[id]['prop'] = { anything: "любой объект" };
 
 ## Примеры утечек в jQuery
 
-Следующий код создает jQuery-утечку во всех браузерах:
+Следующая функция `leak` создает jQuery-утечку во всех браузерах:
 
-```js
-$('<div/>')
-  .html(new Array(1000).join('text')) // div с текстом, возможна AJAX-загрузка
-  .click(function() { })
-  .appendTo('#data')
 
-document.getElementById('data').innerHTML = ''; // (*)
+```html
+<!--+ run -->
+<script src="http://code.jquery.com/jquery.min.js"></script>
+
+<div id="data"></div>
+
+<script>
+  function leak() {
+
+*!*
+    $('<div/>')
+      .html(new Array(1000).join('text'))
+      .click(function() {})
+      .appendTo('#data');
+
+    document.getElementById('data').innerHTML = '';
+*/!*
+
+  }
+
+  var interval = setInterval(leak, 10)
+</script>
+
+Утечка идёт...
+
+<input type="button" onclick="clearInterval(interval)" value="stop" />
 ```
 
-Полный пример:
-
-[codetabs src="jquery-leak"]
 
 Утечка происходит потому, что обработчик события в jQuery хранится в данных элемента. В строке `(*)` элемент удален очисткой родительского `innerHTML`, но в `jQuery.cache` данные остались. 
 
@@ -79,9 +98,9 @@ document.getElementById('data').innerHTML = ''; // (*)
 Этот код также создает утечку:
 
 ```js
-function go() {
+function leak() {
   $('<div/>')
-    .click(function() { })
+    .click(function() {})
 }
 ```
 
diff --git a/6-optimize/2-memory-leaks-jquery/jquery-leak.view/index.html b/6-optimize/2-memory-leaks-jquery/jquery-leak.view/index.html
deleted file mode 100644
index 60287eb5..00000000
--- a/6-optimize/2-memory-leaks-jquery/jquery-leak.view/index.html
+++ /dev/null
@@ -1,34 +0,0 @@
-<!DOCTYPE HTML>
-<html>
-
-<head>
-  <meta charset="utf-8">
-  <script src="http://code.jquery.com/jquery.min.js"></script>
-</head>
-
-<body>
-
-  <div id="data"></div>
-
-  <script>
-    function go() {
-
-      $('<div/>')
-        .html(new Array(1000).join('text'))
-        .click(function() {})
-        .appendTo('#data');
-
-      document.getElementById('data').innerHTML = '';
-
-    }
-
-    var interval = setInterval(go, 10)
-  </script>
-
-  Утечка идёт...
-
-  <input type="button" onclick="clearInterval(interval)" value="stop" />
-
-</body>
-
-</html>
\ No newline at end of file
diff --git a/6-optimize/3-minification/article.md b/6-optimize/3-minification/article.md
index 0ab4f306..22cb1700 100644
--- a/6-optimize/3-minification/article.md
+++ b/6-optimize/3-minification/article.md
@@ -89,7 +89,7 @@ dot -Tsvg my.dot -o my.svg
 function User(name) {
 
   this.sayHi = function() {
-    alert(name);
+    alert( name );
   };
 
 }
@@ -139,13 +139,14 @@ var minIEVersion = 8;
 
 ```js
 function test(a, b) {
-   run(a, 'my'+'string', 600*600*5, 1 && 0, b && 0)
+  run(a, 'my' + 'string', 600 * 600 * 5, 1 && 0, b && 0)
 }
 ```
 
 После:
 
 ```js
+//+ no-beautify
 function test(a,b){run(a,"mystring",18E5,0,b&&0)};
 ```
 
@@ -169,6 +170,7 @@ function sayHi(*!*name*/!*, *!*message*/!*) {
 После оптимизации:
 
 ```js
+//+ no-beautify
 function sayHi(a,b){alert(a+" сказал: "+b)};
 ```
 
@@ -186,13 +188,14 @@ function sayHi(a,b){alert(a+" сказал: "+b)};
 function test(nodeId) {
   var elem = document.getElementsById(nodeId);
   var parent = elem.parentNode;
-  alert(parent);
+  alert( parent );
 }
 ```
 
 После оптимизации GCC:
 
 ```js
+//+ no-beautify
 function test(a){a=document.getElementsById(a).parentNode;alert(a)};
 ```
 
@@ -210,22 +213,23 @@ function test(a){a=document.getElementsById(a).parentNode;alert(a)};
 ```js
 function test(node) {
   var parent = node.parentNode;
-  
+
   if (0) {
-    alert("Привет с параллельной планеты");
+    alert( "Привет с параллельной планеты" );
   } else {
-    alert("Останется только один");
+    alert( "Останется только один" );
   }
 
   return;
 
-  alert(1);
+  alert( 1 );
 }
 ```
 
 После оптимизации:
 
 ```js
+//+ no-beautify
 function test(){alert("Останется только один")}
 ```
 
@@ -244,25 +248,26 @@ function test(){alert("Останется только один")}
 ```js
 var i = 0;
 while (i++ < 10) {
-  alert(i);
+  alert( i );
 }
 
 if (i) {
-  alert(i);
+  alert( i );
 }
 
-if (i=='1') {
-  alert(1);
-} else if(i == '2') {
-  alert(2);
+if (i == '1') {
+  alert( 1 );
+} else if (i == '2') {
+  alert( 2 );
 } else {
-  alert(i);
+  alert( i );
 }
 ```
 
 После оптимизации:
 
 ```js
+//+ no-beautify
 for(var i=0;10>i++;)alert(i);i&&alert(i);"1"==i?alert(1):"2"==i?alert(2):alert(i);
 ```
 
@@ -299,9 +304,9 @@ function sayHi(message) {
 После оптимизации (переводы строк также будут убраны):
 
 ```js
-function sayHi(b){
-  var a=document.createElement("div");
-  a.innerHTML=b;
+function sayHi(b) {
+  var a = document.createElement("div");
+  a.innerHTML = b;
   document.body.appendChild(a)
 };
 ```
@@ -323,43 +328,44 @@ function sayHi(b){
 
   window.sayHi = function() {
     if (isVisible) {
-      alert(hi);
-      alert(hi);
-      alert(hi);
-      alert(hi);
-      alert(hi);
-      alert(hi);
-      alert(hi);
-      alert(hi);
-      alert(hi);
-      alert(hi);
-      alert(hi);
-      alert(hi);
-    } 
+      alert( hi );
+      alert( hi );
+      alert( hi );
+      alert( hi );
+      alert( hi );
+      alert( hi );
+      alert( hi );
+      alert( hi );
+      alert( hi );
+      alert( hi );
+      alert( hi );
+      alert( hi );
+    }
   }
-  
+
 })();
 ```
 
 После оптимизации:
 
 ```js
-(function(){
-  window.sayHi=function(){
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-    alert("Привет вам из JavaScript");
-  };
-}})();
+(function() {
+    window.sayHi = function() {
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+      alert( "Привет вам из JavaScript" );
+    };
+  }
+})();
 ```
 
 <ul>
@@ -385,6 +391,7 @@ function sayHi(b){
 <li>Убираются лишние кавычки у ключей
 
 ```js
+//+ no-beautify
 {"prop" : "val" }   =>  {prop:"val"}
 ```
 
@@ -392,6 +399,7 @@ function sayHi(b){
 <li>Упрощаются простые вызовы `Array/Object`
 
 ```js
+//+ no-beautify
 a = new Array()   =>  a = []
 o = new Object()  => o = {}
 ```
@@ -414,6 +422,7 @@ o = new Object()  => o = {}
 Рассмотрим код:
 
 ```js
+//+ no-beautify
 function changePosition(style) {
   var position, test;
 
@@ -432,6 +441,7 @@ function changePosition(style) {
 Можно ли в такой ситуации заменить локальную переменную на более короткую? Очевидно, нет:
 
 ```js
+//+ no-beautify
 function changePosition(style) {
   var a, b;
 
@@ -446,6 +456,7 @@ function changePosition(style) {
 Такая же опасность для сжатия кроется в использованном `eval`. Ведь `eval` может обращаться к локальным переменным:
 
 ```js
+//+ no-beautify
 function f(code) {
   var myVar;
 
@@ -481,32 +492,22 @@ function f(code) {
 
 ```js
 //+ run
-var isIE /*@cc_on =true@*/;
+var isIE /*@cc_on =true@*/ ;
 
-alert(isIE); // true в IE.
+alert( isIE ); // true в IE10-
 ```
 
-Там же доступны и дополнительные директивы: `@_jscript_version`, `@if` и т.п., но речь здесь не о том.
-
-Для минификаторов этот "условный" комментарий -- всего лишь обычный комментарий. Они его удалят. Получится, что код не поймёт, где же IE.
-
-Что делать?
-
-<ol>
-<li>Первое и наиболее корректное решение -- не использовать условную компиляцию.</li>
-<li>Второе, если уж очень надо -- применить хак, завернуть его в `eval` или `new Function` (чтобы сжиматель не ругался):
+Можно хитро сделать, чтобы комментарий остался, например так:
 
 ```js
 //+ run
 var isIE = new Function('', '/*@cc_on return true@*/')();
 
-alert(isIE); // true в IE.
+alert( isIE ); // true в IE.
 ```
 
-</li>
-</ol>
 
-Ещё раз заметим, что в современных IE11+ эта компиляция не работает в любом случае.
+...Однако, с учётом того, что в современных IE11+ эта компиляция не работает в любом случае, лучше избавиться от неё вообще.
 
 В следующих главах мы посмотрим, какие продвинутые возможности есть в минификаторах, как сделать сжатие более эффективным.
 
diff --git a/6-optimize/4-better-minification/article.md b/6-optimize/4-better-minification/article.md
index e5560ba9..5220f678 100644
--- a/6-optimize/4-better-minification/article.md
+++ b/6-optimize/4-better-minification/article.md
@@ -28,12 +28,12 @@
 function User(firstName, lastName) {
   var fullName = firstName + ' ' + lastName;
 
-  this.sayHi = function() { 
+  this.sayHi = function() {
     showMessage(fullName);
   }
 
   function showMessage(msg) {
-    alert('**' + msg + '**');
+    alert( '**' + msg + '**' );
   }
 }
 ```
@@ -46,13 +46,13 @@ function User(firstName, lastName) {
   this._lastName = lastName;
 }
 
-User.prototype.sayHi = function() { 
+User.prototype.sayHi = function() {
   this._showMessage(this._fullName);
 }
 
 
-User.prototype._showMessage = function(msg) { 
-  alert('**' + msg + '**');
+User.prototype._showMessage = function(msg) {
+  alert( '**' + msg + '**' );
 }
 ```
 
@@ -71,21 +71,21 @@ User.prototype._showMessage = function(msg) {
 Проще всего это сделать локальной переменной в модуле:
 
 ```js
-(function($) {      
+(function($) {
 
 *!*
-   /** @const */
-   var platform = 'IE';  
+  /** @const */
+  var platform = 'IE';
 */!*
 
-   // .....
-   
-   if (platform == 'IE') {
-       alert('IE');
-   } else {
-       alert('NON-IE');
-   }
-   
+  // .....
+
+  if (platform == 'IE') {
+    alert( 'IE' );
+  } else {
+    alert( 'NON-IE' );
+  }
+
 })(jQuery);
 ```
 
@@ -108,16 +108,16 @@ UglifyJS и GCC позволяют задать значение глобаль
 ```js
 // my.js
 if (isIE) {
-  alert("Привет от IE");
-} else {  
-  alert("Не IE :)");
+  alert( "Привет от IE" );
+} else {
+  alert( "Не IE :)" );
 }
 ```
 
 Сжатие вызовом `uglifyjs -d isIE my.js` даст:
 
 ```js
-alert("Привет от IE");
+alert( "Привет от IE" );
 ```
 
 ..Ну а чтобы код работал в обычном окружении, нужно определить в нём значение переменной по умолчанию. Это обычно делается в каком-то другом файле (на весь проект), так как если объявить `var isIE` в этом, то флаг `-d isIE` не сработает.
@@ -147,24 +147,24 @@ var uglify = require('uglify-js');
 var pro = uglify.uglify;
 
 function ast_squeeze_console(ast) {
-    var w = pro.ast_walker(),
-        walk = w.walk,
-        scope;
-    return w.with_walkers({
-        "stat": function(stmt) {
-            if(stmt[0] === "call" && stmt[1][0] == "dot" && stmt[1][1] instanceof Array && stmt[1][1][0] == 'name' && stmt[1][1][1] == "log") {
-                return ["block"];
-            }
-            return ["stat", walk(stmt)];
-        },
-        "call": function(expr, args) {
-            if(expr[0] == "dot" && expr[1] instanceof Array && expr[1][0] == 'name' && expr[1][1] == "console") {
-                return ["atom", "0"];
-            }
-        }
-    }, function() {
-        return walk(ast);
-    });
+  var w = pro.ast_walker(),
+    walk = w.walk,
+    scope;
+  return w.with_walkers({
+    "stat": function(stmt) {
+      if (stmt[0] === "call" && stmt[1][0] == "dot" && stmt[1][1] instanceof Array && stmt[1][1][0] == 'name' && stmt[1][1][1] == "log") {
+        return ["block"];
+      }
+      return ["stat", walk(stmt)];
+    },
+    "call": function(expr, args) {
+      if (expr[0] == "dot" && expr[1] instanceof Array && expr[1][0] == 'name' && expr[1][1] == "console") {
+        return ["atom", "0"];
+      }
+    }
+  }, function() {
+    return walk(ast);
+  });
 };
 ```
 
diff --git a/6-optimize/5-gcc-advanced-optimization/article.md b/6-optimize/5-gcc-advanced-optimization/article.md
index fbcdb00c..db9d0cb8 100644
--- a/6-optimize/5-gcc-advanced-optimization/article.md
+++ b/6-optimize/5-gcc-advanced-optimization/article.md
@@ -35,7 +35,7 @@ java -jar compiler.jar --compilation_level ADVANCED_OPTIMIZATIONS --js my.js
 
 ```js
 function test(n) {
-  alert("this is my test number " + n);
+  alert( "this is my test number " + n );
 }
 test(1);
 test(2);
@@ -121,13 +121,17 @@ first:2 --module second:1:first
 Например:
 
 ```js
-document.onkeyup = function(event) { alert(event.type) }
+document.onkeyup = function(event) {
+  alert(event.type)
+}
 ```
 
 После продвинутого сжатия:
 
 ```js
-document.onkeyup = function(a) { alert(a.type) }
+document.onkeyup = function(a) {
+  alert(a.type)
+}
 ```
 
 Как видите, переименованной оказалась только переменная `event`. Такое переименование заведомо безопасно, т.к. `event` -- локальная переменная.
@@ -135,13 +139,17 @@ document.onkeyup = function(a) { alert(a.type) }
 Почему компилятор не тронул остального? Попробуем другой вариант:
 
 ```js
-document.blabla = function(event) { alert(event.megaProperty) }
+document.blabla = function(event) {
+  alert(event.megaProperty)
+}
 ```
 
 После компиляции:
 
 ```js
-document.a = function(a) { alert(a.b) }
+document.a = function(a) {
+  alert(a.b)
+}
 ```
 
 Теперь компилятор переименовал и <code>blabla</code> и <code>megaProperty</code>. 
@@ -175,9 +183,9 @@ window.a = function(a) {
 
 ```js
 window['User'] = function(name, type, age) {
-	this.name = name
-	this.type = type
-	this.age = age
+  this.name = name
+  this.type = type
+  this.age = age
 }
 ```
 
@@ -253,9 +261,9 @@ SayWidget.prototype = {
   init: function() {
     this.elem.style.display = 'none'
   },
-	
+
   setSayHandler: function() {
-    this.elem.onclick = function() { 
+    this.elem.onclick = function() {
       alert("hi")
     };
   }
@@ -268,6 +276,7 @@ SayWidget.prototype['setSayHandler'] = SayWidget.prototype.setSayHandler;
 После сжатия:
 
 ```js
+//+ no-beautify
 function a(b) {
   this.a = b;
   this.b()
@@ -428,6 +437,7 @@ MyFramework.publicOne();
 Результат компиляции в обычном режиме:
 
 ```js
+//+ no-beautify
 // java -jar compiler.jar --js myframework.js --formatting PRETTY_PRINT
 (function(a) {
   a = a.MyFramework = {};
diff --git a/6-optimize/6-gcc-check-types/article.md b/6-optimize/6-gcc-check-types/article.md
index 293a4dda..8c625359 100644
--- a/6-optimize/6-gcc-check-types/article.md
+++ b/6-optimize/6-gcc-check-types/article.md
@@ -51,7 +51,7 @@ function f1(id) {
 }
 
 /** @param {string} id */
-function f2(id) { }
+function f2(id) {}
 ```
 
 Такой вызов приведёт к предупреждению со стороны минификатора:
@@ -122,13 +122,13 @@ required: (Node|null)
 /** @param {!Node} node */
 */!*
 function removeNode(node) {
-	node.parentNode.removeChild(node)
+  node.parentNode.removeChild(node)
 }
 ```
 
 Восклицательный знак означает, что параметр обязатален.
 
-Найти описания встроенных типов и объектов javascript вы можете в файле экстернов: <code>externs.zip</code> находится в корне архива <code>compiler.jar</code>, или в соответствующей директории SVN: <a href="http://closure-compiler.googlecode.com/svn/trunk/externs/">http://closure-compiler.googlecode.com/svn/trunk/externs/</a>.
+Найти описания встроенных типов и объектов javascript вы можете в файле экстернов: <code>externs.zip</code> находится в корне архива <code>compiler.jar</code>.
 
 ## Интеграция с проверками типов из Google Closure Library
 
@@ -138,7 +138,9 @@ Google Closure Compiler знает о них и понимает, что вну
 
 ```js
 var goog = {
-  isFunction: function(f) { return typeof f == 'function' }
+  isFunction: function(f) {
+    return typeof f == 'function'
+  }
 }
 
 if (goog.isFunction(func)) {
@@ -168,7 +170,7 @@ required: (Object|null|undefined)
 
 Также можно указывать количество и тип параметров функции, ключевого слова <code>this</code>, объявлять классы, приватные методы и интерфейсы.
 
-Проверка типов javascript, предоставляемая Google Closure Compiler - пожалуй, самая продвинутая из существующих на сегодняшний день.
+Проверка типов javascript, предоставляемая Google Closure Compiler -- пожалуй, самая продвинутая из существующих на сегодняшний день.
 
 C ней аннотации, документирующие типы и параметры, становятся не просто украшением, а реальным средством проверки, уменьшающим количество ошибок на production.
 
diff --git a/6-optimize/7-gcc-closure-library/article.md b/6-optimize/7-gcc-closure-library/article.md
index ffd5d881..0c02e685 100644
--- a/6-optimize/7-gcc-closure-library/article.md
+++ b/6-optimize/7-gcc-closure-library/article.md
@@ -36,9 +36,9 @@ var COMPILED = false;
 
 ```js
 goog.require = function(rule) {
-   // ...
+  // ...
   if (!COMPILED) {
-     // основное тело функции
+    // основное тело функции
   }
 }
 ```
@@ -49,14 +49,14 @@ goog.require = function(rule) {
 /** @define {boolean} */
 var COMPILED = false
 
-Framework = { }
+Framework = {}
 
 Framework.sayCompiled = function() {
-	if (!COMPILED) {
-		alert("Not compressed")
-	} else {
-		alert("Compressed")
-	}
+  if (!COMPILED) {
+    alert("Not compressed")
+  } else {
+    alert("Compressed")
+  }
 }
 ```
 
@@ -65,7 +65,7 @@ Framework.sayCompiled = function() {
 ```js
 Framework = {};
 Framework.sayCompiled = Framework.a = function() {
-  alert("Compressed");
+  alert( "Compressed" );
 };
 ```
 
@@ -102,13 +102,12 @@ Google Closure Library умеет преобразовывать классы CS
 Например, следующая функция задает такой список.
 
 ```js
- 
-goog.setCssNameMapping({
+ goog.setCssNameMapping({
    "goog-menu": "a",
    "goog-menu-disabled": "a-b",
    "CSS_LOGO": "b",
    "hidden": "c"
-});
+ });
 ```
 
 Тогда следующий вызов преобразуется в "a a-b":
@@ -151,9 +150,8 @@ Google Closure Compiler производит соответствующие пр
 
 ```js
 /** @export */
-function Widget() {
-}
-/** @export */
+function Widget() {}
+  /** @export */
 Widget.prototype.hide = function() {
   this.elem.style.display = 'none'
 }
@@ -162,8 +160,7 @@ Widget.prototype.hide = function() {
 После компиляции в продвинутом режиме:
 
 ```js
-function a() {
-}
+function a() {}
 goog.d("Widget", a);
 a.prototype.a = function() {
   this.b.style.display = "none"
diff --git a/6-optimize/8-memory-removechild-innerhtml/article.md b/6-optimize/8-memory-removechild-innerhtml/article.md
index 5c2e1457..b0b71bfc 100644
--- a/6-optimize/8-memory-removechild-innerhtml/article.md
+++ b/6-optimize/8-memory-removechild-innerhtml/article.md
@@ -9,6 +9,7 @@
 
 ```html
 <html>
+
 <body>
   <div>
     <ul>
@@ -17,6 +18,7 @@
     Сосед
   </div>
 </body>
+
 </html>
 ```
 
@@ -75,9 +77,9 @@ document.body.innerHTML = "";
   var list = document.getElementsByTagName('ul')[0];
   document.body.innerHTML = ''; // удалили DIV 
 
-  alert(list.parentNode);  // цела ли ссылка UL -> DIV ?
-  alert(list.nextSibling); // живы ли соседи UL ?
-  alert(list.children.length);  // живы ли потомки UL ?
+  alert( list.parentNode ); // цела ли ссылка UL -> DIV ?
+  alert( list.nextSibling ); // живы ли соседи UL ?
+  alert( list.children.length ); // живы ли потомки UL ?
 </script>
 ```
 
diff --git a/7-frames-and-windows/2-iframes/article.md b/7-frames-and-windows/2-iframes/article.md
index 757c55a2..744effa2 100644
--- a/7-frames-and-windows/2-iframes/article.md
+++ b/7-frames-and-windows/2-iframes/article.md
@@ -49,13 +49,13 @@
   var iframe = document.getElementsByTagName('iframe')[0];
 
   // сработает
-  iframe.onload = function() { 
-    alert("iframe onload"); 
+  iframe.onload = function() {
+    alert( "iframe onload" );
   };
 
   // не сработает
-  iframe.contentWindow.onload = function() { 
-    alert("contentWindow onload"); 
+  iframe.contentWindow.onload = function() {
+    alert( "contentWindow onload" );
   };
 </script>
 ```
@@ -80,13 +80,13 @@
 <!--+ run -->
 <iframe src="javascript:''" style="height:80px" name="i"></iframe>
 
-<script>  
+<script>
   var iframeTag = document.body.children[0];
 
   var iframeWindow = iframe.contentWindow; // окно из тега
 
-  alert(frames[0] === iframeWindow); // true, окно из коллекции frames
-  alert(frames.i == iframeWindow); // true, окно из frames по имени
+  alert( frames[0] === iframeWindow ); // true, окно из коллекции frames
+  alert( frames.i == iframeWindow ); // true, окно из frames по имени
 </script>
 ```
 
@@ -122,9 +122,9 @@ window.frames[0].frames[0].frames[0].top === window
 ```js
 //+ run
 if (window == top) {
-  alert('Этот скрипт является окном верхнего уровня в браузере');
+  alert( 'Этот скрипт является окном верхнего уровня в браузере' );
 } else {
-  alert('Этот скрипт исполняется во фрейме!');
+  alert( 'Этот скрипт исполняется во фрейме!' );
 }
 ```
 
diff --git a/7-frames-and-windows/3-same-origin-policy/article.md b/7-frames-and-windows/3-same-origin-policy/article.md
index cdcb52c5..7512148d 100644
--- a/7-frames-and-windows/3-same-origin-policy/article.md
+++ b/7-frames-and-windows/3-same-origin-policy/article.md
@@ -40,15 +40,14 @@
 
 <script>
   var iframe = document.body.children[0];
-  
+
   iframe.onload = function() {
     try {
-      alert(iframe.contentWindow.document);
-    } catch(e) {
-      alert("Ошибка: " + e.message);
+      alert( iframe.contentWindow.document );
+    } catch (e) {
+      alert( "Ошибка: " + e.message );
     }
   }
-
 </script>
 ```
 
@@ -68,21 +67,20 @@
 
 <script>
   var iframe = document.body.children[0];
-  
+
   iframe.onload = function() {
     try {
       // не сработает (чтение)
-      alert(iframe.contentWindow.location.href);
-    } catch(e) {
-      alert("Ошибка: " + e.message);
+      alert( iframe.contentWindow.location.href );
+    } catch (e) {
+      alert( "Ошибка: " + e.message );
     }
 
     // сработает (запись)
     iframe.contentWindow.location.href = 'http://wikipedia.org';
 
-    iframe.onload = null; 
+    iframe.onload = null;
   }
-
 </script>
 ```
 
diff --git a/7-frames-and-windows/4-cross-window-messaging-with-postmessage/article.md b/7-frames-and-windows/4-cross-window-messaging-with-postmessage/article.md
index 76075ca4..12cd7e6d 100644
--- a/7-frames-and-windows/4-cross-window-messaging-with-postmessage/article.md
+++ b/7-frames-and-windows/4-cross-window-messaging-with-postmessage/article.md
@@ -26,6 +26,7 @@
 
 Например:
 ```html
+<!--+ no-beautify -->
 <iframe src="http://target.com" name="target">
 
 <script>
@@ -60,15 +61,15 @@
 
 ```js
 function listener(event) {
-  if( event.origin != 'http://javascript.ru') { 
+  if (event.origin != 'http://javascript.ru') {
     // что-то прислали с неизвестного домена - проигнорируем..    
     return;
   }
 
-  alert("получено: " + event.data);
+  alert( "получено: " + event.data );
 }
 
-if (window.addEventListener){
+if (window.addEventListener) {
   window.addEventListener("message", listener);
 } else {
   // IE8
diff --git a/7-frames-and-windows/5-window-focus/article.md b/7-frames-and-windows/5-window-focus/article.md
index 1ad34e80..f23bc0ce 100644
--- a/7-frames-and-windows/5-window-focus/article.md
+++ b/7-frames-and-windows/5-window-focus/article.md
@@ -15,7 +15,7 @@
 Проверьте, например:
 
 ```js
-//+ run
+//+ run no-beautify
 setInterval(function() { window.focus() }, 1000);
 ```
 
@@ -40,25 +40,25 @@ setInterval(function() { window.focus() }, 1000);
 <!--+ run -->
 <script>
   var win = open('/', 'test', 'width=300,height=300')
- 
+
   function getAttention(win) {
-    if (win.closed) { 
-      alert("Окно закрыто, привлечь внимание к нему нельзя");
+    if (win.closed) {
+      alert( "Окно закрыто, привлечь внимание к нему нельзя" );
       return;
     }
 
     win.focus();
     var i = 0;
     var show = ['************', win.document.title];
- 
-    var focusTimer = setInterval(function() { 
+
+    var focusTimer = setInterval(function() {
       if (win.closed) {
         clearInterval(focusTimer);
         return;
-      }  
+      }
       win.document.title = show[i++ % 2];
     }, 1000);
- 
+
     win.document.onmousemove = function() {
       clearInterval(focusTimer);
       win.document.title = show[1];
@@ -66,7 +66,7 @@ setInterval(function() { window.focus() }, 1000);
     }
   }
 </script>
-   
+
 <input type="button" onclick="getAttention(win)" value="getAttention(win)">
 ```
 
@@ -88,8 +88,8 @@ setInterval(function() { window.focus() }, 1000);
   var win = open('/', 'test', 'width=300,height=300')
 
   function getAttention(win) {
-    if (win.closed) { 
-      alert("Окно закрыто, привлечь внимание к нему нельзя");
+    if (win.closed) {
+      alert( "Окно закрыто, привлечь внимание к нему нельзя" );
       return;
     }
 
@@ -97,21 +97,21 @@ setInterval(function() { window.focus() }, 1000);
     var show = ['************', win.document.title];
 
     function stop() {
-      clearInterval(focusTimer); 
-      win.document.title = show[1];      
+      clearInterval(focusTimer);
+      win.document.title = show[1];
     }
- 
-    win.onfocus = function() { 
+
+    win.onfocus = function() {
       stop();
       win.onfocus = null;
     }
-      
-    var focusTimer = setInterval(function() { 
+
+    var focusTimer = setInterval(function() {
       if (win.closed) {
         clearInterval(focusTimer);
         return;
-      } 
-     
+      }
+
       win.document.title = show[i++ % 2];
     }, 1000);
 
diff --git a/7-frames-and-windows/6-clickjacking/article.md b/7-frames-and-windows/6-clickjacking/article.md
index 0154d7f1..fdb5c622 100644
--- a/7-frames-and-windows/6-clickjacking/article.md
+++ b/7-frames-and-windows/6-clickjacking/article.md
@@ -23,7 +23,7 @@
 Вот пример вредоносной страницы (для наглядности `iframe` -- полупрозрачный):
 
 ```html
-<!--+ run height=120 -->
+<!--+ run height=120  no-beautify -->
 <style>
 iframe { /* iframe с сайта-жертвы */
   width: 400px;
@@ -164,10 +164,10 @@ Firefox и старый IE могут активировать designMode на 
 ```html
 <style>
   #iframe-protector {
-    height: 100%; 
-    width: 100%; 
-    position: absolute; 
-    left: 0; 
+    height: 100%;
+    width: 100%;
+    position: absolute;
+    left: 0;
     top: 0;
     z-index: 99999999;
   }
@@ -179,7 +179,7 @@ Firefox и старый IE могут активировать designMode на 
 
 <script>
   if (top.document.domain == document.domain) {
-    убрать iframe-protector
+    убрать iframe - protector
   }
 </script>
 ```
diff --git a/8-css-for-js/10-box-sizing/article.md b/8-css-for-js/10-box-sizing/article.md
index 0baa65ed..9fac4383 100644
--- a/8-css-for-js/10-box-sizing/article.md
+++ b/8-css-for-js/10-box-sizing/article.md
@@ -16,6 +16,7 @@
 Для большей наглядности посмотрим на картинку этого `div` в зависимости от `box-sizing`:
 
 ```css
+/*+ no-beautify */
 div {
   width: 200px;
   height: 100px;
@@ -49,10 +50,12 @@ div {
     width: 200px;
     border: 2px solid green;
   }
-
-  form input, form select {
+  
+  form input,
+  form select {
     display: block;
-    padding-left: 5px; /* padding для красоты */
+    padding-left: 5px;
+    /* padding для красоты */
   }
 </style>
 
@@ -60,7 +63,9 @@ div {
 *!*
   <input>
   <input>
-  <select><option>опции</option></select>
+  <select>
+    <option>опции</option>
+  </select>
 */!*
 </form>
 ```
@@ -74,7 +79,7 @@ div {
 Попробуем:
 
 ```html
-<!--+ autorun height=100 -->
+<!--+ autorun height=100  no-beautify -->
 <style>
   form {
     width: 200px;
@@ -114,26 +119,34 @@ div {
     width: 200px;
     border: 2px solid green;
   }
- 
   /* убрать padding/border */
-  form input, form select { 
+  
+  form input,
+  form select {
     padding: 0;
     border: 0;
-    width: 100%; 
+    width: 100%;
   }
-
   /* внешний div даст дизайн */
+  
   form div {
     padding-left: 5px;
     border: 1px solid black;
   }
-
 </style>
 
 <form>
-  <div><input></div>
-  <div><input></div>
-  <div><select><option>опции</option></select></div>
+  <div>
+    <input>
+  </div>
+  <div>
+    <input>
+  </div>
+  <div>
+    <select>
+      <option>опции</option>
+    </select>
+  </div>
 </form>
 ```
 
@@ -148,7 +161,7 @@ div {
 **При помощи `box-sizing: border-box` мы можем сказать браузеру, что ширина, которую мы ставим, относится к элементу полностью, включая `border` и `padding`**:
 
 ```html
-<!--+ autorun height=100 -->
+<!--+ autorun height=100  no-beautify -->
 <style>
   form {
     width: 200px;
diff --git a/8-css-for-js/11-margin/1-failing-margins/task.md b/8-css-for-js/11-margin/1-failing-margins/task.md
index e796ec03..4db46598 100644
--- a/8-css-for-js/11-margin/1-failing-margins/task.md
+++ b/8-css-for-js/11-margin/1-failing-margins/task.md
@@ -11,7 +11,7 @@
 Однако, как видите, это не получается. Почему? Как поправить?
 
 ```html
-<!--+ autorun run -->
+<!--+ autorun run  no-beautify -->
   
 <style>
   .block {
diff --git a/8-css-for-js/11-margin/article.md b/8-css-for-js/11-margin/article.md
index 2adf5f78..9416f464 100644
--- a/8-css-for-js/11-margin/article.md
+++ b/8-css-for-js/11-margin/article.md
@@ -48,7 +48,8 @@
     margin: 2em;
     font: .8em/1.25 Arial, sans-serif;
   }
-  h2 { 
+  
+  h2 {
     background: #aef;
     margin: 0 0 0.8em 0;
   }
@@ -65,8 +66,8 @@
 
   <p>Водитель механического транспортного средства обязан иметь при себе и по требованию сотрудников милиции передавать им для проверки:</p>
   <ul>
-  <li>водительское удостоверение на право управления транспортным средством соответствующей категории;</li>
-  <li>...и так далее...</li>
+    <li>водительское удостоверение на право управления транспортным средством соответствующей категории;</li>
+    <li>...и так далее...</li>
   </ul>
 </div>
 ```
@@ -75,6 +76,7 @@
 
 ```css
 /* вверх чуть больше, чем на высоту строки (1.25em) */
+
 h2 {
   margin-top: -1.3em;
 }
@@ -117,6 +119,7 @@ h2 {
 Для красоты мы хотим, чтобы отчерк `HR` начинался левее, чем основной текст. Отрицательный `margin-left` нам поможет:
 
 ```css
+/*+ no-beautify */
 hr.margin { margin-left: -2em; }
 
 /* для сравнения */
diff --git a/8-css-for-js/12-space-under-img/article.md b/8-css-for-js/12-space-under-img/article.md
index 717c363e..31d971f4 100644
--- a/8-css-for-js/12-space-under-img/article.md
+++ b/8-css-for-js/12-space-under-img/article.md
@@ -6,12 +6,17 @@
 Например:
 
 ```html
-<style> * { margin: 0; padding: 0; } </style>
+<style>
+  * {
+    margin: 0;
+    padding: 0;
+  }
+</style>
 <table>
   <tr>
-  <td style="border:1px red solid">
-    <img src="square.png">
-  </td>
+    <td style="border:1px red solid">
+      <img src="square.png">
+    </td>
   </tr>
 </table>
 ```
@@ -30,17 +35,24 @@
 Самый лучший способ избежать этого -- поставить `display: block` таким картинкам:
 
 ```html
-<style> 
-  * { margin: 0; padding: 0; }
+<!--+ no-beautify -->
+<style>
+  * {
+    margin: 0;
+    padding: 0;
+  }
+  
 *!*
-  img { display: block }
+  img {
+    display: block
+  } 
 */!*
 </style>
 <table>
   <tr>
-  <td style="border:1px red solid">
-    <img src="square.png">
-  </td>
+    <td style="border:1px red solid">
+      <img src="square.png">
+    </td>
   </tr>
 </table>
 ```
@@ -60,17 +72,24 @@
 При этом браузер не будет оставлять место под изображением, так как запланирует продолжение строки сверху, а не снизу:
 
 ```html
-<style> 
-  * { margin: 0; padding: 0; }
+<!--+ no-beautify -->
+<style>
+  * {
+    margin: 0;
+    padding: 0;
+  }
+  
 *!*
-  img { vertical-align: top}
+  img {
+    vertical-align: top
+  }
 */!*
 </style>
 <table>
   <tr>
-  <td style="border:1px red solid">
-    <img src="square.png">
-  </td>
+    <td style="border:1px red solid">
+      <img src="square.png">
+    </td>
   </tr>
 </table>
 ```
@@ -90,18 +109,28 @@
 Таким образом, требуется уменьшить еще и `line-height` контейнера. Окончательное решение для маленьких изображений с `vertical-align`:
 
 ```html
-<style> 
-  * { margin: 0; padding: 0; }
+<!--+ no-beautify -->
+<style>
+  * {
+    margin: 0;
+    padding: 0;
+  }
+  
 *!*
-  td { line-height: 1px }
-  img { vertical-align: top }
+  td {
+    line-height: 1px
+  }
+  
+  img {
+    vertical-align: top
+  } 
 */!*
 </style>
 <table>
   <tr>
-  <td style="border:1px red solid">
-    <img src="square.png" style="height:10px">
-  </td>
+    <td style="border:1px red solid">
+      <img src="square.png" style="height:10px">
+    </td>
   </tr>
 </table>
 ```
diff --git a/8-css-for-js/13-overflow/article.md b/8-css-for-js/13-overflow/article.md
index 4a0cf229..666fdca8 100644
--- a/8-css-for-js/13-overflow/article.md
+++ b/8-css-for-js/13-overflow/article.md
@@ -21,7 +21,7 @@
 Например:
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <style>
   .overflow {
 *!*
@@ -47,7 +47,7 @@
 Переполняющее содержимое не отображается.
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <style>
   .overflow {
 *!*
@@ -75,7 +75,7 @@
 При переполнении отображается полоса прокрутки.
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <style>
   .overflow {
 *!*
@@ -99,7 +99,7 @@
 Полоса прокрутки отображается всегда.
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <style>
   .overflow {
 *!*
@@ -124,7 +124,7 @@
 Можно указать поведение блока при переполнении по ширине в `overflow-x` и высоте -- в `overflow-y`:
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <style>
   .overflow {
 *!*
diff --git a/8-css-for-js/14-height-percent/article.md b/8-css-for-js/14-height-percent/article.md
index f14e71b1..17fa95ce 100644
--- a/8-css-for-js/14-height-percent/article.md
+++ b/8-css-for-js/14-height-percent/article.md
@@ -22,8 +22,8 @@
 
 ```html
 <div class="container">
-  <div class="toggler"> 
-    <!-- стрелка влево при помощи CSS, ширина фиксирована --> 
+  <div class="toggler">
+    <!-- стрелка влево при помощи CSS, ширина фиксирована -->
   </div>
   <div class="content">
     ...Текст...
@@ -84,6 +84,7 @@ CSS:
 Например:
 
 ```css
+/*+ no-beautify */
 .container {
   height: 200px; /* теперь height в % внутри будет работать */
 }
diff --git a/8-css-for-js/15-css-selectors/1-select-elements-selector/task.md b/8-css-for-js/15-css-selectors/1-select-elements-selector/task.md
index 46322989..b930d92e 100644
--- a/8-css-for-js/15-css-selectors/1-select-elements-selector/task.md
+++ b/8-css-for-js/15-css-selectors/1-select-elements-selector/task.md
@@ -5,8 +5,8 @@
 HTML-документ:
 
 ```html
-<input type="checkbox"> 
-<input type="checkbox" checked> 
+<input type="checkbox">
+<input type="checkbox" checked>
 <input type="text" id="message">
 
 <h3 id="widget-title">Сообщения:</h3>
diff --git a/8-css-for-js/15-css-selectors/article.md b/8-css-for-js/15-css-selectors/article.md
index 218b845d..c9282ae3 100644
--- a/8-css-for-js/15-css-selectors/article.md
+++ b/8-css-for-js/15-css-selectors/article.md
@@ -56,32 +56,33 @@ CSS3-селекторы -- фундаментально полезная вещ
 CSS-селекторы:
 
 ```css
-##languages li {
+/*+ no-beautify */
+#languages li {
   color: brown;   /* потомки #languages, подходящие под селектор  LI */
 }
 
-##languages > li {
+#languages > li {
   color: black;   /* первый уровень детей #languages подходящих под LI */
 }
 
-##e-slavic { font-style: italic; }
+#e-slavic { font-style: italic; }
 
 *!*
-##e-slavic ~ li {  /* правые соседи #e-slavic с селектором LI */
+#e-slavic ~ li {  /* правые соседи #e-slavic с селектором LI */
   color: red;
 }
 */!*
 
-##latvian { 
+#latvian { 
   font-style: italic;
 }
 
-##latvian * {      /* потомки #latvian, подходяще под * (т.е. любые) */
+#latvian * {      /* потомки #latvian, подходяще под * (т.е. любые) */
   font-style: normal;
 }
 
 *!*
-##latvian + li {  /* первый правый сосед #latvian с селектором LI */
+#latvian + li {  /* первый правый сосед #latvian с селектором LI */
  color: green;
 }
 */!*
@@ -117,7 +118,7 @@ CSS-селекторы:
 [iframe src="nthchild" border="1" edit link]
 
 ```css
-/*+ hide="CSS к примеру выше" */
+/*+ hide="CSS к примеру выше"  no-beautify */
 li:nth-child(2n) { /* чётные */
   background: #eee;
 }
@@ -150,7 +151,7 @@ li:nth-child(3) {  /* 3-ий потомок */
 [iframe src="nthchild-type" border="1" edit link]
 
 ```css
-/*+ hide="CSS к примеру выше" */
+/*+ hide="CSS к примеру выше"  no-beautify */
 dt:nth-of-type(2n) {
   /* чётные dt (соседи с другими тегами игнорируются) */
   background: #eee;
@@ -220,13 +221,13 @@ dd:nth-last-of-type(2) {
 ```html
 <!--+ autorun -->
 <style>
-li::before {
-  content: " [[ ";
-}
-
-li::after {
-  content: " ]] ";
-}
+  li::before {
+    content: " [[ ";
+  }
+  
+  li::after {
+    content: " ]] ";
+  }
 </style>
 
 Обратите внимание: содержимое добавляется <b>внутрь</b> LI.
diff --git a/8-css-for-js/17-css-sprite/article.md b/8-css-for-js/17-css-sprite/article.md
index ddb7bf1c..eba98240 100644
--- a/8-css-for-js/17-css-sprite/article.md
+++ b/8-css-for-js/17-css-sprite/article.md
@@ -11,24 +11,27 @@ CSS-спрайт -- способ объединить много изображ
 
 ```html
 <ul>
-<li class="open">
-  <div class="icon"></div>
-  <div class="text">Раздел 1<br>В две строки</div>
-  <ul>
+  <li class="open">
+    <div class="icon"></div>
+    <div class="text">Раздел 1
+      <br>В две строки</div>
+    <ul>
+      <li class="closed">
+        <div class="icon"></div>
+        <div class="text">Раздел 1.1 в одну строку</div>
+      </li>
+      <li class="leaf">
+        <div class="icon"></div>
+        <div class="text">Страница 1.2
+          <br> в две строки</div>
+      </li>
+    </ul>
+  </li>
   <li class="closed">
     <div class="icon"></div>
-    <div class="text">Раздел 1.1 в одну строку</div>
+    <div class="text">Раздел 2
+      <br>В две строки</div>
   </li>
-  <li class="leaf">
-    <div class="icon"></div>
-    <div class="text">Страница 1.2<br> в две строки</div>
-  </li>
-  </ul>
-</li>
-<li class="closed">
-  <div class="icon"></div>
-  <div class="text">Раздел 2<br>В две строки</div>
-</li>
 </ul>
 ```
 
@@ -78,6 +81,7 @@ CSS-спрайт -- способ объединить много изображ
 А теперь самое забавное. Размер `DIV'а` для иконки -- жёстко фиксирован:
 
 ```css
+/*+ no-beautify */
 .icon {
 *!*
   width: 16px;
@@ -103,6 +107,7 @@ CSS-спрайт -- способ объединить много изображ
 В спрайте `icons.gif` изображения объединены так, что сдвиг на `16px` покажет следующую иконку:
 
 ```css
+/*+ no-beautify */
 .icon {
   width: 16px;
   height: 16px;
@@ -164,6 +169,7 @@ background-position: -90px -40px;
 Его стиль:
 
 ```css
+/*+ no-beautify */
 .rss {
   width: 35px; /* ширина/высота больше чем размер иконки */
   height: 35px;
diff --git a/8-css-for-js/18-css-format/article.md b/8-css-for-js/18-css-format/article.md
index 1926f119..580a92a7 100644
--- a/8-css-for-js/18-css-format/article.md
+++ b/8-css-for-js/18-css-format/article.md
@@ -8,13 +8,15 @@
 Так -- неверно:
 
 ```css
-##snapshot-box h2 { padding: 0 0 6px 0; font-weight: bold; position: absolute; left: 0; top: 0; }
+/*+ no-beautify */
+#snapshot-box h2 { padding: 0 0 6px 0; font-weight: bold; position: absolute; left: 0; top: 0; }
 ```
 
 Так -- правильно:
 
 ```css
-##snapshot-box h2 {
+/*+ no-beautify */
+#snapshot-box h2 {
   position: absolute;
   left: 0;
   top: 0;
@@ -30,7 +32,8 @@
 Неправильно:
 
 ```css
-##snapshot-box h2, #profile-box h2, #order-box h2 {
+/*+ no-beautify */
+#snapshot-box h2, #profile-box h2, #order-box h2 {
   padding: 0 0 6px 0; 
   font-weight: bold; 
 }
@@ -39,9 +42,10 @@
 Правильно:
 
 ```css
-##snapshot-box h2, 
-##profile-box h2, 
-##order-box h2 {
+/*+ no-beautify */
+#snapshot-box h2, 
+#profile-box h2, 
+#order-box h2 {
   padding: 0 0 6px 0; 
   font-weight: bold; 
 }
@@ -71,7 +75,8 @@
 Например:
 
 ```css
-##snapshot-box h2 {
+/*+ no-beautify */
+#snapshot-box h2 {
   position: absolute; /* позиционирование */
   left: 0;
   top: 0;
@@ -110,6 +115,7 @@ box-shadow:0 0 100px 20px #000;
 Этот CSS описывает общий вид страницы, расположение компонент и их дополнительную стилизацию, зависящую от места на странице и т.п.
 
 ```css
+/*+ no-beautify */
 .tab .profile { /* профиль внутри вкладки */
   float: left;
   width: 300px;
diff --git a/8-css-for-js/2-css-units/article.md b/8-css-for-js/2-css-units/article.md
index 34662009..c0271390 100644
--- a/8-css-for-js/2-css-units/article.md
+++ b/8-css-for-js/2-css-units/article.md
@@ -157,7 +157,7 @@
 Протестируем на таком списке:
 
 ```html
-<!--+ run autorun height=150 -->
+<!--+ run autorun height=150  no-beautify -->
 <ul>
 <li>Собака
   <ul>
@@ -188,7 +188,7 @@
 Теперь уменьшим размер шрифта до `0.8em`, вот что получится:
 
 ```html
-<!--+ run autorun height=100 -->
+<!--+ run autorun height=100  no-beautify -->
 <style>
   li {
     font-size: 0.8em;
@@ -229,7 +229,7 @@
 Как правило, браузеры ставят этому элементу некоторый "разумный" (reasonable) размер по-умолчанию, который мы, конечно, можем переопределить и использовать `rem` для задания шрифтов внутри относительно него:
 
 ```html
-<!--+ run height=400 autorun -->
+<!--+ run height=400 autorun  no-beautify -->
 <style>
 *!*
   html {
diff --git a/8-css-for-js/3-display/article.md b/8-css-for-js/3-display/article.md
index 65f74011..f6bf03dc 100644
--- a/8-css-for-js/3-display/article.md
+++ b/8-css-for-js/3-display/article.md
@@ -46,7 +46,7 @@
 Например, инлайновые элементы по умолчанию: `<span>`, `<a>`.
 
 ```html
-<!--+ autorun height=40 -->
+<!--+ autorun height=40  no-beautify -->
 <span style="border:1px solid black">
   <span style="border:1px solid blue; width:50%">Ширина</span>
   <a style="border:1px solid red">Игнорируется</a>
@@ -73,7 +73,7 @@
 Например, три прямоугольника подряд:
 
 ```html
-<!--+ autorun height=80 -->
+<!--+ autorun height=80  no-beautify -->
 <div style="width:400px">
 ...<span style="background: lightgreen">
   Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля Ля
@@ -114,7 +114,7 @@
 Например:
 
 ```html
-<!--+ autorun height=160 -->
+<!--+ autorun height=160  no-beautify -->
 <style>
 li {
 *!*
@@ -137,7 +137,7 @@ li {
 Свойство `vertical-align` позволяет выровнять такие элементы внутри внешнего блока:
 
 ```html
-<!--+ autorun height=160 -->
+<!--+ autorun height=160  no-beautify -->
 <style>
 li {
   display: inline-block;  
@@ -189,6 +189,7 @@ li {
 С точки зрения современного CSS, обычные `<table>`, `<tr>`, `<td>` и т.д. -- это просто элементы с предопределёнными значениями `display`:
 
 ```css
+/*+ no-beautify */
 table    { display: table }
 tr       { display: table-row }
 thead    { display: table-header-group }
diff --git a/8-css-for-js/4-float/3-paginator-css/solution.md b/8-css-for-js/4-float/3-paginator-css/solution.md
index 0202d4cb..7773741a 100644
--- a/8-css-for-js/4-float/3-paginator-css/solution.md
+++ b/8-css-for-js/4-float/3-paginator-css/solution.md
@@ -4,7 +4,9 @@ HTML-структура:
 <div class="nav">
   <img src="arrow-left.jpg" class="left" width="40" height="40">
   <img src="arrow-right.jpg" class="right" width="40" height="40">
-  <ul class="pages"> <li>...</li> </ul>
+  <ul class="pages">
+    <li>...</li>
+  </ul>
 </div>
 ```
 
@@ -54,6 +56,7 @@ HTML-структура:
 Код в порядке лево-центр-право (неправильный):
 
 ```html
+<!--+ no-beautify -->
 <div...>
   <img src="arrow-left.jpg" class="left" width="40" height="40">
   <ul class="pages"> (li) 1 2 3 4 5 6 7 8 9</ul>
diff --git a/8-css-for-js/4-float/4-add-border-keep-width/solution.md b/8-css-for-js/4-float/4-add-border-keep-width/solution.md
index 1eee87d5..7e199ad1 100644
--- a/8-css-for-js/4-float/4-add-border-keep-width/solution.md
+++ b/8-css-for-js/4-float/4-add-border-keep-width/solution.md
@@ -7,7 +7,7 @@
 Да, можно -- указываем `box-sizing: border-box` и добавляем свойства:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <style>
   .left {
     float:left; 
diff --git a/8-css-for-js/4-float/4-add-border-keep-width/task.md b/8-css-for-js/4-float/4-add-border-keep-width/task.md
index d336808b..cac31736 100644
--- a/8-css-for-js/4-float/4-add-border-keep-width/task.md
+++ b/8-css-for-js/4-float/4-add-border-keep-width/task.md
@@ -5,7 +5,7 @@
 Есть две колонки `30%/70%`:
 
 ```html
-<!--+ autorun height=70 run play -->
+<!--+ autorun height=70 run play  no-beautify -->
 <style>
   .left {
     float:left; 
diff --git a/8-css-for-js/4-float/article.md b/8-css-for-js/4-float/article.md
index 6d4080af..1a117113 100644
--- a/8-css-for-js/4-float/article.md
+++ b/8-css-for-js/4-float/article.md
@@ -118,6 +118,7 @@ HTML будет такой:
 ..То есть, `div.left-picture` включает в себя картинку и заголовок к ней. Добавим стиль с `float`:
 
 ```css
+/*+ no-beautify */
 .left-picture {
 *!*
   float: left;
@@ -273,6 +274,7 @@ h2 {
 Поэтому, если это допустимо, то установка `float` контейнеру всё исправит:
 
 ```css
+/*+ no-beautify */
 .hero {
   background: #D2B48C;
   border: 1px solid red;
@@ -318,6 +320,7 @@ h2 {
 Чтобы не добавлять в HTML-код лишний элемент, можно задать его через `:after`.
 
 ```css
+/*+ no-beautify */
 .clearfix:after {
   content: "."; /* добавить содержимое: "." */
   display: block;  /* сделать блоком, т.к. inline не может иметь clear */
@@ -334,6 +337,7 @@ h2 {
 Если добавить родителю `overflow: hidden` или `overflow: auto`, то всё станет хорошо.
 
 ```css
+/*+ no-beautify */
 .hero {
 *!*
   overflow: auto;
diff --git a/8-css-for-js/5-position/article.md b/8-css-for-js/5-position/article.md
index 424782e2..f438c027 100644
--- a/8-css-for-js/5-position/article.md
+++ b/8-css-for-js/5-position/article.md
@@ -17,7 +17,7 @@ position: static;
 Здесь и далее, для примеров мы будем использовать следующий документ:
 
 ```html
-<!--+ autorun height=200 -->
+<!--+ autorun height=200  no-beautify -->
 <div style="background: #fee; width: 500px">
     Без позиционирования ("position: static").
 
@@ -51,7 +51,7 @@ top: 10px;
 
 
 ```html
-<!--+ autorun height=200 -->
+<!--+ autorun height=200  no-beautify -->
 *!*
 <style>
   h2 {
@@ -87,7 +87,7 @@ top: 10px;
 **Возможны отрицательные координаты** и координаты, использующие другие единицы измерения. Например, `left: 10%` сдвинет элемент на 10% его ширины вправо, а `left: -10%` -- влево. При этом часть элемента может оказаться за границей окна:
 
 ```html
-<!--+ autorun height=200 -->
+<!--+ autorun height=200  no-beautify -->
 *!*
 <style>
   h2 {
@@ -132,7 +132,7 @@ position: absolute;
 Например, отпозиционируем заголовок в правом-верхнем углу документа:
 
 ```html
-<!--+ autorun height=200 -->
+<!--+ autorun height=200  no-beautify -->
 *!*
 <style>
   h2 {
@@ -168,7 +168,7 @@ position: absolute;
 Браузер растянет такой элемент до границ. 
 
 ```html
-<!--+ autorun height=50 -->
+<!--+ autorun height=50  no-beautify -->
 <style>
 *!*
 div {
@@ -189,6 +189,7 @@ div {
 Первое, что может прийти в голову:
 
 ```css
+/*+ no-beautify */
 div {
   position: absolute;
   left: 0; top: 0; /* в левый-верхний угол */
@@ -212,6 +213,7 @@ div {
 Может быть, получится так?
 
 ```css
+/*+ no-beautify */
 div {
   position: absolute;
   left: 0; top: 0; /* в левый-верхний угол, и растянуть..  */
@@ -261,7 +263,7 @@ div {
 <li>Используем `position` для размещения элемента управления:
 
 ```html
-<!--+ autorun height=80 -->
+<!--+ autorun height=80  no-beautify -->
 <button style="position: absolute; right: 10px; opacity: 0.8">
   Кнопка
 </button>
@@ -274,7 +276,7 @@ div {
 <li>Используем `float` для размещения элемента управления:
 
 ```html
-<!--+ autorun height=80 -->
+<!--+ autorun height=80  no-beautify -->
 <button style="float: right; margin-right: 10px; opacity: 0.8;">
   Кнопка
 </button>
diff --git a/8-css-for-js/6-css-center/3-vertical-align-table-cell-position/solution.md b/8-css-for-js/6-css-center/3-vertical-align-table-cell-position/solution.md
index 1e255207..5ad299dd 100644
--- a/8-css-for-js/6-css-center/3-vertical-align-table-cell-position/solution.md
+++ b/8-css-for-js/6-css-center/3-vertical-align-table-cell-position/solution.md
@@ -9,7 +9,7 @@
 В однострочном случае можно сделать центрирование при помощи `line-height`:
 
 ```html
-<!--+ run -->
+<!--+ run  no-beautify -->
 <style>
   .arrow {
     position: absolute;
diff --git a/8-css-for-js/6-css-center/3-vertical-align-table-cell-position/task.md b/8-css-for-js/6-css-center/3-vertical-align-table-cell-position/task.md
index 6f532d1f..68e0b041 100644
--- a/8-css-for-js/6-css-center/3-vertical-align-table-cell-position/task.md
+++ b/8-css-for-js/6-css-center/3-vertical-align-table-cell-position/task.md
@@ -7,7 +7,7 @@
 Почему оно не работает? Нажмите на просмотр, чтобы увидеть (стрелка должна быть в центре по вертикали).
 
 ```html
-<!--+ run height=70 -->
+<!--+ run height=70  no-beautify -->
 <style>
   .arrow {
     position: absolute;
diff --git a/8-css-for-js/6-css-center/article.md b/8-css-for-js/6-css-center/article.md
index a10ccf1a..199c724b 100644
--- a/8-css-for-js/6-css-center/article.md
+++ b/8-css-for-js/6-css-center/article.md
@@ -77,7 +77,7 @@
 Центрируемый элемент позиционируем абсолютно и опускаем до середины по вертикали при помощи `top:50%`:
 
 ```html
-<!--+ autorun height=100 -->
+<!--+ autorun height=100  no-beautify -->
 <style>
   .outer {
     position: relative;
@@ -108,7 +108,7 @@
 **Приподнимем элемент на пол-высоты при помощи `margin-top`:**
 
 ```html
-<!--+ autorun height=100 -->
+<!--+ autorun height=100  no-beautify -->
 <style>
   .outer {
     position: relative;
@@ -144,7 +144,7 @@
 Вертикально отцентрировать одну строку в элементе с известной высотой `height` можно, указав эту высоту в свойстве `line-height`:
 
 ```html
-<!--+ autorun height=100 -->
+<!--+ autorun height=100  no-beautify -->
 <style>
   .outer {
     height: 5em;
@@ -179,7 +179,7 @@
 Например, ниже есть таблица со всеми 3-мя значениями:
 
 ```html
-<!--+ autorun height=130 -->
+<!--+ autorun height=130  no-beautify -->
 <style>
   table {  border-collapse: collapse; }
   td {    
@@ -252,7 +252,7 @@
 Допустим, высота внешнего элемента `120px`. Укажем её в свойстве `line-height`:
 
 ```html
-<!--+ autorun height=150 -->
+<!--+ autorun height=150  no-beautify -->
 <style>
   .outer {
     line-height: 120px;
@@ -282,7 +282,7 @@
 Пример:
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <style>
 .before {
   display: inline-block;
@@ -352,7 +352,7 @@
 Второе решение:
 
 ```html
-<!--+ autorun -->
+<!--+ autorun  no-beautify -->
 <style>
 .outer:before {
   content: '';
diff --git a/8-css-for-js/7-font-size-line-height/article.md b/8-css-for-js/7-font-size-line-height/article.md
index 24ac3731..80faaaf0 100644
--- a/8-css-for-js/7-font-size-line-height/article.md
+++ b/8-css-for-js/7-font-size-line-height/article.md
@@ -11,7 +11,7 @@
 Для наглядности посмотрим пример HTML, в котором шрифт и размер строки одинаковы:
 
 ```html
-<!--+ autorun height=100 -->
+<!--+ autorun height=100  no-beautify -->
 <style>
 body { 
 *!*
diff --git a/8-css-for-js/8-white-space/article.md b/8-css-for-js/8-white-space/article.md
index e9d31c21..7291e9da 100644
--- a/8-css-for-js/8-white-space/article.md
+++ b/8-css-for-js/8-white-space/article.md
@@ -36,6 +36,7 @@
 Для примера, рассмотрим следующий фрагмент кода:
 
 ```js
+//+ no-beautify
 if (hours > 18) {
     // Пойти поиграть в теннис
 }
@@ -108,8 +109,6 @@ if (hours > 18) {
 </li>
 </ul> 
 
-Целесообразно использовать эти значения на сайте там, где текст пишется пользователями.
-
 [head]
 <style>
 .white-space-example {
diff --git a/8-css-for-js/9-outline/article.md b/8-css-for-js/9-outline/article.md
index 5bb42ffc..6dbfdd1a 100644
--- a/8-css-for-js/9-outline/article.md
+++ b/8-css-for-js/9-outline/article.md
@@ -34,7 +34,7 @@
 Все браузеры, кроме IE9-, также поддерживают свойство `outline-offset`, задающее отступ `outline` от внешней границы элемента:
 
 ```html
-<!--+ autorun height=60 -->
+<!--+ autorun height=60  no-beautify -->
 <div style="border:3px solid blue; outline: 3px solid red; outline-offset:5px">
  Везде, кроме IE9-, между рамками будет расстояние 5px
 </div>
diff --git a/archive/3-jquery-stub/2-jquery-search/article.md b/archive/3-jquery-stub/2-jquery-search/article.md
index d056509d..a63ab84c 100644
--- a/archive/3-jquery-stub/2-jquery-search/article.md
+++ b/archive/3-jquery-stub/2-jquery-search/article.md
@@ -71,13 +71,13 @@ jQuery-объект также называют "jQuery-коллекцией", "
 
 <script>
 *!*
-var links = $('li > a');
+  var links = $('li > a');
 */!*
 
-// перебор результатов
-for(var i=0; i<links.length; i++) {
-  alert( links[i].href );
-}
+  // перебор результатов
+  for (var i = 0; i < links.length; i++) {
+    alert( links[i].href );
+  }
 </script>
 ```
 
@@ -99,6 +99,7 @@ $('a', menu); // поиск аналогичен menu.querySelectorAll('a')
 В качестве контекста можно передать не только DOM-элемент, но и селектор:
 
 ```js
+//+ no-beautify
    
 $('a', '#menu' );
 ```
@@ -138,12 +139,12 @@ $('a', menu);
 
 <script>
 *!*
-var links = $('a', 'li'); 
+  var links = $('a', 'li');
 */!*
 
-for(var i=0; i<links.length; i++) {
-  alert( i + ": " +  links[i].href ); // 3 ссылки по очереди
-}
+  for (var i = 0; i < links.length; i++) {
+    alert( i + ": " + links[i].href ); // 3 ссылки по очереди
+  }
 </script>
 ```
 
@@ -152,7 +153,7 @@ for(var i=0; i<links.length; i++) {
 Для более удобного перебора у jQuery-коллекции есть метод [each](http://api.jquery.com/each/). Его синтаксис похож на [forEach](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/forEach) массива:
 
 ```js
-.each( function(index, item) )
+.each(function(index, item))
 ```
 
 Он выполняет для каждого элемента коллекции перед точкой функцию-аргумент, и передаёт ей номер `index` и  очередной элемент `item`.
@@ -161,7 +162,7 @@ for(var i=0; i<links.length; i++) {
 
 ```js
 $('li a').each(function(i, a) {
-  alert( i + ": " + a.href); 
+  alert( i + ": " + a.href );
 });
 ```
 
@@ -182,14 +183,14 @@ $('li a').each(function(i, a) {
 </ul>
 
 <script>
-var links = $('li a'); // найти все ссылки на странице внутри LI
+  var links = $('li a'); // найти все ссылки на странице внутри LI
 
 *!*
-links.each(function(i, a) {
-  alert(i + ': ' + a.innerHTML);
+  links.each(function(i, a) {
+    alert( i + ': ' + a.innerHTML );
 
-  if (i == 1) return false; // стоп на элементе коллекции с индексом 1
-});
+    if (i == 1) return false; // стоп на элементе коллекции с индексом 1
+  });
 */!*
 </script>
 ```
@@ -272,9 +273,9 @@ $('li a[href$=".pdf"]') // ссылки, оканчивающиеся на pdf
     this.className = "pdf"; // дать им класс
   })
 *!*
-  .each(function() {     
+  .each(function() {
 */!*
-    alert(this.href); // вывести
+    alert( this.href ); // вывести
   });
 ```
 
diff --git a/archive/3-jquery-stub/3-jquery-traversal/1-select-parents-with-self/task.md b/archive/3-jquery-stub/3-jquery-traversal/1-select-parents-with-self/task.md
index 7009d5fc..5571aa61 100644
--- a/archive/3-jquery-stub/3-jquery-traversal/1-select-parents-with-self/task.md
+++ b/archive/3-jquery-stub/3-jquery-traversal/1-select-parents-with-self/task.md
@@ -8,11 +8,13 @@
 
 ```html
 <html>
-  <body>
-    <ul>
-      <li>Текст</li>
-    </ul>
-  </body>
+
+<body>
+  <ul>
+    <li>Текст</li>
+  </ul>
+</body>
+
 </html>
 ```
 
diff --git a/archive/3-jquery-stub/3-jquery-traversal/article.md b/archive/3-jquery-stub/3-jquery-traversal/article.md
index d1ad40cb..a266df25 100644
--- a/archive/3-jquery-stub/3-jquery-traversal/article.md
+++ b/archive/3-jquery-stub/3-jquery-traversal/article.md
@@ -109,16 +109,15 @@
 </ul>
 
 <script>
-var list = $('li');
+  var list = $('li');
 
-// вызовом css('color', ..) поставим цвет элементам:
+  // вызовом css('color', ..) поставим цвет элементам:
 
 *!*
-list.filter(':even').css('color', 'blue');// ФИЛЬТР: чётные 
-list.not(':even').css('color', 'green');  // НЕ чётные
-list.has('em').css('background', 'pink'); // СОДЕРЖАТ em
+  list.filter(':even').css('color', 'blue'); // ФИЛЬТР: чётные 
+  list.not(':even').css('color', 'green'); // НЕ чётные
+  list.has('em').css('background', 'pink'); // СОДЕРЖАТ em
 */!*
-
 </script>
 ```
 
@@ -134,16 +133,16 @@ list.has('em').css('background', 'pink'); // СОДЕРЖАТ em
 </ul>
 
 <script>
-var list = $('li');
+  var list = $('li');
 
-// ФИЛЬТР: первый ребёнок - текстовый узел
+  // ФИЛЬТР: первый ребёнок - текстовый узел
 *!*
-var result = list.filter(function() { 
-  return this.firstChild.nodeType == 3;
-});
+  var result = list.filter(function() {
+    return this.firstChild.nodeType == 3;
+  });
 */!*
 
-alert( result.length ); // 1, это последний LI
+  alert( result.length ); // 1, это последний LI
 </script>
 ```
 
@@ -169,12 +168,12 @@ alert( result.length ); // 1, это последний LI
 </ul>
 
 <script>
-var list = $('ul').children();
+  var list = $('ul').children();
 
 *!*
-alert( list.is('li') ); // true
-alert( list.is('.other') ); // true
-alert( list.is(':hidden') ); // false
+  alert( list.is('li') ); // true
+  alert( list.is('.other') ); // true
+  alert( list.is(':hidden') ); // false
 */!*
 </script>
 ```
@@ -193,24 +192,24 @@ alert( list.is(':hidden') ); // false
 </ul>
 
 <script>
-var elems = $('ul');
+  var elems = $('ul');
 
-// можно добавить элемент DOM
-var li = document.getElementsByTagName('li')[0];
+  // можно добавить элемент DOM
+  var li = document.getElementsByTagName('li')[0];
 *!*
-elems = elems.add( li );
+  elems = elems.add(li);
 */!*
-alert(elems.length); // 2
+  alert( elems.length ); // 2
 
 *!*
-elems = elems.add( '.other' ); // можно - по селектору
+  elems = elems.add('.other'); // можно - по селектору
 */!*
-alert(elems.length); // 3
+  alert( elems.length ); // 3
 
 *!*
-elems = elems.add( $('li') );  // можно - коллекцию
+  elems = elems.add($('li')); // можно - коллекцию
 */!*
-alert(elems.length); // 5, дубликаты удаляются
+  alert( elems.length ); // 5, дубликаты удаляются
 </script>
 ```
 
@@ -230,14 +229,14 @@ alert(elems.length); // 5, дубликаты удаляются
 </ul>
 
 <script>
-$('code')
- .css('color', 'red') // подсветить CODE красным
+  $('code')
+    .css('color', 'red') // подсветить CODE красным
 *!*
- .map(function() { 
-  return this.parentNode; // получить коллекцию родителей CODE
- })
+    .map(function() {
+      return this.parentNode; // получить коллекцию родителей CODE
+    })
 */!*
- .css('color', 'green'); // подсветить их зелёным
+    .css('color', 'green'); // подсветить их зелёным
 </script>
 ```
 
@@ -270,18 +269,18 @@ $('code')
 </ul>
 
 <script>
-var link = $('a[href*="blog"]'); // ссылка, атрибут href содержит "blog"
+  var link = $('a[href*="blog"]'); // ссылка, атрибут href содержит "blog"
 
 *!*
-var ul = link.closest('ul'); // ближайший сверху UL
+  var ul = link.closest('ul'); // ближайший сверху UL
 */!*
-alert( ul[0].id ); // 1
+  alert( ul[0].id ); // 1
 
 *!*
-var li = $('li')[0];
-ul = link.closest('ul', li); // ближайший сверху UL, но внутри LI
+  var li = $('li')[0];
+  ul = link.closest('ul', li); // ближайший сверху UL, но внутри LI
 */!*
-alert( ul.length ); // 0, нет таких 
+  alert( ul.length ); // 0, нет таких
 </script>
 ```
 
@@ -313,11 +312,11 @@ $('li').find('code');
 </ul>
 
 <script>
-$('li')
+  $('li')
 *!*
- .children('code') // вернуть всех детей LI, подходящих под селектор code  
+    .children('code') // вернуть всех детей LI, подходящих под селектор code  
 */!*
- .css('color', 'red'); // подсветить
+    .css('color', 'red'); // подсветить
 </script>
 ```
 
@@ -333,13 +332,13 @@ $('li')
 </ul>
 
 <script>
-$('li') 
+  $('li')
 *!*
- .contents()  // все узлы-дети LI
+    .contents() // все узлы-дети LI
 */!*
- .map(function() {  // обернуть текстовые узлы в скобки
-    if (this.nodeType == 3) this.data = "("+this.data+")" 
-  });
+    .map(function() { // обернуть текстовые узлы в скобки
+      if (this.nodeType == 3) this.data = "(" + this.data + ")"
+    });
 </script>
 ```
 
@@ -371,6 +370,7 @@ $('li')
 Можно сделать это так:
 
 ```js
+//+ no-beautify
 $('form')
   .find(':checkbox')
   .each(function() { ... }); // сделать что-то с элементами коллекции
@@ -381,6 +381,7 @@ $('form')
 Самый очевидный способ это сделать -- сохранить `$('form')` в переменной:
 
 ```js
+//+ no-beautify
 var form = $('form');
 
 form
@@ -397,6 +398,7 @@ form
 jQuery, при вызове `find` сохраняет предыдущую найденную коллекцию, к которой можно вернуться вызовом `end()`:
 
 ```js
+//+ no-beautify
 $('form')
   .find(':checkbox') // нашли чекбоксы внутри
   .each(function() { ... }) // обработали
@@ -414,6 +416,7 @@ $('form')
 Этот метод бывает очень удобен, когда какую-то операцию нужно сделать как с детьми, так и с самим элементом, например:
 
 ```js
+//+ no-beautify
 $('ul')       // коллекция: UL
   .children() // получить коллекцию LI
   .addBack()  // добавить к ней сам UL
diff --git a/archive/4-script-place-optimize/article.md b/archive/4-script-place-optimize/article.md
index c0f473dc..235bc872 100644
--- a/archive/4-script-place-optimize/article.md
+++ b/archive/4-script-place-optimize/article.md
@@ -14,25 +14,26 @@
 ```html
 <!--+ run height=100 -->
 <html>
-  <head>
-    *!*
-    <script>
-      function count_rabbits() {
-        for (var i=1; i<=3; i++) {
-          alert("Кролик номер " + i);
-        }
+
+<head>
+*!*
+  <script>
+    function count_rabbits() {
+      for (var i = 1; i <= 3; i++) {
+        alert( "Кролик номер " + i );
       }
-    </script>
-    */!*
-  </head>
+    }
+  </script>
+*/!*
+</head>
 
-  <body>
-  
-    <h3>Нажмите на кнопку, чтобы начать</h3>
+<body>
 
-    <input type="button" onclick="count_rabbits()" value="Считать кроликов!"/>
+  <h3>Нажмите на кнопку, чтобы начать</h3>
 
-  </body>
+  <input type="button" onclick="count_rabbits()" value="Считать кроликов!" />
+
+</body>
 
 </html>
 ```
diff --git a/archive/widget-tasks/1-date-selector/task.md b/archive/widget-tasks/1-date-selector/task.md
index f404bc93..b135d47c 100644
--- a/archive/widget-tasks/1-date-selector/task.md
+++ b/archive/widget-tasks/1-date-selector/task.md
@@ -7,10 +7,10 @@
 Конструктор:
 
 ```js
-var dateSelector = new DateSelector({ 
-  yearFrom: 2010,  // начальный год в селекторе
-  yearTo: 2020,    // конечный год в селекторе
-  value: new Date(2012,2,31) // текущая выбранная дата
+var dateSelector = new DateSelector({
+  yearFrom: 2010, // начальный год в селекторе
+  yearTo: 2020, // конечный год в селекторе
+  value: new Date(2012, 2, 31) // текущая выбранная дата
 });
 ```
 
diff --git a/archive/widget-tasks/1-tooltip-over-element/solution.md b/archive/widget-tasks/1-tooltip-over-element/solution.md
index 1decae73..c327cd1e 100644
--- a/archive/widget-tasks/1-tooltip-over-element/solution.md
+++ b/archive/widget-tasks/1-tooltip-over-element/solution.md
@@ -10,7 +10,7 @@
 function getTooltipElem() {
   if (!tooltipElem) {
     tooltipElem = $('<div/>', {
-      "class" : 'tooltip',
+      "class": 'tooltip',
       html: html
     });
   }
@@ -23,6 +23,7 @@ function getTooltipElem() {
 Например:
 
 ```css
+/*+ no-beautify */
 .tooltip {
   position:absolute;
   z-index:100; /* подсказка должна перекрывать другие элементы */
@@ -47,7 +48,7 @@ function getTooltipElem() {
 <img src="tooltip-fixed-center.png">
 
 ```js
-tooltipElem.left = elem.offset().left + elem.outerWidth()/2
+tooltipElem.left = elem.offset().left + elem.outerWidth() / 2
 ```
 
 Дополнительно нужно сдвинуть подсказку на половину собственной ширины влево:
@@ -55,7 +56,7 @@ tooltipElem.left = elem.offset().left + elem.outerWidth()/2
 <img src="tooltip-fixed-center2.png">
 
 ```js
-left -= tooltipElem.outerWidth()/2;
+left -= tooltipElem.outerWidth() / 2;
 ```
 
 **Теперь отпозиционируем по вертикали.**
diff --git a/archive/widget-tasks/1-tooltip-over-element/task.md b/archive/widget-tasks/1-tooltip-over-element/task.md
index 9e2aeb04..fd38ed19 100644
--- a/archive/widget-tasks/1-tooltip-over-element/task.md
+++ b/archive/widget-tasks/1-tooltip-over-element/task.md
@@ -14,7 +14,7 @@
 
 ```js
 new Tooltip({
-  elem: $('#elem'), 
+  elem: $('#elem'),
   html: "Вот <b>такая</b> подсказка!",
   // вертикальное расстояние от подсказки до элемента
   offset: 20 // необязательный параметр, по умолчанию 10
diff --git a/archive/widget-tasks/2-draggable-windows/task.md b/archive/widget-tasks/2-draggable-windows/task.md
index fb7d8b3e..ed59c651 100644
--- a/archive/widget-tasks/2-draggable-windows/task.md
+++ b/archive/widget-tasks/2-draggable-windows/task.md
@@ -13,7 +13,7 @@
 ```js
 new DraggableWindow({
   title: "Чат с Петей",
-  template: HTML-шаблон окна
+  template: HTML - шаблон окна
 });
 ```
 
diff --git a/archive/widget-tasks/2-moving-tooltip/solution.md b/archive/widget-tasks/2-moving-tooltip/solution.md
index 10ae0397..d0cf3f29 100644
--- a/archive/widget-tasks/2-moving-tooltip/solution.md
+++ b/archive/widget-tasks/2-moving-tooltip/solution.md
@@ -12,6 +12,7 @@
 Стиль элемента подсказки:
 
 ```css
+/*+ no-beautify */
 .tooltip {
   position:absolute;
   z-index:100; /* подсказка должна перекрывать другие элементы */