renovations

1-js/1-getting-started/1-intro/article.md

@@ -38,7 +38,7 @@
 
 [warn header="Поговорим о браузерах"]
 
-Далее в этой главе мы говорим о возможностях и ограничениях JavaScript в контексте браузера.
+Далее в этой главе мы говорим о возможностях и ограничениях JavaScript именно в контексте браузера.
 
 [/warn]
 
@@ -46,9 +46,7 @@
 
 Современный JavaScript -- это "безопасный" язык программирования общего назначения. Он не предоставляет низкоуровневых средств работы с памятью, процессором, так как изначально был ориентирован на браузеры, в которых это не требуется.
 
-Что же касается остальных возможностей -- они зависят от окружения, в котором запущен JavaScript. 
-
-В браузере JavaScript умеет делать все, что относится к манипуляции со страницей, взаимодействию с посетителем и, в какой-то мере, с сервером: 
+Что же касается остальных возможностей -- они зависят от окружения, в котором запущен JavaScript. В браузере JavaScript умеет делать все, что относится к манипуляции со страницей, взаимодействию с посетителем и, в какой-то мере, с сервером: 
 
 <ul>
 <li>Создавать новые HTML-теги, удалять существующие, менять стили элементов, прятать, показывать элементы и т.п.</li>
@@ -64,11 +62,11 @@ JavaScript -- быстрый и мощный язык, но браузер на
 
 Это сделано для безопасности пользователей, чтобы злоумышленник не мог с помощью JavaScript получить личные данные или как-то навредить компьютеру пользователя. 
 
-Этих ограничений нет там, где JavaScript используется вне браузера, например на сервере. Кроме того, различные браузеры предоставляют свои механизмы по установке плагинов и расширений, которые обладают расширенными возможностями, но требуют специальных действий по установке от пользователя
+Этих ограничений нет там, где JavaScript используется вне браузера, например на сервере. Кроме того, современные браузеры предоставляют свои механизмы по установке плагинов и расширений, которые обладают расширенными возможностями, но требуют специальных действий по установке от пользователя
 
 **Большинство возможностей JavaScript в браузере ограничено текущим окном и страницей.**
 
-<img src="jslimit.jpg">
+<img src="limitations.svg" width="530" height="400">
 
 <ul>
 <li>JavaScript не может читать/записывать произвольные файлы на жесткий диск, копировать их или вызывать программы. Он не имеет прямого доступа к операционной системе.
@@ -77,7 +75,7 @@ JavaScript -- быстрый и мощный язык, но браузер на
 </li>
 <li>JavaScript, работающий в одной вкладке, не может общаться с другими вкладками и окнами, за исключением случая, когда он сам открыл это окно или несколько вкладок из одного источника (одинаковый домен, порт, протокол).
 
-Есть способы это обойти, и они раскрыты в учебнике, но они требуют внедрения специального кода на оба документа, которые находятся в разных вкладках или окнах. Без него, из соображений безопасности, залезть из одной вкладки в другую при помощи JavaScript нельзя. 
+Есть способы это обойти, и они раскрыты в учебнике, но они требуют специального кода на оба документа, которые находятся в разных вкладках или окнах. Без него, из соображений безопасности, залезть из одной вкладки в другую при помощи JavaScript нельзя. 
 </li>
 <li>Из JavaScript можно легко посылать запросы на сервер, с которого пришла страница. Запрос на другой домен тоже возможен, но менее удобен, т.к. и здесь есть ограничения безопасности. 
 </li>
@@ -93,9 +91,11 @@ JavaScript -- быстрый и мощный язык, но браузер на
 +Поддерживается всеми распространенными браузерами и включен по умолчанию.
 [/compare]
 
-**Этих трёх вещей одновременно нет больше ни в одной браузерной технологии.** Поэтому JavaScript и является самым распространенным средством создания браузерных интерфейсов.
+**Этих трёх вещей одновременно нет больше ни в одной браузерной технологии.** 
 
-## Тенденции развития.   
+Поэтому JavaScript и является самым распространенным средством создания браузерных интерфейсов.
+
+## Тенденции развития
 
 Перед тем, как вы планируете изучить новую технологию, полезно ознакомиться с ее развитием и перспективами. Здесь в JavaScript всё более чем хорошо.
 
@@ -122,29 +122,117 @@ JavaScript -- быстрый и мощный язык, но браузер на
 
 Современные браузеры улучшают свои движки, чтобы увеличить скорость исполнения JavaScript, исправляют баги и стараются следовать стандартам.
 
-[summary]Тенденция: JavaScript становится всё быстрее и стабильнее.[/summary]
+[summary]Тенденция: JavaScript становится всё быстрее и стабильнее, в язык добавляются новые возможности.[/summary]
 
 Очень важно то, что новые стандарты HTML5 и ECMAScript сохраняют максимальную совместимость с предыдущими версиями. Это позволяет избежать неприятностей с уже существующими приложениями.
 
-Впрочем, небольшая проблема с HTML5 всё же есть. Иногда браузеры стараются включить новые возможности, которые еще не полностью описаны в стандарте, но настолько интересны, что разработчики просто не могут ждать.  
+Впрочем, небольшая проблема "супер-современными штучками" всё же есть. Иногда браузеры стараются включить новые возможности, которые еще не полностью описаны в стандарте, но настолько интересны, что разработчики просто не могут ждать.  
 
-...Однако, со временем стандарт меняется и браузерам приходится подстраиваться к нему, что может привести к ошибкам в уже написанном (старом) коде. Поэтому следует дважды подумать перед тем, как применять на практике такие "супер-новые" решения.
+...Однако, со временем стандарт меняется и браузерам приходится подстраиваться к нему, что может привести к ошибкам в уже написанном, основанном на старой реализации, JavaScript-коде. Поэтому следует дважды подумать перед тем, как применять на практике такие "супер-новые" решения.
 
 При этом все браузеры сходятся к стандарту, и различий между ними уже гораздо меньше, чем всего лишь несколько лет назад.
 
 [summary]Тенденция: всё идет к полной совместимости со стандартом.[/summary]
 
-## Недостатки JavaScript
 
-Зачастую, недостатки подходов и технологий -- это обратная сторона их полезности. Стоит ли упрекать молоток в том, что он -- тяжелый? Да, неудобно, зато гвозди забиваются лучше.
+## Альтернативные браузерные технологии
 
-В JavaScript, однако, есть вполне объективные недоработки, связанные с тем, что язык, по выражению его автора (Brendan Eich) делался "за 10 бессонных дней и ночей". Поэтому некоторые моменты продуманы плохо, есть и откровенные ошибки (которые признает тот же Brendan). 
+Современный JavaScript используется во многих областях. Если говорить о браузерах, то вместе с JavaScript на страницах используются и другие технологии.
 
-Конкретные примеры мы увидим в дальнейшем, т.к. их удобнее обсуждать в процессе освоения языка.
+Самые извеcтные -- это Flash, Java, ActiveX/NPAPI. Связка с ними может помочь достигнуть более интересных результатов в тех местах, где браузерный JavaScript пока не столь хорош, как хотелось бы. 
 
-Пока что нам важно знать, что некоторые "странности" языка не являются чем-то очень умным, а просто не были достаточно хорошо продуманы в своё время. В этом учебнике мы будем обращать особое внимание на основные недоработки и "грабли". Ничего критичного в них нет, если знаешь -- не наступишь.
+### Java   
 
-**В новых версиях JavaScript (ECMAScript) эти недостатки постепенно убирают.** 
+Java -- язык общего назначения, на нем можно писать самые разные программы. Для интернет-страниц есть особая возможность - написание *апплетов*.
 
-Процесс внедрения небыстрый, в первую очередь из-за старых версий IE, но они постепенно вымирают. Современный IE в этом отношении несравнимо лучше.
+*Апплет* -- это программа на языке Java, которую можно подключить к HTML при помощи тега `applet`, выглядит это примерно так:
+
+```html
+<!--+ run -->
+<applet code="BTApplet.class" codebase="/files/tutorial/intro/alt/">
+  <param name="nodes" value="50,30,70,20,40,60,80,35,65,75,85,90">
+  <param name="root" value="50">
+</applet>
+```
+
+Такой тег загружает Java-программу из файла `BTApplet.class` и выполняет ее с параметрами `param`. Апплет выполняется в отдельной части страницы, в прямоугольном "контейнере". Все действия пользователя внутри него обрабатывает апплет. Контейнер, впрочем, может быть и спрятан, если апплету нечего показывать.
+
+Конечно, для этого на компьютере должна быть установлена и включена среда выполнения Java, включая браузерный плагин. Кроме того, апплет должен быть подписан сертификатом издателя (в примере выше апплет без подписи), иначе Java заблокирует его.
+
+**Чем нам, JavaScript-разработчикам, может быть интересен Java?**
+
+В первую очередь тем, что подписанный Java-апплет может всё то же, что и обычная программа, установленая на компьютере посетителя. Конечно, для этого понадобится согласие пользователя при открытии такого апплета.
+
+[compare]
++Java может делать *всё* от имени посетителя, совсем как установленная программа. Потенциально опасные действия требуют подписанного апплета и согласия пользователя.
+-Java требует больше времени для загрузки.
+-Среда выполнения Java, включая браузерный плагин, должна быть установлена на компьютере посетителя и включена.
+-Java-апплет не интегрирован с HTML-страницей, а выполняется отдельно. Но он может вызывать функции JavaScript.
+[/compare]
+
+
+### Плагины и расширения для браузера
+
+Все современные браузеры предоставляют возможность написать плагины. Для этого можно использовать JavaScript (Chrome, Opera, Firefox), так и язык С (ActiveX для Internet Explorer).
+
+Эти плагины могут как отображать содержимое специального формата (плагин для проигрывания музыки, для показа PDF), так и взаимодействовать со страницей.
+
+Как и в ситуации с Java-апплетом, у них широкие возможности, но посетитель поставит их в том случае, если вам доверяет.
+
+### Adobe Flash   
+
+Adobe Flash -- кросс-браузерная платформа для мультимедиа-приложений, анимаций, аудио и видео. 
+
+*Flash-ролик* -- это скомпилированная программа, написанная на языке ActionScript. Ее можно подключить к HTML-странице и запустить в прямоугольном контейнере.
+
+В первую очередь Flash полезен тем, что позволяет **кросс-браузерно** работать с микрофоном, камерой, с буфером обмена, а также поддерживает продвинутые возможности по работе с сетевыми соединениями. 
+
+[compare]
++Сокеты, UDP для P2P и другие продвинутые возможности по работе с сетевыми соединениями
++Поддержка мультмедиа: изображения, аудио, видео. Работа с веб-камерой и микрофоном.
+-Flash должен быть установлен и включен. А на некоторых устройствах он вообще не поддерживается.
+-Flash не интегрирован с HTML-страницей, а выполняется отдельно.
+-Существуют ограничения безопасности, однако они немного другие, чем в JavaScript.
+[/compare]
+
+Из Flash можно вызывать JavaScript и наоборот, поэтому обычно сайты используют JavaScript, а там, где он не справляется -- можно подумать о Flash.
+
+
+## Языки поверх JavaScript
+
+
+Синтаксис JavaScript устраивает не всех: одним он кажется слишком свободным, другим -- наоборот, слишком ограниченным, третьи хотят добавить в язык дополнительные возможности, которых нет в стандарте...
+
+Это нормально, ведь требования и проекты у всех разные. 
+
+В последние годы появилось много языков, которые добавляют различные возможности "поверх" JavaScript, а для запуска в браузере -- при помощи специальных инструментов "трансляторов" превращаются в обычный JavaScript-код.
+
+Это преобразование происходит автоматически и совершенно прозрачно, при этом неудобств в разработке и отладке практически нет.
+
+При этом разные языки выглядят по-разному и добавляют совершенно разные вещи:
+
+<ul>
+<li>Язык [CoffeeScript](http://coffeescript.org/) -- это "синтаксический сахар" поверх JavaScript, он сосредоточен на большей ясности и краткости кода. Как правило, его особенно любят программисты на Ruby.</li>
+<li>Язык [TypeScript](http://www.typescriptlang.org/) сосредоточен на добавлении строгой типизации данных, он предназначен для упрощения разработки и поддержки больших систем. Его разрабатывает MicroSoft.</li>
+<li>Язык [Dart](https://www.dartlang.org/) предложен компанией Google как замена JavaScript, но другие ведущие интернет-компании объявили о своей незаинтересованности в Dart. Возможно, в будущем он может составить конкуренцию JS.</li>
+</ul>
+
+[smart header="ES6 и ES7 прямо сейчас"]
+Существуют также трансляторы, которые берут код, использующий возможности будущих стандартов JavaScript, и преобразуют его в более старый вариант, который понимают все браузеры.
+
+Например, [6to5](https://6to5.org/).
+
+Благодаря этому, мы можем использовать многие возможности будущего уже сегодня.
+[/smart]
+
+
+## Итого
+
+Язык JavaScript уникален благодаря своей полной интеграции с HTML/CSS. Он работает почти у всех посетителей.
+
+...Но хороший JavaScript-программист не должен забывать и о других технологиях.
+
+Ведь наша цель -- создание хороших приложений, и здесь Flash, Java, ActiveX/NPAPI и браузерные расширения имеют свои уникальные возможности, которые можно использовать вместе с JavaScript.
+
+Что же касается CoffeeScript, TypeScript и других языков, построенных над JavaScript -- они могут быть очень полезны, рекомендуется посмотреть их, хотя бы в общих чертах, но, конечно, после освоения самого JavaScript.
 

1-js/1-getting-started/2-alternatives/article.md

@@ -1,101 +0,0 @@
-# Альтернативные браузерные технологии
-
-Современный JavaScript используется во многих областях. Если говорить о браузерах, то вместе с JavaScript на страницах используются и другие технологии.
-
-Самые извеcтные -- это Flash, Java, ActiveX/NPAPI. Связка с ними может помочь достигнуть более интересных результатов в тех местах, где браузерный JavaScript пока не столь хорош, как хотелось бы. 
-
-[cut]
-
-## Java   
-
-Java -- язык общего назначения, на нем можно писать самые разные программы. Для интернет-страниц есть особая возможность - написание *апплетов*.
-
-*Апплет* -- это программа на языке Java, которую можно подключить к HTML при помощи тега `applet`:
-
-```html
-<!--+ run -->
-<applet code="BTApplet.class" codebase="/files/tutorial/intro/alt/">
-  <param name="nodes" value="50,30,70,20,40,60,80,35,65,75,85,90">
-  <param name="root" value="50">
-</applet>
-```
-
-Такой тег загружает Java-программу из файла `BTApplet.class` и выполняет ее с параметрами `param`. Апплет выполняется в отдельной части страницы, в прямоугольном "контейнере". Все действия пользователя внутри него обрабатывает апплет. Контейнер, впрочем, может быть и спрятан, если апплету нечего показывать.
-
-Конечно, для этого на компьютере должна быть установлена и включена среда выполнения Java, включая браузерный плагин. Статистика показывает, что это около 80% компьютеров. Кроме того, апплет должен быть подписан сертификатом издателя (в примере выше апплет без подписи), иначе Java заблокирует его.
-
-**Чем нам, JavaScript-разработчикам, может быть интересен Java?**
-
-В первую очередь тем, что подписанный Java-апплет может всё то же, что и обычная программа, установлена на компьютере посетителя.
-
-При попытке сделать потенциально опасное действие -- пользователь получает вопрос, который выглядит примерно так:
-
-<img src="allow.png">
-
-Обойти это подтверждение или поменять его внешний вид нельзя. То есть, согласие посетителя действительно необходимо. 
-
-И если оно есть -- то Java-апплет может выполнять любые действия, в отличие от JavaScript.
-
-[compare]
-+Java может делать *всё* от имени посетителя, совсем как установленная программа. В целях безопасности, потенциально опасные действия требуют подписанного апплета и доверия пользователя.
--Java требует больше времени для загрузки.
--Среда выполнения Java, включая браузерный плагин, должна быть установлена на компьютере посетителя и включена. Таких посетителей в интернет -- около 80%.
--Java-апплет не интегрирован с HTML-страницей, а выполняется отдельно. Но он может вызывать функции JavaScript.
-[/compare]
-
-Подписанный Java-апплет -- это возможность делать все, что угодно, на компьютере посетителя, если он вам доверяет. 
-
-Java и JavaScript могут взаимодействовать, так что можно вынести в Java те вызовы, которым нужно обойти контекст безопасности, а для самой страницы использовать JavaScript.
-
-
-## ActiveX/NPAPI, плагины и расширения для браузера
-
-ActiveX для IE и NPAPI для остальных браузеров позволяют писать плагины для браузера, в том числе на языке C. Как и в ситуации с Java-апплетом, посетитель поставит их в том случае, если вам доверяет.
-
-Эти плагины могут как отображать содержимое специального формата (плагин для проигрывания музыки, для показа PDF), так и взаимодействовать со страницей.
-
-ActiveX при этом еще и очень удобен в установке. Лично я - не фанат Microsoft, но видел отличные приложения, написанные на ActiveX и я могу понять, почему люди используют его и привязываются к IE.
-
-## Adobe Flash   
-
-Adobe Flash -- кросс-браузерная платформа для мультимедиа-приложений, анимаций, аудио и видео. 
-
-*Flash-ролик* -- это скомпилированная программа, написанная на языке ActionScript. Ее можно подключить к HTML-странице и запустить в прямоугольном контейнере.
-
-В первую очередь Flash полезен тем, что позволяет **кросс-браузерно** работать с микрофоном, камерой, с буфером обмена, а также поддерживает продвинутые возможности по работе с сетевыми соединениями. 
-
-[compare]
-+Сокеты, UDP для P2P и другие продвинутые возможности по работе с сетевыми соединениями
-+Поддержка мультмедиа: изображения, аудио, видео. Работа с веб-камерой и микрофоном.
--Flash должен быть установлен и включен. А на некоторых устройствах он вообще не поддерживается.
--Flash не интегрирован с HTML-страницей, а выполняется отдельно.
--Существуют ограничения безопасности, однако они немного другие, чем в JavaScript.
-[/compare]
-
-**JavaScript и ActionScript могут вызывать функции друг друга**, поэтому обычно сайты используют JavaScript, а там, где он не справляется -- можно подумать о Flash.
-
-## Dart
-
-Язык Dart предложен компанией Google как замена JavaScript, у которого, по выражению создателей Dart, есть [фатальные недостатки](http://lurkmore.to/%D0%A4%D0%B0%D1%82%D0%B0%D0%BB%D1%8C%D0%BD%D1%8B%D0%B9_%D0%BD%D0%B5%D0%B4%D0%BE%D1%81%D1%82%D0%B0%D1%82%D0%BE%D0%BA). 
-
-Сейчас этот язык, хотя и доступен, находится в стадии разработки. Многие из возможностей еще ожидают своей реализации, есть ряд проблем. Другие ведущие интернет-компании объявляли о своей незаинтересованности в Dart. Но в будущем он может составить конкуренцию JS, если его доведут до ума.
-
-Программы на языке Dart специальным инструментом могут быть преобразованы в JavaScript. Конечно, при этом часть важных возможностей Dart теряется.
-
-## CoffeeScript
-
-Язык [CoffeeScript](http://coffeescript.org) -- это "синтаксический сахар" для JavaScript, который короче и, местами, проще. 
-
-Этот язык напрямую в браузере не работает, но предлагается специальная программа для преобразования CoffeeScript в JavaScript, и при этом, так как CoffeeScript изначально задумывался как преобразуемый в JavaScript, результирующий код выглядит вполне хорошо и работает тоже.
-
-Есть и другие языки, которые написаны "поверх" JavaScript, например [TypeScript](http://www.typescriptlang.org/). 
-
-Строго говоря, это не альтернативные технологии, для их использования необходимо, как базу, хорошо знать и понимать JavaScript.
-
-Возможно, вы захотите изучить этот язык после того, как освоите JavaScript, многим он нравится. 
-
-## Итого
-
-Язык JavaScript уникален благодаря своей полной интеграции с HTML/CSS. Он работает почти у всех посетителей.
-
-**...Но хороший JavaScript-программист не должен забывать и о других технологиях.** Ведь наша цель -- создание хороших приложений, и здесь Flash, Java, ActiveX/NPAPI имеют свои уникальные возможности, которые можно использовать вместе с JavaScript.

1-js/1-getting-started/2-pre-coding/article.md

@@ -35,8 +35,8 @@
 <li>[http://help.dottoro.com]() -- содержит подробную информацию по HTML/CSS/JavaScript.</li>
 <li>[http://javascript.ru/manual]() -- справочник по JavaScript на русском языке, он содержит основную информацию по языку, без функций для работы с документом. К нему можно обращаться и по адресу, если знаете, что искать. Например, так: [http://javascript.ru/RegExp]().
 </li>
-<li>[http://www.quirksmode.org]() -- информация о поддержке тех или иных возможностей и несовместимостях. 
-Для поиска можно пользоваться комбинацией **"quirksmode onkeypress"** в Google.
+<li>[http://www.quirksmode.org]() -- информация о браузерных несовместимостях. Этот ресурс сам по себе довольно старый и, в первую очередь, полезен для поддержки устаревших браузеров. Для поиска можно пользоваться комбинацией **"quirksmode onkeypress"** в Google. </li>
+<li>[http://caniuse.com]() -- ресурс о поддержке браузерами новейших возможностях HTML/CSS/JavaScript. Например, для поддержки функций криптографии: [http://caniuse.com/#feat=cryptography]().
 </li>
 </ol>
 
@@ -48,9 +48,9 @@
 
 ### Спецификация ECMAScript
 
-Спецификация (формальное описание синтаксиса, базовых объектов и алгоритмов) языка Javascript называется <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMAScript</a>. 
+Спецификация (формальное описание синтаксиса, базовых объектов и алгоритмов) языка Javascript называется [ECMAScript](http://www.ecma-international.org/publications/standards/Ecma-262.htm).
 
-Ее перевод есть на сайте в разделе [стандарт языка](http://javascript.ru/ecma).
+Ее перевод есть на сайте в разделе [стандарт языка](http://es5.javascript.ru/).
 
 [smart header="Почему не просто &quot;JavaScript&quot; ?"]
 Вы можете спросить: "Почему спецификация для JavaScript не называется просто *"JavaScript"*, зачем существует какое-то отдельное название?"
@@ -62,22 +62,22 @@
 
 Спецификация может рассказать многое о том, как работает язык, и является самым фундаментальным, доверенным источником информации.
 
-Мы живем во время, когда все быстро изменяется. Современный стандарт -- это <a href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">ECMA-262 5.1</a> (или просто ES5), поддерживается всеми современными браузерами.
-
-Не за горами -- новая спецификация ES6, в которой предусмотрены еще много полезных возможностей, делающих разработку быстрее и веселее :)
-
-### Спецификации HTML/CSS 
+### Спецификации HTML/DOM/CSS 
 
 JavaScript -- язык общего назначения, поэтому в спецификации ECMAScript нет ни слова о браузерах. 
 
-Соответствующую информацию вы можете найти на сайте [w3.org](http://w3.org). Там расположены стандарты HTML, CSS и многие другие. 
+Главная организация, которая занимается HTML, CSS, XML и множеством других стандартов -- [Консорциум Всемирной паутины](https://ru.wikipedia.org/wiki/%D0%9A%D0%BE%D0%BD%D1%81%D0%BE%D1%80%D1%86%D0%B8%D1%83%D0%BC_%D0%92%D1%81%D0%B5%D0%BC%D0%B8%D1%80%D0%BD%D0%BE%D0%B9_%D0%BF%D0%B0%D1%83%D1%82%D0%B8%D0%BD%D1%8B) (World Wide Consortium, сокращённо W3C).
 
-К сожалению, найти в этой куче то, что нужно, может быть нелегко, особенно когда неизвестно в каком именно стандарте искать. Самый лучший способ -- попросить Google с указанием сайта. 
+Информацию о них можно найти на сайте [w3.org](http://w3.org). К сожалению, найти в этой куче то, что нужно, может быть нелегко, особенно когда неизвестно в каком именно стандарте искать. Самый лучший способ -- попросить Google с указанием сайта. 
 
 Например, для поиска `document.cookie` набрать [document.cookie site:w3.org](https://www.google.com/search?q=document.cookie+site%3Aw3.org). 
 
 Последние версии стандартов расположены на домене [dev.w3.org](http://dev.w3.org).
 
+Кроме того, в том, что касается HTML5 и DOM/CSS, W3C активно использует наработки другой организации: [WhatWG](https://whatwg.org/), поэтому самые актуальные версии спецификаций по этим темам обычно находятся на [https://whatwg.org/specs/](). 
+
+Иногда бывает так, что информация на сайте [http://dev.w3.org]() отличается от [http://whatwg.org](). В этом случае, как правило, следует руководствоваться [http://whatwg.org]().
+
 ## Итого
 
 Итак, посмотрим какие у нас есть источники информации.
@@ -100,12 +100,19 @@ Google-комбо: `"RegExp site:javascript.ru"`.
 
 <ul>
 <li>JavaScript, современный стандарт [ES5 (англ)](http://www.ecma-international.org/publications/standards/Ecma-262.htm), и предыдущий [ES3 (рус)](http://javascript.ru/ecma).</li>
-<li>HTML/DOM/CSS -- на сайте [w3.org](http://www.w3.org).
+<li>HTML/DOM/CSS -- на сайте [http://w3.org](http://www.w3.org).
 Google-комбо: `"document.cookie site:w3.org"`.</li>
+<li>...А самые последние версии стандартов -- на [http://dev.w3.org]() и на [http://whatwg.org/specs/](https://whatwg.org/specs/).</li>
 </ul>
 
 То, как оно на самом деле работает и несовместимости:
 
 <ul>
-<li>Смотрите <a href="http://www.quirksmode.org/">http://www.quirksmode.org/</a>. Google-комбо: `"innerHeight quirksmode"`.</li>
+<li>[http://quirksmode.org/](). Google-комбо: `"innerHeight quirksmode"`.</li>
+</ul>
+
+Поддержка современных и новейших возможностей браузерами:
+
+<ul>
+<li>[http://caniuse.com](). Google-комбо: `"caniuse geolocation"`.</li>
 </ul>

1-js/1-getting-started/3-editor/article.md

@@ -45,7 +45,6 @@
 
 <ul>
 <li><a href="http://www.sublimetext.com">Sublime Text</a> (кросс-платформенный, shareware).</li>
-<li>TextMate (Mac, платный)</li>
 <li><a href="http://www.scintilla.org/">SciTe</a> простой, легкий и очень быстрый (Windows, бесплатный).</li>
 <li><a href="http://sourceforge.net/projects/notepad-plus/">Notepad++</a> (Windows, бесплатный).</li>
 <li>Vim, Emacs. Если умеете их готовить.</li>

1-js/1-getting-started/4-devtools/article.md

@@ -1,6 +1,6 @@
 # Консоль разработчика
 
-При разработке скриптов всегда возможны ошибки... Впрочем, что я говорю? У вас абсолютно точно будут ошибки, если конечно вы -- человек, а не <a href="http://ru.wikipedia.org/wiki/%D0%91%D0%B5%D0%BD%D0%B4%D0%B5%D1%80_(%D0%A4%D1%83%D1%82%D1%83%D1%80%D0%B0%D0%BC%D0%B0)">робот инопланетный</a>.
+При разработке скриптов всегда возможны ошибки... Впрочем, что я говорю? У вас абсолютно точно будут ошибки, если конечно вы -- человек, а не <a href="http://ru.wikipedia.org/wiki/%D0%91%D0%B5%D0%BD%D0%B4%D0%B5%D1%80_(%D0%A4%D1%83%D1%82%D1%83%D1%80%D0%B0%D0%BC%D0%B0)">робот</a>.
 
 Чтобы читать их в удобном виде, а также получать массу полезной информации о выполнении скриптов, в браузерах есть *инструменты разработки*.  
 
@@ -14,7 +14,7 @@
 
 ## Google Chrome   
 
-Откройте страницу [bug.html](/devtools/bug.html). 
+Откройте страницу [bug.html](bug.html). 
 
 В её JavaScript-коде есть ошибка. Конечно, обычному посетителю она не видна, нужно открыть инструменты разработчика.
 
@@ -30,8 +30,8 @@
 <ul>
 <li>При клике на `bug.html` вы перейдёте во вкладку с кодом к месту ошибки, там будет и краткое описание ошибки. 
 В данном случае ошибка вызвана строкой `lalala`, которая интерпретатору непонятна. </li>
-<li>Здесь же вы можете набирать команды на JavaScript, например наберите `alert("Hello")` -- команду вывода сообщения. Мы познакомимся с этой и другими командами далее.</li>
-<li>Для запуска команды в консоли, нажмите [key Enter], для перевода курсора на следующую строку (если команда состоит из нескольких строк) --  [key Shift+Enter].</li> 
+<li>В этом же окошке же вы можете набирать команды на JavaScript, например наберите `alert("Hello")` -- команду вывода сообщения и запустите её нажатием [key Enter]. Мы познакомимся с этой и другими командами далее.</li>
+<li>Для перевода курсора на следующую строку (если команда состоит из нескольких строк) --  используется сочетание [key Shift+Enter].</li> 
 </ul>
 
 Далее в учебнике мы подробнее рассмотрим отладку в Chrome в главе [](/debugging-chrome).

1-js/1-getting-started/4-devtools/bug.html

@@ -0,0 +1,16 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+</head>
+<body>
+
+На этой странице есть скрипт с ошибкой.
+<script>
+
+  lalala
+
+</script>
+
+</body>
+</html>

1-js/2-first-steps/3-variables/1.svg

@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="179px" height="114px" viewBox="0 0 179 114" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
+    <title>Diagrams</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <path d="M2.5,111.5 L134.5,111.5" id="Line" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M44.5,55.5 L146.5,55.5" id="Line-2" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M2.5,111.5 L44.5,55.5" id="Line" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M134.5,111.5 L176.5,55.5" id="Line-3" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M2.5,71.5 L134.5,71.5" id="Line-10" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M44.5,15.5 L176.5,15.5" id="Line-7" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M2.5,71.5 L44.5,15.5" id="Line-8" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M134.5,71.5 L176.5,15.5" id="Line-9" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M2.5,111.5 L2.5,71.5" id="Line" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M44.5,55.5 L44.5,15.5" id="Line-4" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <path d="M134.5,111.5 L134.5,71.5" id="Line-6" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <rect id="Rectangle-2" stroke="#979797" fill="#E8E8E8" sketch:type="MSShapeGroup" transform="translate(82.959003, 46.776161) rotate(47.000000) translate(-82.959003, -46.776161) " x="43" y="34.247795" width="79.918006" height="25.0567324"></rect>
+        <text id="&quot;Hello!&quot;" sketch:type="MSTextLayer" transform="translate(86.193270, 48.500000) rotate(47.000000) translate(-86.193270, -48.500000) " font-family="Open Sans" font-size="14" font-weight="normal" fill="#373535">
+            <tspan x="61.6932699" y="54">"Hello!"</tspan>
+        </text>
+        <path d="M176.5,55.5 L176.5,15.5" id="Line-5" stroke="#979797" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
+        <rect id="Rectangle-1" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="2" y="71" width="133" height="41"></rect>
+        <g id="Rectangle-3-+-Oval-1-+-message" sketch:type="MSLayerGroup" transform="translate(38.000000, 85.000000)">
+            <rect id="Rectangle-3" stroke="#979797" fill="#FFFFFF" sketch:type="MSShapeGroup" x="0" y="0" width="63" height="16"></rect>
+            <circle id="Oval-1" stroke="#979797" sketch:type="MSShapeGroup" cx="3.5" cy="3.5" r="1.5"></circle>
+            <text id="message" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="normal" fill="#373535">
+                <tspan x="7" y="12">message</tspan>
+            </text>
+        </g>
+    </g>
+</svg>

1-js/2-first-steps/3-variables/article.md

@@ -2,13 +2,13 @@
 
 В зависимости от того, для чего вы делаете скрипт, понадобится работать с информацией.
 
-Если это электронный магазин - то это товары, корзина. Если чат - посетители, сообщения и так далее.
+Если это электронный магазин -- то это товары, корзина. Если чат -- посетители, сообщения и так далее.
 
 Чтобы хранить информацию, используются *переменные*.
 [cut]
 ## Переменная
 
-*Переменная* состоит из имени и выделенной области памяти, которая ему соответствует.. 
+*Переменная* состоит из имени и выделенной области памяти, которая ему соответствует.
 
 Для *объявления* или, другими словами, *создания переменной* используется ключевое слово `var`:
 
@@ -20,7 +20,7 @@ var message;
 
 ```js
 var message;
-message = 'Привет'; // сохраним в переменной строку
+message = 'Hello'; // сохраним в переменной строку
 ```
 
 Эти данные будут сохранены в соответствующей области памяти и в дальнейшем доступны при обращении по имени:
@@ -28,7 +28,7 @@ message = 'Привет'; // сохраним в переменной строк
 ```js
 //+ run
 var message;
-message = 'Привет'; 
+message = 'Hello'; 
 
 alert(message); // выведет содержимое переменной
 ```
@@ -42,16 +42,16 @@ var message = 'Привет';
 Можно даже объявить несколько переменных сразу:
 
 ```js
-var user = 'Вася', age = 25, message = 'Привет';
+var user = 'John', age = 25, message = 'Hello';
 ```
 
 ### Аналогия из жизни
 
 Проще всего понять переменную, если представить ее как "коробку" для данных, с уникальным именем. 
 
-Например, переменная `message` - это коробка, в которой хранится значение `"Привет"`:
+Например, переменная `message` -- это коробка, в которой хранится значение `"Hello!"`:
 
-<img src="box-message-hello.png">
+<img src="1.svg">
 
 В коробку можно положить любое значение, а позже - поменять его. Значение в переменной можно изменять сколько угодно раз: