From 841aae260382e2bf5ebb44d765d8c7301d27caab Mon Sep 17 00:00:00 2001 From: Alexey Istomin Date: Sat, 20 Mar 2021 18:37:44 +0300 Subject: Restore "ё" letter in Russian translation (#239) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * docs(ru): restore ё letter * docs(ru): resolve conflicts * refactor(idea): remove ide folder --- files/ru/web/guide/ajax/getting_started/index.html | 20 +++++----- files/ru/web/guide/ajax/index.html | 2 +- .../index.html | 14 +++---- .../buffering_seeking_time_ranges/index.html | 2 +- .../guide/css/block_formatting_context/index.html | 2 +- .../ru/web/guide/events/event_handlers/index.html | 2 +- files/ru/web/guide/events/index.html | 8 ++-- files/ru/web/guide/events/media_events/index.html | 8 ++-- .../overview_of_events_and_handlers/index.html | 14 +++---- files/ru/web/guide/graphics/index.html | 2 +- .../web/guide/html/content_categories/index.html | 18 ++++----- .../ru/web/guide/html/editable_content/index.html | 12 +++--- files/ru/web/guide/html/html5/index.html | 8 ++-- .../html/html5/introduction_to_html5/index.html | 2 +- .../using_html_sections_and_outlines/index.html | 44 +++++++++++----------- files/ru/web/guide/index.html | 2 +- files/ru/web/guide/mobile/index.html | 6 +-- .../guide/parsing_and_serializing_xml/index.html | 10 ++--- files/ru/web/guide/user_input_methods/index.html | 2 +- 19 files changed, 89 insertions(+), 89 deletions(-) (limited to 'files/ru/web/guide') diff --git a/files/ru/web/guide/ajax/getting_started/index.html b/files/ru/web/guide/ajax/getting_started/index.html index 56e8a80a0b..aee30a7337 100644 --- a/files/ru/web/guide/ajax/getting_started/index.html +++ b/files/ru/web/guide/ajax/getting_started/index.html @@ -23,7 +23,7 @@ original_slug: Web/Guide/AJAX/С_чего_начать

Шаг 1 — Как послать HTTP запрос

-

Для того, чтобы послать HTTP запрос на сервер используя JavaScript, вам необходим экземпляр класса, который позволит это сделать. Такой класс впервые был введен в Internet Explorer как объект ActiveX, называемый XMLHTTP. Позже в Mozilla, Safari и другие браузеры был введен класс XMLHttpRequest, который поддерживал методы и свойства изначального объекта ActiveX от Microsoft.

+

Для того, чтобы послать HTTP запрос на сервер используя JavaScript, вам необходим экземпляр класса, который позволит это сделать. Такой класс впервые был введён в Internet Explorer как объект ActiveX, называемый XMLHTTP. Позже в Mozilla, Safari и другие браузеры был введён класс XMLHttpRequest, который поддерживал методы и свойства изначального объекта ActiveX от Microsoft.

В результате, чтобы создать кросс-браузерный объект требуемого класса, вы можете сделать следующее:

@@ -35,7 +35,7 @@ if (window.XMLHttpRequest) { // Mozilla, Safari, ... } -

(В целях наглядности, код выше является немного упрощенным. Более жизненный пример будет рассмотрен в шаге 3 этой статьи)

+

(В целях наглядности, код выше является немного упрощённым. Более жизненный пример будет рассмотрен в шаге 3 этой статьи)

Некоторые версии некоторых броузеров Mozilla не будут корректно работать, если ответ сервера не содержит заголовка XML mime-type. Чтобы решить эту проблему, вы можете использовать вызовы дополнительных методов для переопределения заголовка полученного от сервера, если он отличен от text/xml.

@@ -43,11 +43,11 @@ if (window.XMLHttpRequest) { // Mozilla, Safari, ... httpRequest.overrideMimeType('text/xml'); -

Далее вам необходимо решить, что вы будете делать после получения ответа сервера. На этом этапе вам необходимо указать объекту, какая JavaScript функция будет обрабатывать ответ. Это делается путем присваивания свойству onreadystatechange имени JavaScript функции, которую вы собираетесь использовать:

+

Далее вам необходимо решить, что вы будете делать после получения ответа сервера. На этом этапе вам необходимо указать объекту, какая JavaScript функция будет обрабатывать ответ. Это делается путём присваивания свойству onreadystatechange имени JavaScript функции, которую вы собираетесь использовать:

httpRequest.onreadystatechange = nameOfTheFunction;

-

Заметьте, что после названия функции нет скобок и не указано параметров, потому что вы просто присваиваете ссылку на функцию, а не вызываете ее. К тому же, вместо указания имени функции, вы можете использовать возможность JavaScript объявлять функции на лету (так называемые «анонимные функции») и указывать действия, которые тотчас же будут обрабатывать ответ:

+

Заметьте, что после названия функции нет скобок и не указано параметров, потому что вы просто присваиваете ссылку на функцию, а не вызываете её. К тому же, вместо указания имени функции, вы можете использовать возможность JavaScript объявлять функции на лету (так называемые «анонимные функции») и указывать действия, которые тотчас же будут обрабатывать ответ:

httpRequest.onreadystatechange = function(){
     // какой-нибудь код
@@ -62,7 +62,7 @@ httpRequest.send(null);
 
 
 
@@ -88,7 +88,7 @@ httpRequest.send(null);
 
if (httpRequest.readyState == 4) {
     // все в порядке, ответ получен
 } else {
-    // все еще не готово
+    // все ещё не готово
 }
 
@@ -124,7 +124,7 @@ httpRequest.send(null);

Шаг 3 — Простой пример

-

Давайте соберем все вместе и сделаем простой пример HTTP-запроса. Наш JavaScript запросит HTML документ test.html, который содержит текст "I'm a test." и выведет содержимое файла в диалоговом окне.

+

Давайте соберём все вместе и сделаем простой пример HTTP-запроса. Наш JavaScript запросит HTML документ test.html, который содержит текст "I'm a test." и выведет содержимое файла в диалоговом окне.

<script type="text/javascript" language="javascript">
     function makeRequest(url) {
@@ -181,7 +181,7 @@ httpRequest.send(null);
 
  • Пользователь нажимает на ссылку "Сделать запрос" в броузере;
  • Это вызывает функцию makeRequest() с параметром test.html — именем HTML файла;
  • -
  • Посылается запрос, после чего (onreadystatechange) выполнение передается alertContents();
  • +
  • Посылается запрос, после чего (onreadystatechange) выполнение передаётся alertContents();
  • alertContents() проверяет получен ли ответ и все ли с ним в порядке, после чего содержимое файла test.html выводится в диалоговом окне.
@@ -191,7 +191,7 @@ httpRequest.send(null);

Замечание 2: Если вы посылаете запрос не на статический XML-файл, а на серверный скрипт, возвращающий XML, то нужно установить некоторые заголовки ответа, если вы планируете сделать вашу страницу работоспособной в Internet Explorer помимо Mozilla. Если вы не установите заголовок Content-Type: application/xml, IE будет сообщать об ошибке JavaScript, 'Object Expected', после строки, где вы пытаетесь получить доступ к XML элементу. Если вы не установите заголовок Cache-Control: no-cache броузер будет кэшировать ответ и никогда не будет повторно отправлять запрос, что сделает отладку весьма «забавной».

-

Замечание 3: Если переменная httpRequest используется глобально, то конкурирующие функции, вызывающие makeRequest() могут конкурировать друг с другом, вызывая состязания. Объявление переменной httpRequest локально в функции и передача ее в alertContent() предотвращает состязания.

+

Замечание 3: Если переменная httpRequest используется глобально, то конкурирующие функции, вызывающие makeRequest() могут конкурировать друг с другом, вызывая состязания. Объявление переменной httpRequest локально в функции и передача её в alertContent() предотвращает состязания.

Замечание 4: При привязывании колбэк-функции к onreadystatechange нельзя указать аргументы. По этой причине не работает следующий код:

@@ -252,7 +252,7 @@ var root_node = xmldoc.getElementsByTagName('root').item(0); alert(root_node.firstChild.data);
-

Этот код берет объект XMLDocument, возвращаемый responseXML и использует методы DOM для доступа к данным, содержащимся в документе XML. Посмотреть test.xml можно здесь, а обновленный скрипт здесь.

+

Этот код берет объект XMLDocument, возвращаемый responseXML и использует методы DOM для доступа к данным, содержащимся в документе XML. Посмотреть test.xml можно здесь, а обновлённый скрипт здесь.

Чтобы узнать больше о методах DOM, посмотрите реализация DOM в Mozilla.

diff --git a/files/ru/web/guide/ajax/index.html b/files/ru/web/guide/ajax/index.html index 7cf72beec7..25b4e612df 100644 --- a/files/ru/web/guide/ajax/index.html +++ b/files/ru/web/guide/ajax/index.html @@ -31,7 +31,7 @@ translation_of: Web/Guide/AJAX
Простой путь Ajax
-
"Как это оказывается, довольно легко использовать в своих интересах объект XML-HttpRequest сделает акт приложений сети больше как настольное приложение, все еще используя традиционные инструменты , сеть формируется для того, чтобы собрать пользовательский вход."
+
"Как это оказывается, довольно легко использовать в своих интересах объект XML-HttpRequest сделает акт приложений сети больше как настольное приложение, все ещё используя традиционные инструменты , сеть формируется для того, чтобы собрать пользовательский вход."
diff --git a/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html b/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html index 2fc93f687e..667568c42a 100644 --- a/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html +++ b/files/ru/web/guide/audio_and_video_delivery/adding_captions_and_subtitles_to_html5_video/index.html @@ -7,13 +7,13 @@ translation_of: >- ---
-

В других статьях мы рассмотрели как  создать cross browser видео плеер используя {{ domxref("HTMLMediaElement") }} и {{ domxref("Window.fullScreen") }} APIs, а так-же как  стилизовать плеер. В этой статье мы возьмем тот же плеер и покажем как добавить  подписи и субтитры, используя {{ domxref("Web_Video_Text_Tracks_Format","the WebVTT format") }} и {{ htmlelement("track") }} элемент.

+

В других статьях мы рассмотрели как  создать cross browser видео плеер используя {{ domxref("HTMLMediaElement") }} и {{ domxref("Window.fullScreen") }} APIs, а так-же как  стилизовать плеер. В этой статье мы возьмём тот же плеер и покажем как добавить  подписи и субтитры, используя {{ domxref("Web_Video_Text_Tracks_Format","the WebVTT format") }} и {{ htmlelement("track") }} элемент.

Пример видео с подписями

-

В этой статье мы сошлемся на пример плеера с подписями. Этот пример использует отрывок из Sintel open movie, созданного Blender Foundation.

+

В этой статье мы сошлёмся на пример плеера с подписями. Этот пример использует отрывок из Sintel open movie, созданного Blender Foundation.

Video player with stand controls such as play, stop, volume, and captions on and off. The video playing shows a scene of a man holding a spear-like weapon, and a caption reads "Esta hoja tiene pasado oscuro."

@@ -29,7 +29,7 @@ translation_of: >-

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

-

В этой статье мы сошлемся на text tracks, отображаемые как субтистры, т.к их контент направлен на слышащих людей, со сложностью понимания языка в фильме, а не на людей с плохим или отсутствием слуха.

+

В этой статье мы сошлёмся на text tracks, отображаемые как субтистры, т.к их контент направлен на слышащих людей, со сложностью понимания языка в фильме, а не на людей с плохим или отсутствием слуха.

Элемент <track> 

@@ -37,7 +37,7 @@ translation_of: >-

WebVTT

-

Файлы содержащие данные о субтитрах - это простой текстовый файл, который следует специальному формату,  такому как Web Video Text Tracks (WebVTT) формат. WebVTT specification всё еще работает, по этому основные его части стабильны и мы можем использовать их сегодня. 

+

Файлы содержащие данные о субтитрах - это простой текстовый файл, который следует специальному формату,  такому как Web Video Text Tracks (WebVTT) формат. WebVTT specification всё ещё работает, по этому основные его части стабильны и мы можем использовать их сегодня. 

Поставщики видео контента (такие как Blender Foundation) предоставляют и подписи и субтитры в текстовом формате с их видео, но они обычно в SubRip Text (SRT) формате. Этот формат может быть легко переконвертирован в WebVTT, используя  online  конвертер  например такой как srt2vtt.

@@ -123,15 +123,15 @@ translation_of: >- video.textTracks[i].mode = 'hidden'; }
-

Свойство video.textTracks  содержит массив всех текстовых треков, присоединенных к видео. Мы проходим по каждому и устанавливаем его  mode в hidden

+

Свойство video.textTracks  содержит массив всех текстовых треков, присоединённых к видео. Мы проходим по каждому и устанавливаем его  mode в hidden

-

Примечание:  WebVTT API дает нам доступ ко всем текстовым трекам, что определены в HTML5 video, c помощью элемента  <track>

+

Примечание:  WebVTT API даёт нам доступ ко всем текстовым трекам, что определены в HTML5 video, c помощью элемента  <track>

Building a caption menu

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

-

Мы добавили кнопку, но перед тем как что-то сделать, мы должны создать меню, которое с ней идет. Это меню создается динамически, т.к языки могут быть добавлены или удалены после, простым редактированием элементов  <track> в разметке видео.

+

Мы добавили кнопку, но перед тем как что-то сделать, мы должны создать меню, которое с ней идёт. Это меню создаётся динамически, т.к языки могут быть добавлены или удалены после, простым редактированием элементов  <track> в разметке видео.

Все что нам необходимо сделать - это пройти через  textTracks, читая их свойства и строя меню из них:

diff --git a/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html b/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html index e4d2637356..8eae6fbe73 100644 --- a/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html +++ b/files/ru/web/guide/audio_and_video_delivery/buffering_seeking_time_ranges/index.html @@ -211,6 +211,6 @@ myAudio.buffered.end(1); // returns 19

Надо заметить, что есть свойство played, сообщающее, были ли воспроизведены интервалы полностью. Пример:

-
var played = audio.played; // вернет объект TimeRanges
+
var played = audio.played; // вернёт объект TimeRanges

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

diff --git a/files/ru/web/guide/css/block_formatting_context/index.html b/files/ru/web/guide/css/block_formatting_context/index.html index 0114b27893..4c529df53a 100644 --- a/files/ru/web/guide/css/block_formatting_context/index.html +++ b/files/ru/web/guide/css/block_formatting_context/index.html @@ -43,7 +43,7 @@ translation_of: Web/Guide/CSS/Block_formatting_context

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

-

В примере ниже мы имеем плавающий элемент внутри <div> с заданным border. Содержимое этого <div> обтекает плавающий элемент. Так как содержимое float выше, чем остальное содержимое, обтекающее его, border элемента div теперь проходит сквозь float. Как объясняется в руководстве In Flow and Out of Flow, плавающий элемент был исключен из потока элементов, так что фон и граница div включает только его содержимое, но не элемент float

+

В примере ниже мы имеем плавающий элемент внутри <div> с заданным border. Содержимое этого <div> обтекает плавающий элемент. Так как содержимое float выше, чем остальное содержимое, обтекающее его, border элемента div теперь проходит сквозь float. Как объясняется в руководстве In Flow and Out of Flow, плавающий элемент был исключён из потока элементов, так что фон и граница div включает только его содержимое, но не элемент float

{{EmbedGHLiveSample("css-examples/flow/formatting-contexts/float.html", '100%', 720)}}

diff --git a/files/ru/web/guide/events/event_handlers/index.html b/files/ru/web/guide/events/event_handlers/index.html index 8401bd0739..fbbdde6848 100644 --- a/files/ru/web/guide/events/event_handlers/index.html +++ b/files/ru/web/guide/events/event_handlers/index.html @@ -7,7 +7,7 @@ translation_of: Web/Guide/Events/Event_handlers

Регистрация обработчиков onevent

-

Обработчики onevent - это свойства определенных элементов DOM, позволяющие управлять тем, как этот элемент реагирует на события. Элементы могут быть интерактивными (ссылки, кнопки, изображения, формы и т. д.) или неинтерактивными (например, элемент base <body>). События - это такие действия, как:

+

Обработчики onevent - это свойства определённых элементов DOM, позволяющие управлять тем, как этот элемент реагирует на события. Элементы могут быть интерактивными (ссылки, кнопки, изображения, формы и т. д.) или неинтерактивными (например, элемент base <body>). События - это такие действия, как:

-

Модификация в структуре веб-страницы или содержании может быть вызвано некоторым событием описанным в mutation events page, но их использование устарело в пользу более легкого Mutation Observer подхода.

+

Модификация в структуре веб-страницы или содержании может быть вызвано некоторым событием описанным в mutation events page, но их использование устарело в пользу более лёгкого Mutation Observer подхода.

Потоки Медиа, встроенный в HTML документа, может вызвать некоторые события, страница описания media events.

Сетевые запросы, сделанные веб-страницей, могут вызвать некоторые события.

-

Есть много других источников событий, определенных в веб-браузере, страницы которых пока не доступны в данном руководстве.

+

Есть много других источников событий, определённых в веб-браузере, страницы которых пока не доступны в данном руководстве.

Примечание: Это руководство событие Разработчика нуждается в существенной работе.Структура должна быть реорганизована и страницы переписаны. Мы надеемся, что все, что вы знаете и должны знать о событиях будет опубликовано здесь.

diff --git a/files/ru/web/guide/events/media_events/index.html b/files/ru/web/guide/events/media_events/index.html index a3a13cc821..6c35079a6e 100644 --- a/files/ru/web/guide/events/media_events/index.html +++ b/files/ru/web/guide/events/media_events/index.html @@ -8,7 +8,7 @@ tags: - события translation_of: Web/Guide/Events/Media_events --- -

Встроенные с помощью HTML тегов {{ HTMLElement("audio") }} или {{ HTMLElement("video") }} медиа объекты генерируют различные события. В этом разделе приведен их список и описание.

+

Встроенные с помощью HTML тегов {{ HTMLElement("audio") }} или {{ HTMLElement("video") }} медиа объекты генерируют различные события. В этом разделе приведён их список и описание.

@@ -26,7 +26,7 @@ translation_of: Web/Guide/Events/Media_events - + @@ -86,7 +86,7 @@ translation_of: Web/Guide/Events/Media_events - + @@ -114,7 +114,7 @@ translation_of: Web/Guide/Events/Media_events - + diff --git a/files/ru/web/guide/events/overview_of_events_and_handlers/index.html b/files/ru/web/guide/events/overview_of_events_and_handlers/index.html index 7be572dc0f..326926fe3a 100644 --- a/files/ru/web/guide/events/overview_of_events_and_handlers/index.html +++ b/files/ru/web/guide/events/overview_of_events_and_handlers/index.html @@ -7,13 +7,13 @@ translation_of: Web/Guide/Events/Overview_of_Events_and_Handlers

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

-

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

+

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

-

События и обработчики событий заняли центральное место в web-программировании с добавлением языка в браузеры, сопровождая смену архитектуры рендеринга от перехвата и загрузки страницы к управлению с помощью событий, основанном на перекомпоновке (reflow). Сначала браузер ожидает, пока он получит все ресурсы, связанные со страницей, чтобы проанализировать, обработать, отрисовать и предоставить страницу пользователю. Отрисованная страница остается неизменной, пока браузер не запросит новую. С изменением в подходе к рендерингу динамической страницы, браузер непрерывно зацикливается между обработкой, отрисовкой, представлением содержимого и ожиданием некоторого нового триггера события. Триггеры событий включают, например, завершение загрузки ресурса по сети, скачивание изображений, которые теперь могут быть отрисованы на экране, завершение браузером анализа ресурса, обработку HTML-содержимого страницы, взаимодействие пользователя с содержимым страницы, нажатия кнопок. Дуглас Крокфорд хорошо объясняет это изменение в нескольких лекциях, особенно своей речи "Неудобные API: Теория DOM", которая описывает изменения в потоке изначального потока браузера от управляемого событиями браузера.

+

События и обработчики событий заняли центральное место в web-программировании с добавлением языка в браузеры, сопровождая смену архитектуры рендеринга от перехвата и загрузки страницы к управлению с помощью событий, основанном на перекомпоновке (reflow). Сначала браузер ожидает, пока он получит все ресурсы, связанные со страницей, чтобы проанализировать, обработать, отрисовать и предоставить страницу пользователю. Отрисованная страница остаётся неизменной, пока браузер не запросит новую. С изменением в подходе к рендерингу динамической страницы, браузер непрерывно зацикливается между обработкой, отрисовкой, представлением содержимого и ожиданием некоторого нового триггера события. Триггеры событий включают, например, завершение загрузки ресурса по сети, скачивание изображений, которые теперь могут быть отрисованы на экране, завершение браузером анализа ресурса, обработку HTML-содержимого страницы, взаимодействие пользователя с содержимым страницы, нажатия кнопок. Дуглас Крокфорд хорошо объясняет это изменение в нескольких лекциях, особенно своей речи "Неудобные API: Теория DOM", которая описывает изменения в потоке изначального потока браузера от управляемого событиями браузера.

A comparison of the sequential and event-driven browser load sequences.
-

Второй подход изменяет последние шаги, переходя от простого потока к бесконечному циклу, где ожидание и обработка возникновения новых событий следует за отрисовкой. Введение динамического подхода позволяет странице быть частично отрендериной, даже когда браузер еще не закончил извлечение всех ресурсов; это так же разрешено для действий, управляемыми событиями, которые JavaScript использует. (Речь доступна на нескольких ресурсах, включая этот.) На данный момент, все среды исполнения JavaScript используют события и их обработчики.

+

Второй подход изменяет последние шаги, переходя от простого потока к бесконечному циклу, где ожидание и обработка возникновения новых событий следует за отрисовкой. Введение динамического подхода позволяет странице быть частично отрендериной, даже когда браузер ещё не закончил извлечение всех ресурсов; это так же разрешено для действий, управляемыми событиями, которые JavaScript использует. (Речь доступна на нескольких ресурсах, включая этот.) На данный момент, все среды исполнения JavaScript используют события и их обработчики.

Шаблон проектирования событий

@@ -58,9 +58,9 @@ buttonDOMElement.addEventListener('click', example_click_handler);

{{ EmbedLiveSample('Button_Event_Handler') }}

-

Этот код полагается на соглашение о том, что существует некоторый вид события, называемый 'click' , который вызовет все функции-обработчики (или 'обработчик') с объектом-аргументом Event (на данный момент, в этом случае производный от объекта MouseEvent ) и будет запущен после манипуляций пользователя с элементами button на HTML-странице. Код не имеет видимого воздействия, пока пользователь не использует кнопки, наводит указатель мыши на элемент HTML и нажимает на левую кнопку или устанавливает палец или стилус на некоторое место на экране, выше кнопки; когда это произойдет, buttonDOMElement объекта JavaScript вызовет функцию example_click_handler с объектом Event в качестве аргумента. Функция, в свою очередь, исполнит любые действия, описанные программистом, в данном случае отрыв диалоговое окно HTML. Заметим, что обработчик имеет доступ к объекту ev, так как тот передается в качестве аргумента; объект содержит информацию о событие, в частности время его возникновения.

+

Этот код полагается на соглашение о том, что существует некоторый вид события, называемый 'click' , который вызовет все функции-обработчики (или 'обработчик') с объектом-аргументом Event (на данный момент, в этом случае производный от объекта MouseEvent ) и будет запущен после манипуляций пользователя с элементами button на HTML-странице. Код не имеет видимого воздействия, пока пользователь не использует кнопки, наводит указатель мыши на элемент HTML и нажимает на левую кнопку или устанавливает палец или стилус на некоторое место на экране, выше кнопки; когда это произойдёт, buttonDOMElement объекта JavaScript вызовет функцию example_click_handler с объектом Event в качестве аргумента. Функция, в свою очередь, исполнит любые действия, описанные программистом, в данном случае отрыв диалоговое окно HTML. Заметим, что обработчик имеет доступ к объекту ev, так как тот передаётся в качестве аргумента; объект содержит информацию о событие, в частности время его возникновения.

-

Во втором варианте, интегрирован в web-страницу намного более современный JavaScript обернут в событийный вызов функции, чтобы убедиться, что код будет выполнен только тогда, когда HTML будет обработан и доступен для изменения или декорирования. Например, код может быть объявлен так:

+

Во втором варианте, интегрирован в web-страницу намного более современный JavaScript обёрнут в событийный вызов функции, чтобы убедиться, что код будет выполнен только тогда, когда HTML будет обработан и доступен для изменения или декорирования. Например, код может быть объявлен так:

var funcInit = function(){
     // user code goes here and can safely address all the HTML elements from the page
@@ -69,7 +69,7 @@ buttonDOMElement.addEventListener('click', example_click_handler);
document.addEventListener('DOMContentLoaded', funcInit); -

так что этот код будет вызван только после того, как объект document вызовет событие 'DOMContentLoaded', потому что HTML был проанализирован и были созданы объекты Javasript,   представляющие каждый узел HTML-документа. Заметим, что в этом примере, код даже не передает аргумент события в функцию, потому что тому никогда не понадобится использовать данные, описанные в нем; скорее, код всего лишь нужно подождать, пока не случится событие.

+

так что этот код будет вызван только после того, как объект document вызовет событие 'DOMContentLoaded', потому что HTML был проанализирован и были созданы объекты Javasript,   представляющие каждый узел HTML-документа. Заметим, что в этом примере, код даже не передаёт аргумент события в функцию, потому что тому никогда не понадобится использовать данные, описанные в нем; скорее, код всего лишь нужно подождать, пока не случится событие.

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

@@ -100,7 +100,7 @@ document.addEventListener('DOMContentLoaded', funcInit);
  • глобальный объект window вызывает событие, называемое 'load', когда страница закончила рендеринг, подразумевая, что все ресурсы были скачаны и применены, так что скрипт был выполнен и изображения отображены,
  • глобальный объект window вызывает событие, называемое 'resize', когда высота или ширина окна браузера была изменена пользователем,
  • объект DOM document, представляющий HTML-документ, вызывает событие, называемое 'DOMContentLoaded', когда документ закончил загрузку,
  • -
  • объект узла DOM, такой как div или button, вызывающий событие, называемое 'click', когда пользователь нажимает кнопку мыши, пока ее указатель находится поверх узла DOM на HTML-странице.
  • +
  • объект узла DOM, такой как div или button, вызывающий событие, называемое 'click', когда пользователь нажимает кнопку мыши, пока её указатель находится поверх узла DOM на HTML-странице.
  • diff --git a/files/ru/web/guide/graphics/index.html b/files/ru/web/guide/graphics/index.html index 600c9cd4dd..70c4cc4c20 100644 --- a/files/ru/web/guide/graphics/index.html +++ b/files/ru/web/guide/graphics/index.html @@ -4,7 +4,7 @@ slug: Web/Guide/Graphics translation_of: Web/Guide/Graphics original_slug: Web/Guide/Графика --- -

    Современным веб-сайтам и веб-приложениям часто требуется отображать графику. Статические изображения легко отобразить с помощью элемента {{HTMLElement("img")}}, или с помощью CSS свойства  {{cssxref("background-image")}}. Часто требуется создавать графику на лету, или модифицировать ее каким-либо образом после. Как это проделать можно узнать в следующих статьях.

    +

    Современным веб-сайтам и веб-приложениям часто требуется отображать графику. Статические изображения легко отобразить с помощью элемента {{HTMLElement("img")}}, или с помощью CSS свойства  {{cssxref("background-image")}}. Часто требуется создавать графику на лету, или модифицировать её каким-либо образом после. Как это проделать можно узнать в следующих статьях.

    diff --git a/files/ru/web/guide/html/content_categories/index.html b/files/ru/web/guide/html/content_categories/index.html index 16e41106a0..1334570d7b 100644 --- a/files/ru/web/guide/html/content_categories/index.html +++ b/files/ru/web/guide/html/content_categories/index.html @@ -3,7 +3,7 @@ title: Категории контента slug: Web/Guide/HTML/Content_categories translation_of: Web/Guide/HTML/Content_categories --- -

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

    +

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

    Существует три типа категорий контента:

    @@ -49,12 +49,12 @@ translation_of: Web/Guide/HTML/Content_categories

    К этой категории принадлежат элементы {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("nav")}} и {{HTMLElement("section")}}. 

    -

    Не стоит путать данную модель контента с категорией корня задания разделов, которая изолирует свое содержимое от обычной структуры.

    +

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

    Заголовочный контент

    -

    Заголовочный контент задает заголовок секции, явно отмеченной структурным элементом или неявно – самим заголовочным.

    +

    Заголовочный контент задаёт заголовок секции, явно отмеченной структурным элементом или неявно – самим заголовочным.

    Данной категории принадлежат такие элементы, как {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}} и {{HTMLElement("hgroup")}}.

    @@ -63,7 +63,7 @@ translation_of: Web/Guide/HTML/Content_categories
    -

    Стоит заметить, что элемент {{HTMLElement("hgroup")}} был удален из спецификации W3C HTML до приведения HTML 5 к окончательному варианту, но до сих пор является частью спецификации WHATWG и по крайней мере частично поддерживается большинством браузеров.

    +

    Стоит заметить, что элемент {{HTMLElement("hgroup")}} был удалён из спецификации W3C HTML до приведения HTML 5 к окончательному варианту, но до сих пор является частью спецификации WHATWG и по крайней мере частично поддерживается большинством браузеров.

    Фразовый контент

    @@ -72,7 +72,7 @@ translation_of: Web/Guide/HTML/Content_categories

    К данной категории принадлежат следующие элементы:  {{HTMLElement("abbr")}}, {{HTMLElement("audio")}}, {{HTMLElement("b")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("button")}}, {{HTMLElement("canvas")}}, {{HTMLElement("cite")}}, {{HTMLElement("code")}}, {{ Obsolete_inline() }}{{HTMLElement("command")}}, {{HTMLElement("data")}}, {{HTMLElement("datalist")}}, {{HTMLElement("dfn")}}, {{HTMLElement("em")}}, {{HTMLElement("embed")}}, {{HTMLElement("i")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{HTMLElement("input")}}, {{HTMLElement("kbd")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("mark")}}, {{MathMLElement("math")}}, {{HTMLElement("meter")}}, {{HTMLElement("noscript")}}, {{HTMLElement("object")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, {{HTMLElement("q")}}, {{HTMLElement("ruby")}}, {{HTMLElement("samp")}}, {{HTMLElement("script")}}, {{HTMLElement("select")}}, {{HTMLElement("small")}}, {{HTMLElement("span")}}, {{HTMLElement("strong")}}, {{HTMLElement("sub")}}, {{HTMLElement("sup")}}, {{SVGElement("svg")}}, {{HTMLElement("textarea")}}, {{HTMLElement("time")}}, {{HTMLElement("var")}}, {{HTMLElement("video")}}, {{HTMLElement("wbr")}} и обычный текст (не только состоящий из символов пробелов).

    -

    Еще несколько элементов входят в данную категорию при соблюдении особых условий:

    +

    Ещё несколько элементов входят в данную категорию при соблюдении особых условий:

    • {{HTMLElement("a")}}, если содержит в себе только фразовый контент
    • @@ -86,12 +86,12 @@ translation_of: Web/Guide/HTML/Content_categories

      Встроенный контент

      -

      Встроенный контент импортирует в документ другой ресурс или вставляет содержимое на другом языке разметки или принадлежащее другому пространству имен. Элементами данной категории являются: {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{MathMLElement("math")}}, {{HTMLElement("object")}}, {{SVGElement("svg")}}, {{HTMLElement("video")}}.

      +

      Встроенный контент импортирует в документ другой ресурс или вставляет содержимое на другом языке разметки или принадлежащее другому пространству имён. Элементами данной категории являются: {{HTMLElement("audio")}}, {{HTMLElement("canvas")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{HTMLElement("img")}}, {{MathMLElement("math")}}, {{HTMLElement("object")}}, {{SVGElement("svg")}}, {{HTMLElement("video")}}.

      Интерактивный контент

      К интерактивному контенту относятся элементы, который специально разработаны для взаимодействия с пользователем. В данную категорию входят {{HTMLElement("a")}}, {{HTMLElement("button")}}, {{HTMLElement("details")}}, {{HTMLElement("embed")}}, {{HTMLElement("iframe")}}, {{deprecated_inline()}}{{HTMLElement("keygen")}}, {{HTMLElement("label")}}, {{HTMLElement("select")}} и {{HTMLElement("textarea")}}.
      - Некоторые элементы считаются интерактивным контентом только при соблюдении определенных условий:

      + Некоторые элементы считаются интерактивным контентом только при соблюдении определённых условий:

      • {{HTMLElement("audio")}}, если указан атрибут {{htmlattrxref("controls", "audio")}}
      • @@ -104,7 +104,7 @@ translation_of: Web/Guide/HTML/Content_categories

        Явный контент

        -

        Контент считается явным, когда он не скрыт и не является пустым, это контент, который отображен и предметен. У элементов потокового или фразового контента должен быть хотя бы один явный узел.

        +

        Контент считается явным, когда он не скрыт и не является пустым, это контент, который отображён и предметен. У элементов потокового или фразового контента должен быть хотя бы один явный узел.

        Контент форм

        @@ -143,7 +143,7 @@ translation_of: Web/Guide/HTML/Content_categories

        Элементы поддержки скриптов

        -

        Элементы поддержки скриптов – это элементы, которые напрямую не влияют на отрисовку документа. Вместо этого они служат для внедрения скриптов, путем либо содержания кода скрипта напрямую, либо указания данных, которые будут использованы скриптами.

        +

        Элементы поддержки скриптов – это элементы, которые напрямую не влияют на отрисовку документа. Вместо этого они служат для внедрения скриптов, путём либо содержания кода скрипта напрямую, либо указания данных, которые будут использованы скриптами.

        Элементами поддержки скриптов являются:

        diff --git a/files/ru/web/guide/html/editable_content/index.html b/files/ru/web/guide/html/editable_content/index.html index c260371219..9f8b6b6389 100644 --- a/files/ru/web/guide/html/editable_content/index.html +++ b/files/ru/web/guide/html/editable_content/index.html @@ -12,13 +12,13 @@ translation_of: Web/Guide/HTML/Editable_content

        Все, что вам нужно сделать, это установить атрибут {{htmlattrxref("contenteditable")}} почти на любой элемент HTML, чтобы сделать его доступным для редактирования.

        -

        Вот простой пример, который создает элемент {{HTMLElement("div")}}, содержимое которого пользователь может редактировать.

        +

        Вот простой пример, который создаёт элемент {{HTMLElement("div")}}, содержимое которого пользователь может редактировать.

        <div contenteditable="true">
           Этот текст может быть отредактирован пользователем.
         </div>
        -

        Вот приведенный выше HTML-код в песочнице:

        +

        Вот приведённый выше HTML-код в песочнице:

        {{ EmbedLiveSample('Как_это_работает') }} 

        @@ -30,9 +30,9 @@ translation_of: Web/Guide/HTML/Editable_content

        Использование  contenteditable  в разных браузерах было болезненным в течение длительного времени из-за различий в сгенерированной разметке между браузерами. Например, даже что-то простое, что происходит, когда вы нажимаете Enter/Return для создания новой строки текста внутри редактируемого элемента, обрабатывалось по-разному в основных браузерах (Firefox вставлял элементы {{htmlelement("br")}}, IE/Opera использовала {{htmlelement("p")}}, в Chrome/Safari использовался {{htmlelement("div")}}). 

        -

        К счастью, в современных браузерах ситуация несколько более последовательна. Начиная с  Firefox 60,  Firefox будет обновлен, чтобы обернуть отдельные строки в элементах {{htmlelement("div")}}, соответствующих поведению Chrome, современной Opera, Edge и Safari.

        +

        К счастью, в современных браузерах ситуация несколько более последовательна. Начиная с  Firefox 60,  Firefox будет обновлён, чтобы обернуть отдельные строки в элементах {{htmlelement("div")}}, соответствующих поведению Chrome, современной Opera, Edge и Safari.

        -

        Попробуйте это в приведенном выше примере.

        +

        Попробуйте это в приведённом выше примере.

        Примечание: Internet Explorer, который больше не разрабатывается, использует элементы {{htmlelement("p")}} вместо <div>.

        @@ -103,7 +103,7 @@ user_pref("capability.policy.allowclipboard.Clipboard.paste", "allAccess");Мультимедиа:создание и взаимодействие с видео и звуком;
      • 2D/3D Графика и эффекты: способы значительно разнообразить  представление;
      • Доступ к устройствам: использование разных устройств для ввода и вывода информации;
      • -
      • Стилизация: создание изощренных и совершенных тем.
      • +
      • Стилизация: создание изощрённых и совершенных тем.
    {{event("canplaythrough")}}Отправляется, когда состояние готовности изменяется к CAN_PLAY_THROUGH. Указывает, что медиа может быть полностью воспроизведено без перерыва, предполагая, что скорость загрузки остается, по крайней мере на нынешнем уровне. Примечание: Ручная установка CURRENTTIME вызовет событие canplaythrough в Firefox. В других браузерах это может не произойти.Отправляется, когда состояние готовности изменяется к CAN_PLAY_THROUGH. Указывает, что медиа может быть полностью воспроизведено без перерыва, предполагая, что скорость загрузки остаётся, по крайней мере на нынешнем уровне. Примечание: Ручная установка CURRENTTIME вызовет событие canplaythrough в Firefox. В других браузерах это может не произойти.
    {{event("durationchange")}}
    {{event("progress")}}Отправляется периодически для информирования о прогрессе скачивания медиа файла. Информация об объеме загруженных данных доступна в атрибуте "buffered" элемента медиа.Отправляется периодически для информирования о прогрессе скачивания медиа файла. Информация об объёме загруженных данных доступна в атрибуте "buffered" элемента медиа.
    {{event("ratechange")}}
    {{event("volumechange")}}Отправляется, когда изменяется громкость звука (также когда звук включен или выключен).Отправляется, когда изменяется громкость звука (также когда звук включён или выключен).
    {{event("waiting")}}
    @@ -59,7 +59,7 @@ original_slug: HTML/HTML5
    Server-sent события
    Позволяет серверу отправлять события клиенту, а не по классической парадигме, где сервер может передавать данные только в ответ на запрос клиента.
    WebRTC
    -
    Эта технология, где RTC создает возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.
    +
    Эта технология, где RTC создаёт возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.

    ОФФЛАЙН И ХРАНИЛИЩЕ

    @@ -83,7 +83,7 @@ original_slug: HTML/HTML5
    Использование HTML5 audio и video
    {{ HTMLElement("audio") }} и {{ HTMLElement("video") }} элементы вставляют и позволяют управлять мультимедиа контентом.
    WebRTC
    -
    Эта технология, где RTC создает возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.
    +
    Эта технология, где RTC создаёт возможность общения в реальном времени, позволяет подключаться к другим людям и контролировать видеоконференции непосредственно в браузере, без необходимости плагинов и внешний приложений.
    Использование Camera API
    Позволяет контролировать, манипулировать и хранить изображения с камеры устройства.
    @@ -132,7 +132,7 @@ original_slug: HTML/HTML5
    Pointer Lock API
    Позволяет блокировать курсор, так чтобы игры и подобные приложения не теряли фокус, когда указатель достигает предела окна.
    Online and offline events
    -
    Для того, чтобы построить хорошую оффлайн-совместимые веб-приложения, вы должны знать, когда ваше приложение без сети. Также, вы должны знать, когда ваше приложение снова вернется в сеть.
    +
    Для того, чтобы построить хорошую оффлайн-совместимые веб-приложения, вы должны знать, когда ваше приложение без сети. Также, вы должны знать, когда ваше приложение снова вернётся в сеть.

    доступ к устройствам

    diff --git a/files/ru/web/guide/html/html5/introduction_to_html5/index.html b/files/ru/web/guide/html/html5/introduction_to_html5/index.html index 64b43c9b8a..85b024ad30 100644 --- a/files/ru/web/guide/html/html5/introduction_to_html5/index.html +++ b/files/ru/web/guide/html/html5/introduction_to_html5/index.html @@ -24,4 +24,4 @@ original_slug: HTML/HTML5/Введение_в_HTML5

    Использование нового HTML5 парсера

    The parsing rule of HTML5, which analyzes the meaning of mark-up, has been more precisely defined in HTML5. Until the introduction of HTML5, only the meaning of valid mark-up was defined, meaning that as soon as one small error was made in the mark-up (most Web sites have at least one), the behavior was undefined. Essentially, it meant that all browsers behaved differently, which is no longer the case. Now, faced with errors in the mark-up, all compliant browsers must behave exactly in the same way.

    This requirement helps Web developers quite a bit. While it is true that all modern browsers now use these HTML5 parsing rules, non-HTML5-compliant browsers are still used by some. Keep in mind that it's still highly recommended that one write valid mark-up, as such code is easier to read and maintain, and it greatly decreases the prominence of incompatibilities that exists in various older browsers.

    -

    Не волнуйтесь - вам не придется ничего менять на вашем веб-сайте - разработчики веб-браузерах сделали все для вас!

    +

    Не волнуйтесь - вам не придётся ничего менять на вашем веб-сайте - разработчики веб-браузерах сделали все для вас!

    diff --git a/files/ru/web/guide/html/using_html_sections_and_outlines/index.html b/files/ru/web/guide/html/using_html_sections_and_outlines/index.html index 57fc57b89d..bc5258ab54 100644 --- a/files/ru/web/guide/html/using_html_sections_and_outlines/index.html +++ b/files/ru/web/guide/html/using_html_sections_and_outlines/index.html @@ -14,14 +14,14 @@ translation_of: Web/Guide/HTML/Using_HTML_sections_and_outlines original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document ---
    -

    Важно: В настоящее время нет известных реализаций алгоритма построения структуры документа в графических браузерах или пользовательских приложениях, использующих реабилитационные технологии, хотя такой алгоритм внедрен в другие приложения, например, в средствах проверки соответствия спецификации. Поэтому алгоритм построения структуры нельзя использовать для передачи структуры документа пользователям. Авторы рекомендуют использовать для этой цели степень важности заголовков (h1-h6).

    +

    Важно: В настоящее время нет известных реализаций алгоритма построения структуры документа в графических браузерах или пользовательских приложениях, использующих реабилитационные технологии, хотя такой алгоритм внедрён в другие приложения, например, в средствах проверки соответствия спецификации. Поэтому алгоритм построения структуры нельзя использовать для передачи структуры документа пользователям. Авторы рекомендуют использовать для этой цели степень важности заголовков (h1-h6).

    Спецификация HTML5 предлагает разработчикам несколько новых элементов, позволяющих описывать структуру веб-документа с помощью стандартной семантики. В настоящей статье описываются эти элементы и способы их использования для создания требуемой структуры любого документа.

    Структура документа в HTML 4

    -

    Структура документа, т. е. семантическая структура контента, заключенного в теги  <body> и </body>, является основой для представления страницы пользователю. HTML4 использует для описания структуры страницы разделы и подразделы. Раздел определяется элементом ({{HTMLElement("div")}}) с включенными в него элементами заголовка ({{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}} или {{HTMLElement("h6")}}), содержащими его название. Структура документа определяется отношениями между этими элементами.

    +

    Структура документа, т. е. семантическая структура контента, заключённого в теги  <body> и </body>, является основой для представления страницы пользователю. HTML4 использует для описания структуры страницы разделы и подразделы. Раздел определяется элементом ({{HTMLElement("div")}}) с включёнными в него элементами заголовка ({{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}} или {{HTMLElement("h6")}}), содержащими его название. Структура документа определяется отношениями между этими элементами.

    Так, следующая разметка:

    @@ -67,16 +67,16 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document

    Какие проблемы решает HTML5

    -

    Определение структуры документа и неявный алгоритм создания структуры в HTML 4 не отличаются четкостью, что порождает множество проблем:

    +

    Определение структуры документа и неявный алгоритм создания структуры в HTML 4 не отличаются чёткостью, что порождает множество проблем:

      -
    1. Использование {{HTMLElement("div")}} для задания семантических разделов, без задания специальных значений для атрибутов class не позволяет автоматизировать алгоритм создания структуры («Является ли данный {{HTMLElement("div")}} частью структуры страницы, определяющим раздел или подраздел, или он используется исключительно для управления стилем?»). Другими словами, спецификация HTML4 не дает точного определения разделу и четких правил его определения. Автоматическое создание структуры имеет большое значение, особенно в случае с реабилитационными технологиями, представляющими информацию пользователю в соответствии со структурой документа. HTML5 позволяет больше не использовать элементы {{HTMLElement("div")}} в алгоритме построения структуры благодаря добавлению нового элемента {{HTMLElement("section")}}.
    2. -
    3. Объединить несколько документов в один непросто: включение подчиненного документа в основной документ требует изменения уровня элементов заголовков для сохранения правильной структуры. В HTML5 эта проблема решена благодаря новым элементам задания разделов ({{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}} и {{HTMLElement("aside")}}), которые всегда являются подразделами ближайшего родительского раздела, независимо от того, какие разделы создаются внутренними заголовками.
    4. +
    5. Использование {{HTMLElement("div")}} для задания семантических разделов, без задания специальных значений для атрибутов class не позволяет автоматизировать алгоритм создания структуры («Является ли данный {{HTMLElement("div")}} частью структуры страницы, определяющим раздел или подраздел, или он используется исключительно для управления стилем?»). Другими словами, спецификация HTML4 не даёт точного определения разделу и чётких правил его определения. Автоматическое создание структуры имеет большое значение, особенно в случае с реабилитационными технологиями, представляющими информацию пользователю в соответствии со структурой документа. HTML5 позволяет больше не использовать элементы {{HTMLElement("div")}} в алгоритме построения структуры благодаря добавлению нового элемента {{HTMLElement("section")}}.
    6. +
    7. Объединить несколько документов в один непросто: включение подчинённого документа в основной документ требует изменения уровня элементов заголовков для сохранения правильной структуры. В HTML5 эта проблема решена благодаря новым элементам задания разделов ({{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}} и {{HTMLElement("aside")}}), которые всегда являются подразделами ближайшего родительского раздела, независимо от того, какие разделы создаются внутренними заголовками.
    8. В HTML4 каждый раздел является частью структуры документа. Однако часто документы отличаются сложной, нелинейной структурой. Документ может включать специальные разделы, информация в которых не является частью основного контента, хотя и связана с ним, например, рекламный блок или поясняющая заметка. HTML5 добавляет элемент {{HTMLElement("aside")}}, позволяющий исключить такие разделы из основной структуры.
    9. Опять же, поскольку в HTML4 каждый раздел является частью структуры документа, как быть с разделами, содержащими информацию, касающуюся не конкретного документа, а всего сайта, например, логотипы, оглавления или информация об авторских правах и правовые положения. В HTML5 для этих целей добавлено три новых элемента: {{HTMLElement("nav")}} для наборов ссылок, например, оглавления, {{HTMLElement("footer")}} и {{HTMLElement("header")}} для информации, касающейся всего сайта. Обратите внимание, что {{HTMLElement("header")}} и {{HTMLElement("footer")}} не создают разделы как {{HTMLElement("section")}}, а, скорее, обеспечивают семантическую разметку частей раздела.
    -

    В общем, HTML5 обеспечивает большую точность при задании разделов и оглавлений, позволяя строить более предсказуемую структуру документа, что дает браузерам возможность более качественно обслуживать пользователей.

    +

    В общем, HTML5 обеспечивает большую точность при задании разделов и оглавлений, позволяя строить более предсказуемую структуру документа, что даёт браузерам возможность более качественно обслуживать пользователей.

    Алгоритм создания структуры HTML5

    @@ -106,7 +106,7 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document   <p>(c) 2010 The Example company</p> </footer> -

    Данный фрагмент HTML задает раздел верхнего уровня:

    +

    Данный фрагмент HTML задаёт раздел верхнего уровня:

    <section>
       <h1>Лесные слоны</h1>
    @@ -159,9 +159,9 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document
     
     

    Задание заголовков в HTML5

    -

    Хотя структура определяется элементами задания структуры, она будет практически бесполезна без заголовка. Основное правило очень простой: первый элемент заголовка (это может быть {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}) задает заголовок текущего раздела.

    +

    Хотя структура определяется элементами задания структуры, она будет практически бесполезна без заголовка. Основное правило очень простой: первый элемент заголовка (это может быть {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}) задаёт заголовок текущего раздела.

    -

    Элемент заголовка имеет определенную степень важности, определяемую цифрой в его названии, таким образом, {{HTMLElement("h1")}} имеет максимальную степень важности, а {{HTMLElement("h6")}} минимальную. Соотношение степеней важности имеет смысл только внутри раздела; структура документа определяется структурами разделов, а не степенью важности заголовков разделов. Например, данный код:

    +

    Элемент заголовка имеет определённую степень важности, определяемую цифрой в его названии, таким образом, {{HTMLElement("h1")}} имеет максимальную степень важности, а {{HTMLElement("h6")}} минимальную. Соотношение степеней важности имеет смысл только внутри раздела; структура документа определяется структурами разделов, а не степенью важности заголовков разделов. Например, данный код:

    <section>
       <h1>Лесные слоны</h1>
    @@ -248,10 +248,10 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document
     

    приводит к следующей структуре:

    1. Млекопитающие
    -   1.1 Киты (неявно задается элементом h2)
    -   1.2 Лесные слоны (явным образом задается элементом раздела)
    -   1.3 Монгольская песчанка (неявно задается элементом h3, который одновременно закрывает предыдущий раздел)
    -2. Рептилии (неявно задается элементом h2, который одновременно закрывает предыдущий раздел)
    +   1.1 Киты (неявно задаётся элементом h2)
    +   1.2 Лесные слоны (явным образом задаётся элементом раздела)
    +   1.3 Монгольская песчанка (неявно задаётся элементом h3, который одновременно закрывает предыдущий раздел)
    +2. Рептилии (неявно задаётся элементом h2, который одновременно закрывает предыдущий раздел)
     

    Эта не та структура, которую можно было бы ожидать, бегло просмотрев теги заголовков. Чтобы разметка стала понятна человеку, а также чтобы степень важности заголовка соответствовала уровню вложенности раздела, рекомендуется использовать наглядные теги для открытия и закрытия разделов. Однако спецификация HTML5 этого не требует. Поэтому, если браузеры отображают структуру документа не так, как ожидалось, проверьте, нет ли в документе разделов, не явно закрытых элементами заголовков.

    @@ -260,7 +260,7 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document

    Корни задания разделов

    -

     Корень задания разделов – это элемент HTML, который может иметь собственную структуру, однако входящие в нее разделы и заголовки, не входят в структуру его родительского элемента. Помимо {{HTMLElement("body")}}, который является логическим корнем задания разделов документа, такими элементами часто являются элементы, добавляющие внешний контент на страницу: {{HTMLElement("blockquote")}}, {{HTMLElement("details")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("figure")}} и {{HTMLElement("td")}}.

    +

     Корень задания разделов – это элемент HTML, который может иметь собственную структуру, однако входящие в неё разделы и заголовки, не входят в структуру его родительского элемента. Помимо {{HTMLElement("body")}}, который является логическим корнем задания разделов документа, такими элементами часто являются элементы, добавляющие внешний контент на страницу: {{HTMLElement("blockquote")}}, {{HTMLElement("details")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("figure")}} и {{HTMLElement("td")}}.

    Например:

    @@ -272,10 +272,10 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document   </section>   <section>     <h2>Среда обитания</h2> -    <p>Лесные слоны живут не на деревьях, а под ними. Давайте рассмотрим, что говорят ученые в «<cite>Лесной слон на Борнео</cite>»:</p> +    <p>Лесные слоны живут не на деревьях, а под ними. Давайте рассмотрим, что говорят учёные в «<cite>Лесной слон на Борнео</cite>»:</p>     <blockquote>        <h1>Борнео</h1> -       <p>Лесной слон живет на Борнео...</p> +       <p>Лесной слон живёт на Борнео...</p>     </blockquote>   </section> </section> @@ -294,8 +294,8 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document

     HTML5 вводит два новых элемента, позволяющих задавать разделы, не входящие в основную структуру веб-документа:

      -
    1. Элемент вспомогательного раздела {{HTMLElement("aside")}} задает раздел, который, хотя и связан с основным элементом, не принадлежит к основной структуре, например, поясняющая заметка или реклама. Он имеет собственную структуру, однако не входит в основную структуру страницы.
    2. -
    3. Элемент навигационного раздела {{HTMLElement("nav")}} задает раздел, содержащий навигационные ссылки. Таких элементов в документе может быть несколько, например, один со внутренними ссылками на страницу, например, оглавление, а другой – с ссылками для навигации по сайту. Такие ссылки не являются частью основной структуры документа и как правило пропускаются экранными дикторами.
    4. +
    5. Элемент вспомогательного раздела {{HTMLElement("aside")}} задаёт раздел, который, хотя и связан с основным элементом, не принадлежит к основной структуре, например, поясняющая заметка или реклама. Он имеет собственную структуру, однако не входит в основную структуру страницы.
    6. +
    7. Элемент навигационного раздела {{HTMLElement("nav")}} задаёт раздел, содержащий навигационные ссылки. Таких элементов в документе может быть несколько, например, один со внутренними ссылками на страницу, например, оглавление, а другой – с ссылками для навигации по сайту. Такие ссылки не являются частью основной структуры документа и как правило пропускаются экранными дикторами.

    Шапки и подвалы

    @@ -303,8 +303,8 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document

    HTML5 также добавляет два новых элемента, которые могут использоваться для разметки верхнего и нижнего колонтитулов страниц:

      -
    1. Элемент шапки {{HTMLElement("header")}} задает шапку страницы (как правило, логотип и название сайта, а также горизонтальное меню, если имеется) или раздела (которая может включать заголовок раздела, имя автора и т.д.).{{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}}, и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("header")}}. Несмотря на название, этот элемент не обязательно располагается в начале страницы или раздела.
    2. -
    3. Элемент подвала ({{HTMLElement("footer")}}) задает нижний колонтитул страницы (как правило включающий уведомления об авторских правах и другую правовую информацию, а иногда также содержащий какие-либо ссылки) или раздела (может включать дату публикации, информацию о лицензии и т.п. {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}} и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("footer")}}. Несмотря на название, этот элемент не обязательно располагается в конце страницы или раздела.
    4. +
    5. Элемент шапки {{HTMLElement("header")}} задаёт шапку страницы (как правило, логотип и название сайта, а также горизонтальное меню, если имеется) или раздела (которая может включать заголовок раздела, имя автора и т.д.).{{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}}, и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("header")}}. Несмотря на название, этот элемент не обязательно располагается в начале страницы или раздела.
    6. +
    7. Элемент подвала ({{HTMLElement("footer")}}) задаёт нижний колонтитул страницы (как правило включающий уведомления об авторских правах и другую правовую информацию, а иногда также содержащий какие-либо ссылки) или раздела (может включать дату публикации, информацию о лицензии и т.п. {{HTMLElement("article")}}, {{HTMLElement("section")}}, {{HTMLElement("aside")}} и {{HTMLElement("nav")}} могут иметь собственный {{HTMLElement("footer")}}. Несмотря на название, этот элемент не обязательно располагается в конце страницы или раздела.

    Эти элементы не создают новые разделы в структуре, а скорее используются для разметки контента внутри разделов страницы.

    @@ -313,7 +313,7 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document

    Автор документа часто хочет опубликовать свою контактную информацию, например, имя и адрес. HTML4 позволял сделать это с помощью элемента {{HTMLElement("address")}}, расширенного в HTML5.

    -

    Документ может включать несколько разделов, принадлежащих разным авторам. Если раздел создается не автором основной страницы, для задания используется элемент {{HTMLElement("article")}}. В результате элемент {{HTMLElement("address")}} теперь связан с ближайшим родительским {{HTMLElement("body")}} или {{HTMLElement("article")}}.

    +

    Документ может включать несколько разделов, принадлежащих разным авторам. Если раздел создаётся не автором основной страницы, для задания используется элемент {{HTMLElement("article")}}. В результате элемент {{HTMLElement("address")}} теперь связан с ближайшим родительским {{HTMLElement("body")}} или {{HTMLElement("article")}}.

    Использование элементов HTML5 в браузерах, не поддерживающих HTML5

    @@ -341,7 +341,7 @@ original_slug: Web/Guide/HTML/Sections_and_Outlines_of_an_HTML5_document   </script> <![endif]-->
    -

    Этот скрипт запускается в Internet Explorer (8 и более ранней версии), однако требует включенной поддержки скриптов для правильного отображения элементов задания разделов и заголовок HTML5. Если поддержка скриптов выключена, это может стать проблемой, поскольку данные элементы, скорее всего, определяют структуру всей страницы. Поэтому необходимо добавить элемент {{HTMLElement("noscript")}}:

    +

    Этот скрипт запускается в Internet Explorer (8 и более ранней версии), однако требует включённой поддержки скриптов для правильного отображения элементов задания разделов и заголовок HTML5. Если поддержка скриптов выключена, это может стать проблемой, поскольку данные элементы, скорее всего, определяют структуру всей страницы. Поэтому необходимо добавить элемент {{HTMLElement("noscript")}}:

    <noscript>
        <strong>Внимание!</strong>
    diff --git a/files/ru/web/guide/index.html b/files/ru/web/guide/index.html
    index d2776aed12..a782bc47e9 100644
    --- a/files/ru/web/guide/index.html
    +++ b/files/ru/web/guide/index.html
    @@ -56,7 +56,7 @@ translation_of: Web/Guide
      
    Использование объектов FormData
    Объект FormData позволяет создать набор пар ключ/значение и передать их, используя XMLHttpRequest. Объект FormData предназначен для передачи данных форм, однако может быть использован для передачи пар ключ/значение независимо от форм. Данные передаются в том же формате, как и данные, передаваемые методом {{domxref("HTMLFormElement.submit","submit()")}} формы, с установленной кодировкой enctype="multipart/form-data".
    Пользовательский ввод и управление
    -
    Это руководство содержит рекомендации по обработке пользовательского ввода и внедрению управляющих элементов в веб-приложения. Также здесь Вы найдете соответствующие FAQs, живые примеры, ссылки на более подробные разборы близлежащих технологий.
    +
    Это руководство содержит рекомендации по обработке пользовательского ввода и внедрению управляющих элементов в веб-приложения. Также здесь Вы найдёте соответствующие FAQs, живые примеры, ссылки на более подробные разборы близлежащих технологий.
    Словарь (глоссарий терминов)
    Определения и аббревиатуры в мире Web и Internet.
    diff --git a/files/ru/web/guide/mobile/index.html b/files/ru/web/guide/mobile/index.html index 149b851884..7279b9cc30 100644 --- a/files/ru/web/guide/mobile/index.html +++ b/files/ru/web/guide/mobile/index.html @@ -7,7 +7,7 @@ translation_of: Web/Guide/Mobile ---

    На этой странице даётся обзор основных методов разработки веб-сайтов, корректно работающих на мобильных устройствах. Если вы ищете информацию о проекте Firefox OS от Mozilla, смотрите страницу Firefox OS. Возможно вас также интересует подробная информация о  Firefox для Android.

    -

    Статья разбита на два раздела: разработка под мобильные устройства и кросс-браузерная совместимость.
    +

    Статья разбита на два раздела: разработка под мобильные устройства и кросс-браузерная совместимость.
    См. также руководство от Jason Grlicky по дружелюбность-к-мобильным для веб-разработчиков.

    Разработка под мобильные устройства

    @@ -41,7 +41,7 @@ translation_of: Web/Guide/Mobile

    Наконец, вы можете воспользоваться преимуществом новых возможностей, предлагаемых мобильными устройствами, такие как orientation и geolocation.

    -

    Кросс-браузерная верстка

    +

    Кросс-браузерная вёрстка

    Пишите кросс-браузерный код

    @@ -50,7 +50,7 @@ translation_of: Web/Guide/Mobile
    • Старайтесь избегать использования стилей, специфических для браузеров, таких как свойства CSS с вендорными префиксами.
    • Если всё же вам необходимо ими воспользоваться, убедитесь что другие браузеры применяют свои собственные версии этих свойств, и укажите их.
    • -
    • Для браузеров, которые не поддерживают эти свойства, обеспечьте приемлемый упрощенный вариант.
    • +
    • Для браузеров, которые не поддерживают эти свойства, обеспечьте приемлемый упрощённый вариант.

    Например, если вы указываете градиент в качестве фона для какого-либо текста, используя стиль с вендорным префиксом типа -webkit-linear-gradient, правильнее включить другие варианты с вендор-специфическими префиксами для свойства linear-gradient. Если вы этого не делаете, по крайней мере удостоверьтесь, что фон, отображаемый по умолчанию, контрастирует с текстом: тогда страница, по крайней мере, будет корректно отображаться в браузере, который не воспринимает ваше linear-gradient правило.

    diff --git a/files/ru/web/guide/parsing_and_serializing_xml/index.html b/files/ru/web/guide/parsing_and_serializing_xml/index.html index a99fe9cd84..5304905afc 100644 --- a/files/ru/web/guide/parsing_and_serializing_xml/index.html +++ b/files/ru/web/guide/parsing_and_serializing_xml/index.html @@ -27,11 +27,11 @@ translation_of: Web/Guide/Parsing_and_serializing_XML
    {{domxref("XMLSerializer")}}
    Сериализует деревья DOM, преобразуя их в строки, содержащие XML.
    {{domxref("DOMParser")}}
    -
    Создает дерево DOM, анализируя строку, содержащую XML, возвращая {{domxref ("XMLDocument")}} или {{domxref ("Document")}} в зависимости от входящих данных.
    +
    Создаёт дерево DOM, анализируя строку, содержащую XML, возвращая {{domxref ("XMLDocument")}} или {{domxref ("Document")}} в зависимости от входящих данных.
    {{domxref("XMLHttpRequest")}}
    Загружает контент из URL-адреса; Содержимое XML возвращается как объект XML {{domxref ("Document")}} с деревом DOM, построенным из самого XML.
    XPath
    -
    Технология создания строк, содержащих адреса для определенных частей документа XML, и поиска узлов XML на основе этих адресов.
    +
    Технология создания строк, содержащих адреса для определённых частей документа XML, и поиска узлов XML на основе этих адресов.

    Создание XML-документа

    @@ -69,9 +69,9 @@ xhr.responseType = "document"; xhr.send();
    -

    Значение, возвращаемое в поле {{domxref ("XMLHttpRequest.responseXML", "responseXML")}} объекта xhr, является {{domxref ("Document")}}, созданным путем синтаксического анализа XML.

    +

    Значение, возвращаемое в поле {{domxref ("XMLHttpRequest.responseXML", "responseXML")}} объекта xhr, является {{domxref ("Document")}}, созданным путём синтаксического анализа XML.

    -

    Если документ представляет собой {{Glossary ("HTML")}}, приведенный выше код вернет {{domxref ("Document")}}. Если документ XML, результирующий объект на самом деле является {{domxref ("XMLDocument")}}. Эти два типа по существу одинаковы; разница в основном историческая, хотя дифференциация имеет также некоторые практические преимущества.

    +

    Если документ представляет собой {{Glossary ("HTML")}}, приведённый выше код вернёт {{domxref ("Document")}}. Если документ XML, результирующий объект на самом деле является {{domxref ("XMLDocument")}}. Эти два типа по существу одинаковы; разница в основном историческая, хотя дифференциация имеет также некоторые практические преимущества.

    Примечание: на самом деле существует интерфейс {{domxref ("HTMLDocument")}}, но это не обязательно независимый тип. В некоторых браузерах это так, а в других это просто псевдоним для интерфейса документа.

    @@ -94,7 +94,7 @@ var sXML = oSerializer.serializeToString(doc);

    Serializing HTML documents

    -

    Если у вас есть модель DOM в виде HTML-документа, вы можете сериализовать ее с помощью serializeToString (), но есть более простой вариант: просто используйте свойство {{domxref ("Element.innerHTML")}} (если вам нужны только потомки указанный узел) или свойство {{domxref ("Element.outerHTML")}}, если вам нужен узел и все его потомки.

    +

    Если у вас есть модель DOM в виде HTML-документа, вы можете сериализовать её с помощью serializeToString (), но есть более простой вариант: просто используйте свойство {{domxref ("Element.innerHTML")}} (если вам нужны только потомки указанный узел) или свойство {{domxref ("Element.outerHTML")}}, если вам нужен узел и все его потомки.

    var docHTML = document.documentElement.innerHTML;
     
    diff --git a/files/ru/web/guide/user_input_methods/index.html b/files/ru/web/guide/user_input_methods/index.html index 945fbc3269..ed2af4c050 100644 --- a/files/ru/web/guide/user_input_methods/index.html +++ b/files/ru/web/guide/user_input_methods/index.html @@ -12,7 +12,7 @@ translation_of: Web/Guide/User_input_methods ---

    Это руководство содержит рекомендации по обработке пользовательского ввода - и внедрению управляющих элементов в веб-приложения. Также здесь Вы найдете соответствующие FAQs, живые примеры, ссылки на более подробные разборы близлежащих технологий. + и внедрению управляющих элементов в веб-приложения. Также здесь Вы найдёте соответствующие FAQs, живые примеры, ссылки на более подробные разборы близлежащих технологий. Связанные интерфейсы API и события: события касаний, интерфейс отслеживания указателя мыши, интерфейс ориентации экрана, интерфейс режима "на весь экран", перетаскивание и сброс и т. д.

    -- cgit v1.2.3-54-g00ecf